gavel icon

gavel-rounded from Material Symbols by Google · Rounded · Social · Apache-2.0 Free for personal and commercial use.

Name: gavel-rounded
Set: Material Symbols
Style: Rounded
Category: Social
Viewbox: 24×24
License: Apache 2.0
Aliases: gavel-outline-rounded

1 other variant in Material Symbols

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 Light gavelMaterial Design Icons gavelPhosphor gavelTabler Icons

More social icons from Material Symbols

Use the gavel icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M5 19h10q.425 0 .713.288T16 20t-.288.713T15 21H5q-.425 0-.712-.288T4 20t.288-.712T5 19m3.225-4.275L5.4 11.9q-.575-.575-.587-1.412t.562-1.413L6.1 8.35L11.8 14l-.725.725q-.575.575-1.425.575t-1.425-.575M16 9.8l-5.65-5.7l.725-.725q.575-.575 1.413-.562T13.9 3.4l2.825 2.825q.575.575.575 1.425t-.575 1.425zm3.9 9.5L7.55 6.95l1.4-1.4L21.3 17.9q.275.275.275.7t-.275.7t-.7.275t-.7-.275"/></svg>

React

import type { SVGProps } from "react";

export function MaterialSymbolsGavelRounded(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="M5 19h10q.425 0 .713.288T16 20t-.288.713T15 21H5q-.425 0-.712-.288T4 20t.288-.712T5 19m3.225-4.275L5.4 11.9q-.575-.575-.587-1.412t.562-1.413L6.1 8.35L11.8 14l-.725.725q-.575.575-1.425.575t-1.425-.575M16 9.8l-5.65-5.7l.725-.725q.575-.575 1.413-.562T13.9 3.4l2.825 2.825q.575.575.575 1.425t-.575 1.425zm3.9 9.5L7.55 6.95l1.4-1.4L21.3 17.9q.275.275.275.7t-.275.7t-.7.275t-.7-.275"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M5 19h10q.425 0 .713.288T16 20t-.288.713T15 21H5q-.425 0-.712-.288T4 20t.288-.712T5 19m3.225-4.275L5.4 11.9q-.575-.575-.587-1.412t.562-1.413L6.1 8.35L11.8 14l-.725.725q-.575.575-1.425.575t-1.425-.575M16 9.8l-5.65-5.7l.725-.725q.575-.575 1.413-.562T13.9 3.4l2.825 2.825q.575.575.575 1.425t-.575 1.425zm3.9 9.5L7.55 6.95l1.4-1.4L21.3 17.9q.275.275.275.7t-.275.7t-.7.275t-.7-.275"/></svg>
</template>

CSS

.icon-gavel-rounded {
  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%22M5%2019h10q.425%200%20.713.288T16%2020t-.288.713T15%2021H5q-.425%200-.712-.288T4%2020t.288-.712T5%2019m3.225-4.275L5.4%2011.9q-.575-.575-.587-1.412t.562-1.413L6.1%208.35L11.8%2014l-.725.725q-.575.575-1.425.575t-1.425-.575M16%209.8l-5.65-5.7l.725-.725q.575-.575%201.413-.562T13.9%203.4l2.825%202.825q.575.575.575%201.425t-.575%201.425zm3.9%209.5L7.55%206.95l1.4-1.4L21.3%2017.9q.275.275.275.7t-.275.7t-.7.275t-.7-.275%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%22M5%2019h10q.425%200%20.713.288T16%2020t-.288.713T15%2021H5q-.425%200-.712-.288T4%2020t.288-.712T5%2019m3.225-4.275L5.4%2011.9q-.575-.575-.587-1.412t.562-1.413L6.1%208.35L11.8%2014l-.725.725q-.575.575-1.425.575t-1.425-.575M16%209.8l-5.65-5.7l.725-.725q.575-.575%201.413-.562T13.9%203.4l2.825%202.825q.575.575.575%201.425t-.575%201.425zm3.9%209.5L7.55%206.95l1.4-1.4L21.3%2017.9q.275.275.275.7t-.275.7t-.7.275t-.7-.275%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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