gauge icon
gauge-light from Phosphor by Phosphor Icons · Light · MIT Free for personal and commercial use.
- Name
- gauge-light
- Set
- Phosphor
- Style
- Light
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
The same icon in other sets
Use the gauge icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M205.65 74.08A109.26 109.26 0 0 0 128 42h-.39C67.17 42.21 18 92.06 18 153.13V176a14 14 0 0 0 14 14h192a14 14 0 0 0 14-14v-24a109.3 109.3 0 0 0-32.35-77.92M226 176a2 2 0 0 1-2 2H115.78l57.07-78.47a6 6 0 0 0-9.7-7.06L100.94 178H32a2 2 0 0 1-2-2v-22.87a102 102 0 0 1 .62-11.13H56a6 6 0 0 0 0-12H32.71C42.6 88.4 78.53 56.86 122 54.19V80a6 6 0 0 0 12 0V54.19A98.05 98.05 0 0 1 223.53 130H200a6 6 0 0 0 0 12h25.5c.33 3.3.5 6.64.5 10Z"/></svg>
React
import type { SVGProps } from "react";
export function PhGaugeLight(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="M205.65 74.08A109.26 109.26 0 0 0 128 42h-.39C67.17 42.21 18 92.06 18 153.13V176a14 14 0 0 0 14 14h192a14 14 0 0 0 14-14v-24a109.3 109.3 0 0 0-32.35-77.92M226 176a2 2 0 0 1-2 2H115.78l57.07-78.47a6 6 0 0 0-9.7-7.06L100.94 178H32a2 2 0 0 1-2-2v-22.87a102 102 0 0 1 .62-11.13H56a6 6 0 0 0 0-12H32.71C42.6 88.4 78.53 56.86 122 54.19V80a6 6 0 0 0 12 0V54.19A98.05 98.05 0 0 1 223.53 130H200a6 6 0 0 0 0 12h25.5c.33 3.3.5 6.64.5 10Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M205.65 74.08A109.26 109.26 0 0 0 128 42h-.39C67.17 42.21 18 92.06 18 153.13V176a14 14 0 0 0 14 14h192a14 14 0 0 0 14-14v-24a109.3 109.3 0 0 0-32.35-77.92M226 176a2 2 0 0 1-2 2H115.78l57.07-78.47a6 6 0 0 0-9.7-7.06L100.94 178H32a2 2 0 0 1-2-2v-22.87a102 102 0 0 1 .62-11.13H56a6 6 0 0 0 0-12H32.71C42.6 88.4 78.53 56.86 122 54.19V80a6 6 0 0 0 12 0V54.19A98.05 98.05 0 0 1 223.53 130H200a6 6 0 0 0 0 12h25.5c.33 3.3.5 6.64.5 10Z"/></svg> </template>
CSS
.icon-gauge-light {
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%22M205.65%2074.08A109.26%20109.26%200%200%200%20128%2042h-.39C67.17%2042.21%2018%2092.06%2018%20153.13V176a14%2014%200%200%200%2014%2014h192a14%2014%200%200%200%2014-14v-24a109.3%20109.3%200%200%200-32.35-77.92M226%20176a2%202%200%200%201-2%202H115.78l57.07-78.47a6%206%200%200%200-9.7-7.06L100.94%20178H32a2%202%200%200%201-2-2v-22.87a102%20102%200%200%201%20.62-11.13H56a6%206%200%200%200%200-12H32.71C42.6%2088.4%2078.53%2056.86%20122%2054.19V80a6%206%200%200%200%2012%200V54.19A98.05%2098.05%200%200%201%20223.53%20130H200a6%206%200%200%200%200%2012h25.5c.33%203.3.5%206.64.5%2010Z%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%22M205.65%2074.08A109.26%20109.26%200%200%200%20128%2042h-.39C67.17%2042.21%2018%2092.06%2018%20153.13V176a14%2014%200%200%200%2014%2014h192a14%2014%200%200%200%2014-14v-24a109.3%20109.3%200%200%200-32.35-77.92M226%20176a2%202%200%200%201-2%202H115.78l57.07-78.47a6%206%200%200%200-9.7-7.06L100.94%20178H32a2%202%200%200%201-2-2v-22.87a102%20102%200%200%201%20.62-11.13H56a6%206%200%200%200%200-12H32.71C42.6%2088.4%2078.53%2056.86%20122%2054.19V80a6%206%200%200%200%2012%200V54.19A98.05%2098.05%200%200%201%20223.53%20130H200a6%206%200%200%200%200%2012h25.5c.33%203.3.5%206.64.5%2010Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/gauge-light.svg?color=%231a73e8&size=48