gear a icon

gear-a from IonIcons by Ben Sperry · Regular · MIT Free for personal and commercial use.

Name
gear-a
Set
IonIcons
Style
Regular
Viewbox
512×512
License
MIT

Related icons in IonIcons

gear-b

Use the gear a icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M411.1 256c0-23.9 14.8-42.8 36.9-55.8-4-13.3-9.3-26.2-15.8-38.2-24.9 6.5-45-3.2-62-20.2-16.9-16.9-22.1-37.1-15.6-62-12-6.5-24.8-11.8-38.2-15.8-13 22.2-36.4 36.9-60.4 36.9-23.9 0-47.4-14.7-60.4-36.9-13.4 4-26.2 9.3-38.2 15.8 6.5 24.9 1.3 45-15.6 62-16.9 16.9-37.1 26.7-61.9 20.2-6.6 12-11.9 24.8-15.9 38.2 22.2 13 37 31.9 37 55.8s-14.8 47.4-37 60.4c4 13.4 9.3 26.2 15.8 38.2 24.9-6.5 45-1.3 61.9 15.6 17 16.9 22.1 37.1 15.6 62 12.1 6.5 24.8 11.8 38.2 15.8 13-22.2 36.5-36.9 60.4-36.9s47.4 14.7 60.4 36.9c13.4-4 26.2-9.3 38.2-15.8-6.5-24.9-1.3-45 15.6-62 16.9-16.9 37.1-26.7 62-20.2 6.5-12.1 11.8-24.9 15.8-38.2-22.1-13-36.8-31.9-36.8-55.8zM256 354.3c-54.2 0-98.3-44-98.3-98.3s44-98.3 98.3-98.3 98.3 44 98.3 98.3-44 98.3-98.3 98.3z" fill="currentColor"/></svg>

React

import type { SVGProps } from "react";

export function IonGearA(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M411.1 256c0-23.9 14.8-42.8 36.9-55.8-4-13.3-9.3-26.2-15.8-38.2-24.9 6.5-45-3.2-62-20.2-16.9-16.9-22.1-37.1-15.6-62-12-6.5-24.8-11.8-38.2-15.8-13 22.2-36.4 36.9-60.4 36.9-23.9 0-47.4-14.7-60.4-36.9-13.4 4-26.2 9.3-38.2 15.8 6.5 24.9 1.3 45-15.6 62-16.9 16.9-37.1 26.7-61.9 20.2-6.6 12-11.9 24.8-15.9 38.2 22.2 13 37 31.9 37 55.8s-14.8 47.4-37 60.4c4 13.4 9.3 26.2 15.8 38.2 24.9-6.5 45-1.3 61.9 15.6 17 16.9 22.1 37.1 15.6 62 12.1 6.5 24.8 11.8 38.2 15.8 13-22.2 36.5-36.9 60.4-36.9s47.4 14.7 60.4 36.9c13.4-4 26.2-9.3 38.2-15.8-6.5-24.9-1.3-45 15.6-62 16.9-16.9 37.1-26.7 62-20.2 6.5-12.1 11.8-24.9 15.8-38.2-22.1-13-36.8-31.9-36.8-55.8zM256 354.3c-54.2 0-98.3-44-98.3-98.3s44-98.3 98.3-98.3 98.3 44 98.3 98.3-44 98.3-98.3 98.3z" fill="currentColor"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M411.1 256c0-23.9 14.8-42.8 36.9-55.8-4-13.3-9.3-26.2-15.8-38.2-24.9 6.5-45-3.2-62-20.2-16.9-16.9-22.1-37.1-15.6-62-12-6.5-24.8-11.8-38.2-15.8-13 22.2-36.4 36.9-60.4 36.9-23.9 0-47.4-14.7-60.4-36.9-13.4 4-26.2 9.3-38.2 15.8 6.5 24.9 1.3 45-15.6 62-16.9 16.9-37.1 26.7-61.9 20.2-6.6 12-11.9 24.8-15.9 38.2 22.2 13 37 31.9 37 55.8s-14.8 47.4-37 60.4c4 13.4 9.3 26.2 15.8 38.2 24.9-6.5 45-1.3 61.9 15.6 17 16.9 22.1 37.1 15.6 62 12.1 6.5 24.8 11.8 38.2 15.8 13-22.2 36.5-36.9 60.4-36.9s47.4 14.7 60.4 36.9c13.4-4 26.2-9.3 38.2-15.8-6.5-24.9-1.3-45 15.6-62 16.9-16.9 37.1-26.7 62-20.2 6.5-12.1 11.8-24.9 15.8-38.2-22.1-13-36.8-31.9-36.8-55.8zM256 354.3c-54.2 0-98.3-44-98.3-98.3s44-98.3 98.3-98.3 98.3 44 98.3 98.3-44 98.3-98.3 98.3z" fill="currentColor"/></svg>
</template>

CSS

.icon-gear-a {
  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%20d%3D%22M411.1%20256c0-23.9%2014.8-42.8%2036.9-55.8-4-13.3-9.3-26.2-15.8-38.2-24.9%206.5-45-3.2-62-20.2-16.9-16.9-22.1-37.1-15.6-62-12-6.5-24.8-11.8-38.2-15.8-13%2022.2-36.4%2036.9-60.4%2036.9-23.9%200-47.4-14.7-60.4-36.9-13.4%204-26.2%209.3-38.2%2015.8%206.5%2024.9%201.3%2045-15.6%2062-16.9%2016.9-37.1%2026.7-61.9%2020.2-6.6%2012-11.9%2024.8-15.9%2038.2%2022.2%2013%2037%2031.9%2037%2055.8s-14.8%2047.4-37%2060.4c4%2013.4%209.3%2026.2%2015.8%2038.2%2024.9-6.5%2045-1.3%2061.9%2015.6%2017%2016.9%2022.1%2037.1%2015.6%2062%2012.1%206.5%2024.8%2011.8%2038.2%2015.8%2013-22.2%2036.5-36.9%2060.4-36.9s47.4%2014.7%2060.4%2036.9c13.4-4%2026.2-9.3%2038.2-15.8-6.5-24.9-1.3-45%2015.6-62%2016.9-16.9%2037.1-26.7%2062-20.2%206.5-12.1%2011.8-24.9%2015.8-38.2-22.1-13-36.8-31.9-36.8-55.8zM256%20354.3c-54.2%200-98.3-44-98.3-98.3s44-98.3%2098.3-98.3%2098.3%2044%2098.3%2098.3-44%2098.3-98.3%2098.3z%22%20fill%3D%22currentColor%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%20d%3D%22M411.1%20256c0-23.9%2014.8-42.8%2036.9-55.8-4-13.3-9.3-26.2-15.8-38.2-24.9%206.5-45-3.2-62-20.2-16.9-16.9-22.1-37.1-15.6-62-12-6.5-24.8-11.8-38.2-15.8-13%2022.2-36.4%2036.9-60.4%2036.9-23.9%200-47.4-14.7-60.4-36.9-13.4%204-26.2%209.3-38.2%2015.8%206.5%2024.9%201.3%2045-15.6%2062-16.9%2016.9-37.1%2026.7-61.9%2020.2-6.6%2012-11.9%2024.8-15.9%2038.2%2022.2%2013%2037%2031.9%2037%2055.8s-14.8%2047.4-37%2060.4c4%2013.4%209.3%2026.2%2015.8%2038.2%2024.9-6.5%2045-1.3%2061.9%2015.6%2017%2016.9%2022.1%2037.1%2015.6%2062%2012.1%206.5%2024.8%2011.8%2038.2%2015.8%2013-22.2%2036.5-36.9%2060.4-36.9s47.4%2014.7%2060.4%2036.9c13.4-4%2026.2-9.3%2038.2-15.8-6.5-24.9-1.3-45%2015.6-62%2016.9-16.9%2037.1-26.7%2062-20.2%206.5-12.1%2011.8-24.9%2015.8-38.2-22.1-13-36.8-31.9-36.8-55.8zM256%20354.3c-54.2%200-98.3-44-98.3-98.3s44-98.3%2098.3-98.3%2098.3%2044%2098.3%2098.3-44%2098.3-98.3%2098.3z%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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