cog icon
cog from Prime Icons by PrimeTek · Regular · MIT Free for personal and commercial use.
- Name
- cog
- Set
- Prime Icons
- Style
- Regular
- Viewbox
- 24×24
- License
- MIT
The same icon in other sets
Use the cog icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 14.93A2.93 2.93 0 1 1 14.93 12A2.93 2.93 0 0 1 12 14.93m0-4.36A1.43 1.43 0 1 0 13.43 12A1.43 1.43 0 0 0 12 10.57"/><path fill="currentColor" d="M12.06 20.75a2.22 2.22 0 0 1-2.21-2.24a.48.48 0 0 0-.29-.42a.51.51 0 0 0-.56.09a2.24 2.24 0 0 1-1.56.65a2.26 2.26 0 0 1-1.58-.63a2.22 2.22 0 0 1 0-3.14a.5.5 0 0 0 .14-.52a.56.56 0 0 0-.48-.28a2.27 2.27 0 0 1-2.26-2.2a2.22 2.22 0 0 1 2.23-2.21a.48.48 0 0 0 .42-.29a.51.51 0 0 0-.09-.56a2.24 2.24 0 0 1-.65-1.56a2.2 2.2 0 0 1 .63-1.58a2.22 2.22 0 0 1 3.14 0a.58.58 0 0 0 .55.14a.6.6 0 0 0 .31-.48A2.27 2.27 0 0 1 12 3.25a2.22 2.22 0 0 1 2.2 2.24a.52.52 0 0 0 .28.44a.5.5 0 0 0 .52-.11a2.24 2.24 0 0 1 1.56-.65a2.13 2.13 0 0 1 1.58.63a2.22 2.22 0 0 1 0 3.14a.58.58 0 0 0-.11.55a.6.6 0 0 0 .48.31a2.27 2.27 0 0 1 2.24 2.2a2.22 2.22 0 0 1-2.24 2.2a.52.52 0 0 0-.44.28a.5.5 0 0 0 .11.52a2.24 2.24 0 0 1 .65 1.56a2.2 2.2 0 0 1-.63 1.58a2.22 2.22 0 0 1-3.14 0a.5.5 0 0 0-.52-.11a.56.56 0 0 0-.28.48a2.27 2.27 0 0 1-2.2 2.24m-2.71-4.21a1.8 1.8 0 0 1 .77.16a2 2 0 0 1 1.23 1.8a.74.74 0 0 0 .71.75a.76.76 0 0 0 .7-.77a2.06 2.06 0 0 1 1.18-1.85a2 2 0 0 1 2.18.43a.7.7 0 1 0 1-1a2 2 0 0 1-.42-2.18a2 2 0 0 1 1.82-1.18a.73.73 0 0 0 .74-.7a.75.75 0 0 0-.77-.7a2.1 2.1 0 0 1-1.85-1.22a2.05 2.05 0 0 1 .43-2.2a.7.7 0 1 0-1-1a2 2 0 0 1-3.36-1.4a.73.73 0 0 0-.7-.74a.75.75 0 0 0-.7.77a2.1 2.1 0 0 1-1.22 1.85a2.05 2.05 0 0 1-2.2-.43a.7.7 0 1 0-1 1a2 2 0 0 1 .41 2.18a2 2 0 0 1-1.8 1.23a.74.74 0 0 0-.75.71a.76.76 0 0 0 .77.7a2.06 2.06 0 0 1 1.85 1.18a2 2 0 0 1-.43 2.18a.7.7 0 1 0 1 1a2.06 2.06 0 0 1 1.41-.57m8-2.36"/></svg>
React
import type { SVGProps } from "react";
export function PrimeCog(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="M12 14.93A2.93 2.93 0 1 1 14.93 12A2.93 2.93 0 0 1 12 14.93m0-4.36A1.43 1.43 0 1 0 13.43 12A1.43 1.43 0 0 0 12 10.57"/><path fill="currentColor" d="M12.06 20.75a2.22 2.22 0 0 1-2.21-2.24a.48.48 0 0 0-.29-.42a.51.51 0 0 0-.56.09a2.24 2.24 0 0 1-1.56.65a2.26 2.26 0 0 1-1.58-.63a2.22 2.22 0 0 1 0-3.14a.5.5 0 0 0 .14-.52a.56.56 0 0 0-.48-.28a2.27 2.27 0 0 1-2.26-2.2a2.22 2.22 0 0 1 2.23-2.21a.48.48 0 0 0 .42-.29a.51.51 0 0 0-.09-.56a2.24 2.24 0 0 1-.65-1.56a2.2 2.2 0 0 1 .63-1.58a2.22 2.22 0 0 1 3.14 0a.58.58 0 0 0 .55.14a.6.6 0 0 0 .31-.48A2.27 2.27 0 0 1 12 3.25a2.22 2.22 0 0 1 2.2 2.24a.52.52 0 0 0 .28.44a.5.5 0 0 0 .52-.11a2.24 2.24 0 0 1 1.56-.65a2.13 2.13 0 0 1 1.58.63a2.22 2.22 0 0 1 0 3.14a.58.58 0 0 0-.11.55a.6.6 0 0 0 .48.31a2.27 2.27 0 0 1 2.24 2.2a2.22 2.22 0 0 1-2.24 2.2a.52.52 0 0 0-.44.28a.5.5 0 0 0 .11.52a2.24 2.24 0 0 1 .65 1.56a2.2 2.2 0 0 1-.63 1.58a2.22 2.22 0 0 1-3.14 0a.5.5 0 0 0-.52-.11a.56.56 0 0 0-.28.48a2.27 2.27 0 0 1-2.2 2.24m-2.71-4.21a1.8 1.8 0 0 1 .77.16a2 2 0 0 1 1.23 1.8a.74.74 0 0 0 .71.75a.76.76 0 0 0 .7-.77a2.06 2.06 0 0 1 1.18-1.85a2 2 0 0 1 2.18.43a.7.7 0 1 0 1-1a2 2 0 0 1-.42-2.18a2 2 0 0 1 1.82-1.18a.73.73 0 0 0 .74-.7a.75.75 0 0 0-.77-.7a2.1 2.1 0 0 1-1.85-1.22a2.05 2.05 0 0 1 .43-2.2a.7.7 0 1 0-1-1a2 2 0 0 1-3.36-1.4a.73.73 0 0 0-.7-.74a.75.75 0 0 0-.7.77a2.1 2.1 0 0 1-1.22 1.85a2.05 2.05 0 0 1-2.2-.43a.7.7 0 1 0-1 1a2 2 0 0 1 .41 2.18a2 2 0 0 1-1.8 1.23a.74.74 0 0 0-.75.71a.76.76 0 0 0 .77.7a2.06 2.06 0 0 1 1.85 1.18a2 2 0 0 1-.43 2.18a.7.7 0 1 0 1 1a2.06 2.06 0 0 1 1.41-.57m8-2.36"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 14.93A2.93 2.93 0 1 1 14.93 12A2.93 2.93 0 0 1 12 14.93m0-4.36A1.43 1.43 0 1 0 13.43 12A1.43 1.43 0 0 0 12 10.57"/><path fill="currentColor" d="M12.06 20.75a2.22 2.22 0 0 1-2.21-2.24a.48.48 0 0 0-.29-.42a.51.51 0 0 0-.56.09a2.24 2.24 0 0 1-1.56.65a2.26 2.26 0 0 1-1.58-.63a2.22 2.22 0 0 1 0-3.14a.5.5 0 0 0 .14-.52a.56.56 0 0 0-.48-.28a2.27 2.27 0 0 1-2.26-2.2a2.22 2.22 0 0 1 2.23-2.21a.48.48 0 0 0 .42-.29a.51.51 0 0 0-.09-.56a2.24 2.24 0 0 1-.65-1.56a2.2 2.2 0 0 1 .63-1.58a2.22 2.22 0 0 1 3.14 0a.58.58 0 0 0 .55.14a.6.6 0 0 0 .31-.48A2.27 2.27 0 0 1 12 3.25a2.22 2.22 0 0 1 2.2 2.24a.52.52 0 0 0 .28.44a.5.5 0 0 0 .52-.11a2.24 2.24 0 0 1 1.56-.65a2.13 2.13 0 0 1 1.58.63a2.22 2.22 0 0 1 0 3.14a.58.58 0 0 0-.11.55a.6.6 0 0 0 .48.31a2.27 2.27 0 0 1 2.24 2.2a2.22 2.22 0 0 1-2.24 2.2a.52.52 0 0 0-.44.28a.5.5 0 0 0 .11.52a2.24 2.24 0 0 1 .65 1.56a2.2 2.2 0 0 1-.63 1.58a2.22 2.22 0 0 1-3.14 0a.5.5 0 0 0-.52-.11a.56.56 0 0 0-.28.48a2.27 2.27 0 0 1-2.2 2.24m-2.71-4.21a1.8 1.8 0 0 1 .77.16a2 2 0 0 1 1.23 1.8a.74.74 0 0 0 .71.75a.76.76 0 0 0 .7-.77a2.06 2.06 0 0 1 1.18-1.85a2 2 0 0 1 2.18.43a.7.7 0 1 0 1-1a2 2 0 0 1-.42-2.18a2 2 0 0 1 1.82-1.18a.73.73 0 0 0 .74-.7a.75.75 0 0 0-.77-.7a2.1 2.1 0 0 1-1.85-1.22a2.05 2.05 0 0 1 .43-2.2a.7.7 0 1 0-1-1a2 2 0 0 1-3.36-1.4a.73.73 0 0 0-.7-.74a.75.75 0 0 0-.7.77a2.1 2.1 0 0 1-1.22 1.85a2.05 2.05 0 0 1-2.2-.43a.7.7 0 1 0-1 1a2 2 0 0 1 .41 2.18a2 2 0 0 1-1.8 1.23a.74.74 0 0 0-.75.71a.76.76 0 0 0 .77.7a2.06 2.06 0 0 1 1.85 1.18a2 2 0 0 1-.43 2.18a.7.7 0 1 0 1 1a2.06 2.06 0 0 1 1.41-.57m8-2.36"/></svg> </template>
CSS
.icon-cog {
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%22M12%2014.93A2.93%202.93%200%201%201%2014.93%2012A2.93%202.93%200%200%201%2012%2014.93m0-4.36A1.43%201.43%200%201%200%2013.43%2012A1.43%201.43%200%200%200%2012%2010.57%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12.06%2020.75a2.22%202.22%200%200%201-2.21-2.24a.48.48%200%200%200-.29-.42a.51.51%200%200%200-.56.09a2.24%202.24%200%200%201-1.56.65a2.26%202.26%200%200%201-1.58-.63a2.22%202.22%200%200%201%200-3.14a.5.5%200%200%200%20.14-.52a.56.56%200%200%200-.48-.28a2.27%202.27%200%200%201-2.26-2.2a2.22%202.22%200%200%201%202.23-2.21a.48.48%200%200%200%20.42-.29a.51.51%200%200%200-.09-.56a2.24%202.24%200%200%201-.65-1.56a2.2%202.2%200%200%201%20.63-1.58a2.22%202.22%200%200%201%203.14%200a.58.58%200%200%200%20.55.14a.6.6%200%200%200%20.31-.48A2.27%202.27%200%200%201%2012%203.25a2.22%202.22%200%200%201%202.2%202.24a.52.52%200%200%200%20.28.44a.5.5%200%200%200%20.52-.11a2.24%202.24%200%200%201%201.56-.65a2.13%202.13%200%200%201%201.58.63a2.22%202.22%200%200%201%200%203.14a.58.58%200%200%200-.11.55a.6.6%200%200%200%20.48.31a2.27%202.27%200%200%201%202.24%202.2a2.22%202.22%200%200%201-2.24%202.2a.52.52%200%200%200-.44.28a.5.5%200%200%200%20.11.52a2.24%202.24%200%200%201%20.65%201.56a2.2%202.2%200%200%201-.63%201.58a2.22%202.22%200%200%201-3.14%200a.5.5%200%200%200-.52-.11a.56.56%200%200%200-.28.48a2.27%202.27%200%200%201-2.2%202.24m-2.71-4.21a1.8%201.8%200%200%201%20.77.16a2%202%200%200%201%201.23%201.8a.74.74%200%200%200%20.71.75a.76.76%200%200%200%20.7-.77a2.06%202.06%200%200%201%201.18-1.85a2%202%200%200%201%202.18.43a.7.7%200%201%200%201-1a2%202%200%200%201-.42-2.18a2%202%200%200%201%201.82-1.18a.73.73%200%200%200%20.74-.7a.75.75%200%200%200-.77-.7a2.1%202.1%200%200%201-1.85-1.22a2.05%202.05%200%200%201%20.43-2.2a.7.7%200%201%200-1-1a2%202%200%200%201-3.36-1.4a.73.73%200%200%200-.7-.74a.75.75%200%200%200-.7.77a2.1%202.1%200%200%201-1.22%201.85a2.05%202.05%200%200%201-2.2-.43a.7.7%200%201%200-1%201a2%202%200%200%201%20.41%202.18a2%202%200%200%201-1.8%201.23a.74.74%200%200%200-.75.71a.76.76%200%200%200%20.77.7a2.06%202.06%200%200%201%201.85%201.18a2%202%200%200%201-.43%202.18a.7.7%200%201%200%201%201a2.06%202.06%200%200%201%201.41-.57m8-2.36%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%22M12%2014.93A2.93%202.93%200%201%201%2014.93%2012A2.93%202.93%200%200%201%2012%2014.93m0-4.36A1.43%201.43%200%201%200%2013.43%2012A1.43%201.43%200%200%200%2012%2010.57%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12.06%2020.75a2.22%202.22%200%200%201-2.21-2.24a.48.48%200%200%200-.29-.42a.51.51%200%200%200-.56.09a2.24%202.24%200%200%201-1.56.65a2.26%202.26%200%200%201-1.58-.63a2.22%202.22%200%200%201%200-3.14a.5.5%200%200%200%20.14-.52a.56.56%200%200%200-.48-.28a2.27%202.27%200%200%201-2.26-2.2a2.22%202.22%200%200%201%202.23-2.21a.48.48%200%200%200%20.42-.29a.51.51%200%200%200-.09-.56a2.24%202.24%200%200%201-.65-1.56a2.2%202.2%200%200%201%20.63-1.58a2.22%202.22%200%200%201%203.14%200a.58.58%200%200%200%20.55.14a.6.6%200%200%200%20.31-.48A2.27%202.27%200%200%201%2012%203.25a2.22%202.22%200%200%201%202.2%202.24a.52.52%200%200%200%20.28.44a.5.5%200%200%200%20.52-.11a2.24%202.24%200%200%201%201.56-.65a2.13%202.13%200%200%201%201.58.63a2.22%202.22%200%200%201%200%203.14a.58.58%200%200%200-.11.55a.6.6%200%200%200%20.48.31a2.27%202.27%200%200%201%202.24%202.2a2.22%202.22%200%200%201-2.24%202.2a.52.52%200%200%200-.44.28a.5.5%200%200%200%20.11.52a2.24%202.24%200%200%201%20.65%201.56a2.2%202.2%200%200%201-.63%201.58a2.22%202.22%200%200%201-3.14%200a.5.5%200%200%200-.52-.11a.56.56%200%200%200-.28.48a2.27%202.27%200%200%201-2.2%202.24m-2.71-4.21a1.8%201.8%200%200%201%20.77.16a2%202%200%200%201%201.23%201.8a.74.74%200%200%200%20.71.75a.76.76%200%200%200%20.7-.77a2.06%202.06%200%200%201%201.18-1.85a2%202%200%200%201%202.18.43a.7.7%200%201%200%201-1a2%202%200%200%201-.42-2.18a2%202%200%200%201%201.82-1.18a.73.73%200%200%200%20.74-.7a.75.75%200%200%200-.77-.7a2.1%202.1%200%200%201-1.85-1.22a2.05%202.05%200%200%201%20.43-2.2a.7.7%200%201%200-1-1a2%202%200%200%201-3.36-1.4a.73.73%200%200%200-.7-.74a.75.75%200%200%200-.7.77a2.1%202.1%200%200%201-1.22%201.85a2.05%202.05%200%200%201-2.2-.43a.7.7%200%201%200-1%201a2%202%200%200%201%20.41%202.18a2%202%200%200%201-1.8%201.23a.74.74%200%200%200-.75.71a.76.76%200%200%200%20.77.7a2.06%202.06%200%200%201%201.85%201.18a2%202%200%200%201-.43%202.18a.7.7%200%201%200%201%201a2.06%202.06%200%200%201%201.41-.57m8-2.36%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/prime/cog.svg?color=%231a73e8&size=48
