thumb like icon

thumb-like-28-regular from Fluent UI System Icons by Microsoft Corporation · 28 Regular · MIT Free for personal and commercial use.

Name: thumb-like-28-regular
Set: Fluent UI System Icons
Style: 28 Regular
Viewbox: 28×28
License: MIT

9 other variants in Fluent UI System Icons

thumb-like-16-filled thumb-like-16-regular thumb-like-20-filled thumb-like-20-regular thumb-like-24-filled thumb-like-24-regular thumb-like-28-filled thumb-like-48-filled thumb-like-48-regular

Related icons in Fluent UI System Icons

thumb-dislike-16-filled thumb-like-dislike-16-filled

Use the thumb like icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 28 28"><path fill="currentColor" d="M14.304 2.104c.24-.608.936-1.235 1.82-.988c1.778.495 2.452 2.385 2.637 4.154c.157 1.513-.002 3.227-.347 4.73h2.167a3.75 3.75 0 0 1 3.675 4.497l-1.228 6.046a6.75 6.75 0 0 1-8.47 5.146l-7.69-2.197A3.75 3.75 0 0 1 4.2 20.503l-.416-2.496c-.22-1.321.547-2.528 1.648-3.086c4.775-2.417 6.606-7.066 8.612-12.158zm1.432.487a.3.3 0 0 0-.037.064l-.316.802c-1.947 4.957-3.975 10.12-9.273 12.802c-.613.31-.942.927-.847 1.501l.417 2.496a2.25 2.25 0 0 0 1.6 1.794l7.69 2.197a5.25 5.25 0 0 0 6.588-4.003l1.228-6.046A2.25 2.25 0 0 0 20.58 11.5h-3.142a.75.75 0 0 1-.718-.968c.468-1.541.716-3.489.548-5.106c-.175-1.673-.737-2.616-1.513-2.855z"/></svg>

React

import type { SVGProps } from "react";

export function FluentThumbLike28Regular(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 28 28"><path fill="currentColor" d="M14.304 2.104c.24-.608.936-1.235 1.82-.988c1.778.495 2.452 2.385 2.637 4.154c.157 1.513-.002 3.227-.347 4.73h2.167a3.75 3.75 0 0 1 3.675 4.497l-1.228 6.046a6.75 6.75 0 0 1-8.47 5.146l-7.69-2.197A3.75 3.75 0 0 1 4.2 20.503l-.416-2.496c-.22-1.321.547-2.528 1.648-3.086c4.775-2.417 6.606-7.066 8.612-12.158zm1.432.487a.3.3 0 0 0-.037.064l-.316.802c-1.947 4.957-3.975 10.12-9.273 12.802c-.613.31-.942.927-.847 1.501l.417 2.496a2.25 2.25 0 0 0 1.6 1.794l7.69 2.197a5.25 5.25 0 0 0 6.588-4.003l1.228-6.046A2.25 2.25 0 0 0 20.58 11.5h-3.142a.75.75 0 0 1-.718-.968c.468-1.541.716-3.489.548-5.106c-.175-1.673-.737-2.616-1.513-2.855z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 28 28"><path fill="currentColor" d="M14.304 2.104c.24-.608.936-1.235 1.82-.988c1.778.495 2.452 2.385 2.637 4.154c.157 1.513-.002 3.227-.347 4.73h2.167a3.75 3.75 0 0 1 3.675 4.497l-1.228 6.046a6.75 6.75 0 0 1-8.47 5.146l-7.69-2.197A3.75 3.75 0 0 1 4.2 20.503l-.416-2.496c-.22-1.321.547-2.528 1.648-3.086c4.775-2.417 6.606-7.066 8.612-12.158zm1.432.487a.3.3 0 0 0-.037.064l-.316.802c-1.947 4.957-3.975 10.12-9.273 12.802c-.613.31-.942.927-.847 1.501l.417 2.496a2.25 2.25 0 0 0 1.6 1.794l7.69 2.197a5.25 5.25 0 0 0 6.588-4.003l1.228-6.046A2.25 2.25 0 0 0 20.58 11.5h-3.142a.75.75 0 0 1-.718-.968c.468-1.541.716-3.489.548-5.106c-.175-1.673-.737-2.616-1.513-2.855z"/></svg>
</template>

CSS

.icon-thumb-like-28-regular {
  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%2028%2028%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M14.304%202.104c.24-.608.936-1.235%201.82-.988c1.778.495%202.452%202.385%202.637%204.154c.157%201.513-.002%203.227-.347%204.73h2.167a3.75%203.75%200%200%201%203.675%204.497l-1.228%206.046a6.75%206.75%200%200%201-8.47%205.146l-7.69-2.197A3.75%203.75%200%200%201%204.2%2020.503l-.416-2.496c-.22-1.321.547-2.528%201.648-3.086c4.775-2.417%206.606-7.066%208.612-12.158zm1.432.487a.3.3%200%200%200-.037.064l-.316.802c-1.947%204.957-3.975%2010.12-9.273%2012.802c-.613.31-.942.927-.847%201.501l.417%202.496a2.25%202.25%200%200%200%201.6%201.794l7.69%202.197a5.25%205.25%200%200%200%206.588-4.003l1.228-6.046A2.25%202.25%200%200%200%2020.58%2011.5h-3.142a.75.75%200%200%201-.718-.968c.468-1.541.716-3.489.548-5.106c-.175-1.673-.737-2.616-1.513-2.855z%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%2028%2028%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M14.304%202.104c.24-.608.936-1.235%201.82-.988c1.778.495%202.452%202.385%202.637%204.154c.157%201.513-.002%203.227-.347%204.73h2.167a3.75%203.75%200%200%201%203.675%204.497l-1.228%206.046a6.75%206.75%200%200%201-8.47%205.146l-7.69-2.197A3.75%203.75%200%200%201%204.2%2020.503l-.416-2.496c-.22-1.321.547-2.528%201.648-3.086c4.775-2.417%206.606-7.066%208.612-12.158zm1.432.487a.3.3%200%200%200-.037.064l-.316.802c-1.947%204.957-3.975%2010.12-9.273%2012.802c-.613.31-.942.927-.847%201.501l.417%202.496a2.25%202.25%200%200%200%201.6%201.794l7.69%202.197a5.25%205.25%200%200%200%206.588-4.003l1.228-6.046A2.25%202.25%200%200%200%2020.58%2011.5h-3.142a.75.75%200%200%201-.718-.968c.468-1.541.716-3.489.548-5.106c-.175-1.673-.737-2.616-1.513-2.855z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/thumb-like-28-regular.svg?color=%231a73e8&size=48