thumbs up icon

thumbs-up-fill from Keyline Icons by Keyline Icons · Fill · MIT Free for personal and commercial use.

Name
thumbs-up-fill
Set
Keyline Icons
Style
Fill
Viewbox
24×24
License
MIT

7 other variants in Keyline Icons

thumbs-upthumbs-up-duotonethumbs-up-sharpthumbs-up-sharp-duotonethumbs-up-sharp-fillthumbs-up-sharp-two-tonethumbs-up-two-tone

The same icon in other sets

thumbs-upAkar Iconsthumbs-upCarbonthumbs-upEmoji One (Colored)thumbs-upFont Awesome 6 Regularthumbs-upFont Awesome 6 Solidthumbs-upFont Awesome Regularthumbs-upFont Awesome Solidthumbs-upFeather Iconsthumbs-up-outlineFlowbite Iconsthumbs-upFluent Emojithumbs-upFluent Emoji Flatthumbs-upFluent Emoji High Contrastthumbs-upHuge Iconsthumbs-upIconParkthumbs-upIconPark Outlinethumbs-upIconPark Solidthumbs-upIconPark TwoTonethumbs-upIconoirthumbs-upIonIconsthumbs-upLine Awesomethumbs-upMaterial Line Iconsthumbs-upLucidethumbs-upMage Iconsthumbs-upNoto Emoji

Related icons in Keyline Icons

thumbs-down

Use the thumbs up icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M4 9L7.2192 9L8.6511 3.2724C8.985 1.9369 10.1849 1 11.5616 1L13.2344 1C14.7474 1 16.0236 2.1266 16.2113 3.6279L16.8828 9L20 9C21.6569 9 23 10.3431 23 12C23 12.3597 22.9353 12.7165 22.809 13.0534L19.809 21.0534C19.3699 22.2243 18.2505 23 17 23L4 23C2.3431 23 1 21.6569 1 20L1 12C1 10.3431 2.3431 9 4 9ZM4 11C3.4477 11 3 11.4477 3 12L3 20C3 20.5523 3.4477 21 4 21L6 21C6.5523 21 7 20.5523 7 20L7 12C7 11.4477 6.5523 11 6 11L4 11Z"/></svg>

React

import type { SVGProps } from "react";

export function KeylineIconsThumbsUpFill(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M4 9L7.2192 9L8.6511 3.2724C8.985 1.9369 10.1849 1 11.5616 1L13.2344 1C14.7474 1 16.0236 2.1266 16.2113 3.6279L16.8828 9L20 9C21.6569 9 23 10.3431 23 12C23 12.3597 22.9353 12.7165 22.809 13.0534L19.809 21.0534C19.3699 22.2243 18.2505 23 17 23L4 23C2.3431 23 1 21.6569 1 20L1 12C1 10.3431 2.3431 9 4 9ZM4 11C3.4477 11 3 11.4477 3 12L3 20C3 20.5523 3.4477 21 4 21L6 21C6.5523 21 7 20.5523 7 20L7 12C7 11.4477 6.5523 11 6 11L4 11Z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M4 9L7.2192 9L8.6511 3.2724C8.985 1.9369 10.1849 1 11.5616 1L13.2344 1C14.7474 1 16.0236 2.1266 16.2113 3.6279L16.8828 9L20 9C21.6569 9 23 10.3431 23 12C23 12.3597 22.9353 12.7165 22.809 13.0534L19.809 21.0534C19.3699 22.2243 18.2505 23 17 23L4 23C2.3431 23 1 21.6569 1 20L1 12C1 10.3431 2.3431 9 4 9ZM4 11C3.4477 11 3 11.4477 3 12L3 20C3 20.5523 3.4477 21 4 21L6 21C6.5523 21 7 20.5523 7 20L7 12C7 11.4477 6.5523 11 6 11L4 11Z"/></svg>
</template>

CSS

.icon-thumbs-up-fill {
  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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M4%209L7.2192%209L8.6511%203.2724C8.985%201.9369%2010.1849%201%2011.5616%201L13.2344%201C14.7474%201%2016.0236%202.1266%2016.2113%203.6279L16.8828%209L20%209C21.6569%209%2023%2010.3431%2023%2012C23%2012.3597%2022.9353%2012.7165%2022.809%2013.0534L19.809%2021.0534C19.3699%2022.2243%2018.2505%2023%2017%2023L4%2023C2.3431%2023%201%2021.6569%201%2020L1%2012C1%2010.3431%202.3431%209%204%209ZM4%2011C3.4477%2011%203%2011.4477%203%2012L3%2020C3%2020.5523%203.4477%2021%204%2021L6%2021C6.5523%2021%207%2020.5523%207%2020L7%2012C7%2011.4477%206.5523%2011%206%2011L4%2011Z%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M4%209L7.2192%209L8.6511%203.2724C8.985%201.9369%2010.1849%201%2011.5616%201L13.2344%201C14.7474%201%2016.0236%202.1266%2016.2113%203.6279L16.8828%209L20%209C21.6569%209%2023%2010.3431%2023%2012C23%2012.3597%2022.9353%2012.7165%2022.809%2013.0534L19.809%2021.0534C19.3699%2022.2243%2018.2505%2023%2017%2023L4%2023C2.3431%2023%201%2021.6569%201%2020L1%2012C1%2010.3431%202.3431%209%204%209ZM4%2011C3.4477%2011%203%2011.4477%203%2012L3%2020C3%2020.5523%203.4477%2021%204%2021L6%2021C6.5523%2021%207%2020.5523%207%2020L7%2012C7%2011.4477%206.5523%2011%206%2011L4%2011Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/keyline-icons/thumbs-up-fill.svg?color=%231a73e8&size=48