thumbs down icon

thumbs-down-outline from IonIcons by Ben Sperry · Outline · MIT Free for personal and commercial use.

Name
thumbs-down-outline
Set
IonIcons
Style
Outline
Viewbox
512×512
License
MIT

2 other variants in IonIcons

The same icon in other sets

Related icons in IonIcons

Use the thumbs down icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M192 53.84S208 48 256 48s74 16 96 32h64a64 64 0 0 1 64 64v48a64 64 0 0 1-64 64h-30a32.34 32.34 0 0 0-27.37 15.4S350 290.19 324 335.22S248 448 240 464c-29 0-43-22-34-47.71c10.28-29.39 23.71-54.38 27.46-87.09c.54-4.78-3.14-12-8-12L96 307"/><path fill="none" stroke="currentColor" stroke-miterlimit="10" stroke-width="32" d="m96 241l80 2c20 1.84 32 12.4 32 30s-14 28.84-32 30l-80 4c-17.6 0-32-16.4-32-34v-.17A32 32 0 0 1 96 241Zm-32-65l112 2c18 .84 32 12.41 32 30c0 17.61-14 28.86-32 30l-112 2a32.1 32.1 0 0 1-32-32a32.1 32.1 0 0 1 32-32Zm48-128l64 3c21 1.84 32 11.4 32 29s-14.4 30-32 30l-64 2a32.09 32.09 0 0 1-32-32a32.09 32.09 0 0 1 32-32Zm-32 64l96 2c19 .84 32 12.4 32 30s-13 28.84-32 30l-96 2a32.09 32.09 0 0 1-32-32a32.09 32.09 0 0 1 32-32Z"/></svg>

React

import type { SVGProps } from "react";

export function IonThumbsDownOutline(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="32" d="M192 53.84S208 48 256 48s74 16 96 32h64a64 64 0 0 1 64 64v48a64 64 0 0 1-64 64h-30a32.34 32.34 0 0 0-27.37 15.4S350 290.19 324 335.22S248 448 240 464c-29 0-43-22-34-47.71c10.28-29.39 23.71-54.38 27.46-87.09c.54-4.78-3.14-12-8-12L96 307"/><path fill="none" stroke="currentColor" strokeMiterlimit="10" strokeWidth="32" d="m96 241l80 2c20 1.84 32 12.4 32 30s-14 28.84-32 30l-80 4c-17.6 0-32-16.4-32-34v-.17A32 32 0 0 1 96 241Zm-32-65l112 2c18 .84 32 12.41 32 30c0 17.61-14 28.86-32 30l-112 2a32.1 32.1 0 0 1-32-32a32.1 32.1 0 0 1 32-32Zm48-128l64 3c21 1.84 32 11.4 32 29s-14.4 30-32 30l-64 2a32.09 32.09 0 0 1-32-32a32.09 32.09 0 0 1 32-32Zm-32 64l96 2c19 .84 32 12.4 32 30s-13 28.84-32 30l-96 2a32.09 32.09 0 0 1-32-32a32.09 32.09 0 0 1 32-32Z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M192 53.84S208 48 256 48s74 16 96 32h64a64 64 0 0 1 64 64v48a64 64 0 0 1-64 64h-30a32.34 32.34 0 0 0-27.37 15.4S350 290.19 324 335.22S248 448 240 464c-29 0-43-22-34-47.71c10.28-29.39 23.71-54.38 27.46-87.09c.54-4.78-3.14-12-8-12L96 307"/><path fill="none" stroke="currentColor" stroke-miterlimit="10" stroke-width="32" d="m96 241l80 2c20 1.84 32 12.4 32 30s-14 28.84-32 30l-80 4c-17.6 0-32-16.4-32-34v-.17A32 32 0 0 1 96 241Zm-32-65l112 2c18 .84 32 12.41 32 30c0 17.61-14 28.86-32 30l-112 2a32.1 32.1 0 0 1-32-32a32.1 32.1 0 0 1 32-32Zm48-128l64 3c21 1.84 32 11.4 32 29s-14.4 30-32 30l-64 2a32.09 32.09 0 0 1-32-32a32.09 32.09 0 0 1 32-32Zm-32 64l96 2c19 .84 32 12.4 32 30s-13 28.84-32 30l-96 2a32.09 32.09 0 0 1-32-32a32.09 32.09 0 0 1 32-32Z"/></svg>
</template>

CSS

.icon-thumbs-down-outline {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%2232%22%20d%3D%22M192%2053.84S208%2048%20256%2048s74%2016%2096%2032h64a64%2064%200%200%201%2064%2064v48a64%2064%200%200%201-64%2064h-30a32.34%2032.34%200%200%200-27.37%2015.4S350%20290.19%20324%20335.22S248%20448%20240%20464c-29%200-43-22-34-47.71c10.28-29.39%2023.71-54.38%2027.46-87.09c.54-4.78-3.14-12-8-12L96%20307%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%2232%22%20d%3D%22m96%20241l80%202c20%201.84%2032%2012.4%2032%2030s-14%2028.84-32%2030l-80%204c-17.6%200-32-16.4-32-34v-.17A32%2032%200%200%201%2096%20241Zm-32-65l112%202c18%20.84%2032%2012.41%2032%2030c0%2017.61-14%2028.86-32%2030l-112%202a32.1%2032.1%200%200%201-32-32a32.1%2032.1%200%200%201%2032-32Zm48-128l64%203c21%201.84%2032%2011.4%2032%2029s-14.4%2030-32%2030l-64%202a32.09%2032.09%200%200%201-32-32a32.09%2032.09%200%200%201%2032-32Zm-32%2064l96%202c19%20.84%2032%2012.4%2032%2030s-13%2028.84-32%2030l-96%202a32.09%2032.09%200%200%201-32-32a32.09%2032.09%200%200%201%2032-32Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%2232%22%20d%3D%22M192%2053.84S208%2048%20256%2048s74%2016%2096%2032h64a64%2064%200%200%201%2064%2064v48a64%2064%200%200%201-64%2064h-30a32.34%2032.34%200%200%200-27.37%2015.4S350%20290.19%20324%20335.22S248%20448%20240%20464c-29%200-43-22-34-47.71c10.28-29.39%2023.71-54.38%2027.46-87.09c.54-4.78-3.14-12-8-12L96%20307%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%2232%22%20d%3D%22m96%20241l80%202c20%201.84%2032%2012.4%2032%2030s-14%2028.84-32%2030l-80%204c-17.6%200-32-16.4-32-34v-.17A32%2032%200%200%201%2096%20241Zm-32-65l112%202c18%20.84%2032%2012.41%2032%2030c0%2017.61-14%2028.86-32%2030l-112%202a32.1%2032.1%200%200%201-32-32a32.1%2032.1%200%200%201%2032-32Zm48-128l64%203c21%201.84%2032%2011.4%2032%2029s-14.4%2030-32%2030l-64%202a32.09%2032.09%200%200%201-32-32a32.09%2032.09%200%200%201%2032-32Zm-32%2064l96%202c19%20.84%2032%2012.4%2032%2030s-13%2028.84-32%2030l-96%202a32.09%2032.09%200%200%201-32-32a32.09%2032.09%200%200%201%2032-32Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/thumbs-down-outline.svg?color=%231a73e8&size=48