gear-fill from Phosphor by Phosphor Icons · Fill · MIT Free for personal and commercial use.

Name
gear-fill
Set
Phosphor
Style
Fill
Viewbox
256×256
License
MIT

5 other variants in Phosphor

The same icon in other sets

Related icons in Phosphor

Use the gear icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M216 130.16q.06-2.16 0-4.32l14.92-18.64a8 8 0 0 0 1.48-7.06a107.6 107.6 0 0 0-10.88-26.25a8 8 0 0 0-6-3.93l-23.72-2.64q-1.48-1.56-3-3L186 40.54a8 8 0 0 0-3.94-6a107.3 107.3 0 0 0-26.25-10.86a8 8 0 0 0-7.06 1.48L130.16 40h-4.32L107.2 25.11a8 8 0 0 0-7.06-1.48a107.6 107.6 0 0 0-26.25 10.88a8 8 0 0 0-3.93 6l-2.64 23.76q-1.56 1.49-3 3L40.54 70a8 8 0 0 0-6 3.94a107.7 107.7 0 0 0-10.87 26.25a8 8 0 0 0 1.49 7.06L40 125.84v4.32L25.11 148.8a8 8 0 0 0-1.48 7.06a107.6 107.6 0 0 0 10.88 26.25a8 8 0 0 0 6 3.93l23.72 2.64q1.49 1.56 3 3L70 215.46a8 8 0 0 0 3.94 6a107.7 107.7 0 0 0 26.25 10.87a8 8 0 0 0 7.06-1.49L125.84 216q2.16.06 4.32 0l18.64 14.92a8 8 0 0 0 7.06 1.48a107.2 107.2 0 0 0 26.25-10.88a8 8 0 0 0 3.93-6l2.64-23.72q1.56-1.48 3-3l23.78-2.8a8 8 0 0 0 6-3.94a107.7 107.7 0 0 0 10.87-26.25a8 8 0 0 0-1.49-7.06ZM128 168a40 40 0 1 1 40-40a40 40 0 0 1-40 40"/></svg>

React

import type { SVGProps } from "react";

export function PhGearFill(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="M216 130.16q.06-2.16 0-4.32l14.92-18.64a8 8 0 0 0 1.48-7.06a107.6 107.6 0 0 0-10.88-26.25a8 8 0 0 0-6-3.93l-23.72-2.64q-1.48-1.56-3-3L186 40.54a8 8 0 0 0-3.94-6a107.3 107.3 0 0 0-26.25-10.86a8 8 0 0 0-7.06 1.48L130.16 40h-4.32L107.2 25.11a8 8 0 0 0-7.06-1.48a107.6 107.6 0 0 0-26.25 10.88a8 8 0 0 0-3.93 6l-2.64 23.76q-1.56 1.49-3 3L40.54 70a8 8 0 0 0-6 3.94a107.7 107.7 0 0 0-10.87 26.25a8 8 0 0 0 1.49 7.06L40 125.84v4.32L25.11 148.8a8 8 0 0 0-1.48 7.06a107.6 107.6 0 0 0 10.88 26.25a8 8 0 0 0 6 3.93l23.72 2.64q1.49 1.56 3 3L70 215.46a8 8 0 0 0 3.94 6a107.7 107.7 0 0 0 26.25 10.87a8 8 0 0 0 7.06-1.49L125.84 216q2.16.06 4.32 0l18.64 14.92a8 8 0 0 0 7.06 1.48a107.2 107.2 0 0 0 26.25-10.88a8 8 0 0 0 3.93-6l2.64-23.72q1.56-1.48 3-3l23.78-2.8a8 8 0 0 0 6-3.94a107.7 107.7 0 0 0 10.87-26.25a8 8 0 0 0-1.49-7.06ZM128 168a40 40 0 1 1 40-40a40 40 0 0 1-40 40"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M216 130.16q.06-2.16 0-4.32l14.92-18.64a8 8 0 0 0 1.48-7.06a107.6 107.6 0 0 0-10.88-26.25a8 8 0 0 0-6-3.93l-23.72-2.64q-1.48-1.56-3-3L186 40.54a8 8 0 0 0-3.94-6a107.3 107.3 0 0 0-26.25-10.86a8 8 0 0 0-7.06 1.48L130.16 40h-4.32L107.2 25.11a8 8 0 0 0-7.06-1.48a107.6 107.6 0 0 0-26.25 10.88a8 8 0 0 0-3.93 6l-2.64 23.76q-1.56 1.49-3 3L40.54 70a8 8 0 0 0-6 3.94a107.7 107.7 0 0 0-10.87 26.25a8 8 0 0 0 1.49 7.06L40 125.84v4.32L25.11 148.8a8 8 0 0 0-1.48 7.06a107.6 107.6 0 0 0 10.88 26.25a8 8 0 0 0 6 3.93l23.72 2.64q1.49 1.56 3 3L70 215.46a8 8 0 0 0 3.94 6a107.7 107.7 0 0 0 26.25 10.87a8 8 0 0 0 7.06-1.49L125.84 216q2.16.06 4.32 0l18.64 14.92a8 8 0 0 0 7.06 1.48a107.2 107.2 0 0 0 26.25-10.88a8 8 0 0 0 3.93-6l2.64-23.72q1.56-1.48 3-3l23.78-2.8a8 8 0 0 0 6-3.94a107.7 107.7 0 0 0 10.87-26.25a8 8 0 0 0-1.49-7.06ZM128 168a40 40 0 1 1 40-40a40 40 0 0 1-40 40"/></svg>
</template>

CSS

.icon-gear-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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M216%20130.16q.06-2.16%200-4.32l14.92-18.64a8%208%200%200%200%201.48-7.06a107.6%20107.6%200%200%200-10.88-26.25a8%208%200%200%200-6-3.93l-23.72-2.64q-1.48-1.56-3-3L186%2040.54a8%208%200%200%200-3.94-6a107.3%20107.3%200%200%200-26.25-10.86a8%208%200%200%200-7.06%201.48L130.16%2040h-4.32L107.2%2025.11a8%208%200%200%200-7.06-1.48a107.6%20107.6%200%200%200-26.25%2010.88a8%208%200%200%200-3.93%206l-2.64%2023.76q-1.56%201.49-3%203L40.54%2070a8%208%200%200%200-6%203.94a107.7%20107.7%200%200%200-10.87%2026.25a8%208%200%200%200%201.49%207.06L40%20125.84v4.32L25.11%20148.8a8%208%200%200%200-1.48%207.06a107.6%20107.6%200%200%200%2010.88%2026.25a8%208%200%200%200%206%203.93l23.72%202.64q1.49%201.56%203%203L70%20215.46a8%208%200%200%200%203.94%206a107.7%20107.7%200%200%200%2026.25%2010.87a8%208%200%200%200%207.06-1.49L125.84%20216q2.16.06%204.32%200l18.64%2014.92a8%208%200%200%200%207.06%201.48a107.2%20107.2%200%200%200%2026.25-10.88a8%208%200%200%200%203.93-6l2.64-23.72q1.56-1.48%203-3l23.78-2.8a8%208%200%200%200%206-3.94a107.7%20107.7%200%200%200%2010.87-26.25a8%208%200%200%200-1.49-7.06ZM128%20168a40%2040%200%201%201%2040-40a40%2040%200%200%201-40%2040%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%22M216%20130.16q.06-2.16%200-4.32l14.92-18.64a8%208%200%200%200%201.48-7.06a107.6%20107.6%200%200%200-10.88-26.25a8%208%200%200%200-6-3.93l-23.72-2.64q-1.48-1.56-3-3L186%2040.54a8%208%200%200%200-3.94-6a107.3%20107.3%200%200%200-26.25-10.86a8%208%200%200%200-7.06%201.48L130.16%2040h-4.32L107.2%2025.11a8%208%200%200%200-7.06-1.48a107.6%20107.6%200%200%200-26.25%2010.88a8%208%200%200%200-3.93%206l-2.64%2023.76q-1.56%201.49-3%203L40.54%2070a8%208%200%200%200-6%203.94a107.7%20107.7%200%200%200-10.87%2026.25a8%208%200%200%200%201.49%207.06L40%20125.84v4.32L25.11%20148.8a8%208%200%200%200-1.48%207.06a107.6%20107.6%200%200%200%2010.88%2026.25a8%208%200%200%200%206%203.93l23.72%202.64q1.49%201.56%203%203L70%20215.46a8%208%200%200%200%203.94%206a107.7%20107.7%200%200%200%2026.25%2010.87a8%208%200%200%200%207.06-1.49L125.84%20216q2.16.06%204.32%200l18.64%2014.92a8%208%200%200%200%207.06%201.48a107.2%20107.2%200%200%200%2026.25-10.88a8%208%200%200%200%203.93-6l2.64-23.72q1.56-1.48%203-3l23.78-2.8a8%208%200%200%200%206-3.94a107.7%20107.7%200%200%200%2010.87-26.25a8%208%200%200%200-1.49-7.06ZM128%20168a40%2040%200%201%201%2040-40a40%2040%200%200%201-40%2040%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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