gavel icon

gavel-thin from Phosphor by Phosphor Icons · Thin · MIT Free for personal and commercial use.

Name: gavel-thin
Set: Phosphor
Style: Thin
Viewbox: 256×256
License: MIT

5 other variants in Phosphor

gavel gavel-bold gavel-duotone gavel-fill gavel-light

The same icon in other sets

gavelFont Awesome 6 Solid gavelFont Awesome Solid gavel-16-filledFluent UI System Icons gavelHuge Icons gavelIconPark gavelIconPark Outline gavelIconPark Solid gavelIconPark TwoTone gavelLine Awesome gavelLucide gavelMaterial Symbols gavelMaterial Symbols Light gavelMaterial Design Icons gavelTabler Icons

Use the gavel icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="m240.49 119.52l-16-16a12 12 0 0 0-17 0l-1.17 1.17l-55-55l1.18-1.17a12 12 0 0 0 0-17l-16-16a12 12 0 0 0-17 0l-64 64a12 12 0 0 0 0 17l16 16a12 12 0 0 0 17 0l1.17-1.18L102.34 124l-68.2 68.21a21 21 0 0 0 29.66 29.66l68.2-68.21l12.69 12.69l-1.18 1.17a12 12 0 0 0 0 17l16 16a12 12 0 0 0 17 0l64-64a12 12 0 0 0 0-17ZM77.17 106.83l-16-16a4 4 0 0 1 0-5.66l64-64a4 4 0 0 1 5.66 0l16 16a4 4 0 0 1 0 5.65l-64 64a4 4 0 0 1-5.66.01m-19 109.38a13 13 0 1 1-18.37-18.34l68.2-68.21L126.34 148Zm37.14-110.55l50.35-50.35l55 55l-50.35 50.35Zm139.52 25.17l-64 64a4 4 0 0 1-5.66 0l-16-16a4 4 0 0 1 0-5.65l64-64a4 4 0 0 1 5.66 0l16 16a4 4 0 0 1 0 5.66Z"/></svg>

React

import type { SVGProps } from "react";

export function PhGavelThin(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="m240.49 119.52l-16-16a12 12 0 0 0-17 0l-1.17 1.17l-55-55l1.18-1.17a12 12 0 0 0 0-17l-16-16a12 12 0 0 0-17 0l-64 64a12 12 0 0 0 0 17l16 16a12 12 0 0 0 17 0l1.17-1.18L102.34 124l-68.2 68.21a21 21 0 0 0 29.66 29.66l68.2-68.21l12.69 12.69l-1.18 1.17a12 12 0 0 0 0 17l16 16a12 12 0 0 0 17 0l64-64a12 12 0 0 0 0-17ZM77.17 106.83l-16-16a4 4 0 0 1 0-5.66l64-64a4 4 0 0 1 5.66 0l16 16a4 4 0 0 1 0 5.65l-64 64a4 4 0 0 1-5.66.01m-19 109.38a13 13 0 1 1-18.37-18.34l68.2-68.21L126.34 148Zm37.14-110.55l50.35-50.35l55 55l-50.35 50.35Zm139.52 25.17l-64 64a4 4 0 0 1-5.66 0l-16-16a4 4 0 0 1 0-5.65l64-64a4 4 0 0 1 5.66 0l16 16a4 4 0 0 1 0 5.66Z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="m240.49 119.52l-16-16a12 12 0 0 0-17 0l-1.17 1.17l-55-55l1.18-1.17a12 12 0 0 0 0-17l-16-16a12 12 0 0 0-17 0l-64 64a12 12 0 0 0 0 17l16 16a12 12 0 0 0 17 0l1.17-1.18L102.34 124l-68.2 68.21a21 21 0 0 0 29.66 29.66l68.2-68.21l12.69 12.69l-1.18 1.17a12 12 0 0 0 0 17l16 16a12 12 0 0 0 17 0l64-64a12 12 0 0 0 0-17ZM77.17 106.83l-16-16a4 4 0 0 1 0-5.66l64-64a4 4 0 0 1 5.66 0l16 16a4 4 0 0 1 0 5.65l-64 64a4 4 0 0 1-5.66.01m-19 109.38a13 13 0 1 1-18.37-18.34l68.2-68.21L126.34 148Zm37.14-110.55l50.35-50.35l55 55l-50.35 50.35Zm139.52 25.17l-64 64a4 4 0 0 1-5.66 0l-16-16a4 4 0 0 1 0-5.65l64-64a4 4 0 0 1 5.66 0l16 16a4 4 0 0 1 0 5.66Z"/></svg>
</template>

CSS

.icon-gavel-thin {
  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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m240.49%20119.52l-16-16a12%2012%200%200%200-17%200l-1.17%201.17l-55-55l1.18-1.17a12%2012%200%200%200%200-17l-16-16a12%2012%200%200%200-17%200l-64%2064a12%2012%200%200%200%200%2017l16%2016a12%2012%200%200%200%2017%200l1.17-1.18L102.34%20124l-68.2%2068.21a21%2021%200%200%200%2029.66%2029.66l68.2-68.21l12.69%2012.69l-1.18%201.17a12%2012%200%200%200%200%2017l16%2016a12%2012%200%200%200%2017%200l64-64a12%2012%200%200%200%200-17ZM77.17%20106.83l-16-16a4%204%200%200%201%200-5.66l64-64a4%204%200%200%201%205.66%200l16%2016a4%204%200%200%201%200%205.65l-64%2064a4%204%200%200%201-5.66.01m-19%20109.38a13%2013%200%201%201-18.37-18.34l68.2-68.21L126.34%20148Zm37.14-110.55l50.35-50.35l55%2055l-50.35%2050.35Zm139.52%2025.17l-64%2064a4%204%200%200%201-5.66%200l-16-16a4%204%200%200%201%200-5.65l64-64a4%204%200%200%201%205.66%200l16%2016a4%204%200%200%201%200%205.66Z%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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m240.49%20119.52l-16-16a12%2012%200%200%200-17%200l-1.17%201.17l-55-55l1.18-1.17a12%2012%200%200%200%200-17l-16-16a12%2012%200%200%200-17%200l-64%2064a12%2012%200%200%200%200%2017l16%2016a12%2012%200%200%200%2017%200l1.17-1.18L102.34%20124l-68.2%2068.21a21%2021%200%200%200%2029.66%2029.66l68.2-68.21l12.69%2012.69l-1.18%201.17a12%2012%200%200%200%200%2017l16%2016a12%2012%200%200%200%2017%200l64-64a12%2012%200%200%200%200-17ZM77.17%20106.83l-16-16a4%204%200%200%201%200-5.66l64-64a4%204%200%200%201%205.66%200l16%2016a4%204%200%200%201%200%205.65l-64%2064a4%204%200%200%201-5.66.01m-19%20109.38a13%2013%200%201%201-18.37-18.34l68.2-68.21L126.34%20148Zm37.14-110.55l50.35-50.35l55%2055l-50.35%2050.35Zm139.52%2025.17l-64%2064a4%204%200%200%201-5.66%200l-16-16a4%204%200%200%201%200-5.65l64-64a4%204%200%200%201%205.66%200l16%2016a4%204%200%200%201%200%205.66Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/gavel-thin.svg?color=%231a73e8&size=48