circle progress quarter icon
circle-progress-quarter-duotone from Keyline Icons by Keyline Icons · Duotone · MIT Free for personal and commercial use.
- Name
- circle-progress-quarter-duotone
- Set
- Keyline Icons
- Style
- Duotone
- Viewbox
- 24×24
- License
- MIT
7 other variants in Keyline Icons
Related icons in Keyline Icons
circle-activitycircle-alertcircle-align-offset-bottomcircle-align-offset-leftcircle-align-offset-rightcircle-align-offset-topcircle-arrow-downcircle-arrow-down-leftcircle-arrow-down-rightcircle-arrow-leftcircle-arrow-rightcircle-arrow-u-turn-leftcircle-arrow-u-turn-rightcircle-arrow-upcircle-arrow-up-leftcircle-arrow-up-rightcircle-bar-chartcircle-bar-chart-2circle-bar-chart-2-downcircle-bar-chart-2-horizontal-endcircle-bar-chart-2-horizontal-startcircle-bar-chart-downcircle-bar-chart-horizontal-endcircle-bar-chart-horizontal-start
Use the circle progress quarter icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path stroke-opacity=".4" d="M3.9098 6.1222C4.5266 5.2732 5.2732 4.5266 6.1222 3.9098M10.4357 2.1231C11.4721 1.959 12.5279 1.959 13.5643 2.1231M17.8778 3.9098C18.7268 4.5266 19.4734 5.2732 20.0902 6.1222M21.8769 10.4357C22.041 11.4721 22.041 12.5279 21.8769 13.5643M20.0902 17.8778C19.4734 18.7268 18.7268 19.4734 17.8778 20.0902"/><path d="M12 22C6.4772 22 2 17.5229 2 12"/></g></svg>
React
import type { SVGProps } from "react";
export function KeylineIconsCircleProgressQuarterDuotone(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2"><path strokeOpacity=".4" d="M3.9098 6.1222C4.5266 5.2732 5.2732 4.5266 6.1222 3.9098M10.4357 2.1231C11.4721 1.959 12.5279 1.959 13.5643 2.1231M17.8778 3.9098C18.7268 4.5266 19.4734 5.2732 20.0902 6.1222M21.8769 10.4357C22.041 11.4721 22.041 12.5279 21.8769 13.5643M20.0902 17.8778C19.4734 18.7268 18.7268 19.4734 17.8778 20.0902"/><path d="M12 22C6.4772 22 2 17.5229 2 12"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path stroke-opacity=".4" d="M3.9098 6.1222C4.5266 5.2732 5.2732 4.5266 6.1222 3.9098M10.4357 2.1231C11.4721 1.959 12.5279 1.959 13.5643 2.1231M17.8778 3.9098C18.7268 4.5266 19.4734 5.2732 20.0902 6.1222M21.8769 10.4357C22.041 11.4721 22.041 12.5279 21.8769 13.5643M20.0902 17.8778C19.4734 18.7268 18.7268 19.4734 17.8778 20.0902"/><path d="M12 22C6.4772 22 2 17.5229 2 12"/></g></svg> </template>
CSS
.icon-circle-progress-quarter-duotone {
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%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%3E%3Cpath%20stroke-opacity%3D%22.4%22%20d%3D%22M3.9098%206.1222C4.5266%205.2732%205.2732%204.5266%206.1222%203.9098M10.4357%202.1231C11.4721%201.959%2012.5279%201.959%2013.5643%202.1231M17.8778%203.9098C18.7268%204.5266%2019.4734%205.2732%2020.0902%206.1222M21.8769%2010.4357C22.041%2011.4721%2022.041%2012.5279%2021.8769%2013.5643M20.0902%2017.8778C19.4734%2018.7268%2018.7268%2019.4734%2017.8778%2020.0902%22%2F%3E%3Cpath%20d%3D%22M12%2022C6.4772%2022%202%2017.5229%202%2012%22%2F%3E%3C%2Fg%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%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%3E%3Cpath%20stroke-opacity%3D%22.4%22%20d%3D%22M3.9098%206.1222C4.5266%205.2732%205.2732%204.5266%206.1222%203.9098M10.4357%202.1231C11.4721%201.959%2012.5279%201.959%2013.5643%202.1231M17.8778%203.9098C18.7268%204.5266%2019.4734%205.2732%2020.0902%206.1222M21.8769%2010.4357C22.041%2011.4721%2022.041%2012.5279%2021.8769%2013.5643M20.0902%2017.8778C19.4734%2018.7268%2018.7268%2019.4734%2017.8778%2020.0902%22%2F%3E%3Cpath%20d%3D%22M12%2022C6.4772%2022%202%2017.5229%202%2012%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/keyline-icons/circle-progress-quarter-duotone.svg?color=%231a73e8&size=48
