pie icon
pie from Reicon by REICON · Outline · Business · MIT Free for personal and commercial use.
- Name
- pie
- Set
- Reicon
- Style
- Outline
- Category
- Business
- Viewbox
- 24×24
- License
- MIT
2 other variants in Reicon
The same icon in other sets
All pie icons →More business icons from Reicon
Use the pie icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path fill-rule="evenodd" d="M14.254 1.365c-1.096-.306-2.122.024-2.851.695c-.719.66-1.153 1.646-1.153 2.7v6.695a2.295 2.295 0 0 0 2.295 2.295h6.694c1.055 0 2.042-.434 2.701-1.153c.67-.729 1.001-1.755.695-2.851a12.1 12.1 0 0 0-8.38-8.381M11.75 4.76c0-.652.27-1.232.668-1.597c.386-.355.886-.508 1.433-.355c3.55.991 6.349 3.79 7.34 7.34c.153.548 0 1.048-.355 1.434c-.365.397-.945.667-1.597.667h-6.694a.795.795 0 0 1-.795-.795z" clip-rule="evenodd"/><path d="M8.672 4.716a.75.75 0 0 0-.45-1.432C4.183 4.554 1.25 8.328 1.25 12.79c0 5.501 4.46 9.961 9.96 9.961a9.96 9.96 0 0 0 9.505-6.973a.75.75 0 1 0-1.43-.45a8.465 8.465 0 0 1-8.074 5.923a8.46 8.46 0 0 1-8.461-8.46a8.465 8.465 0 0 1 5.922-8.074"/></g></svg>
React
import type { SVGProps } from "react";
export function ReiconPie(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path fillRule="evenodd" d="M14.254 1.365c-1.096-.306-2.122.024-2.851.695c-.719.66-1.153 1.646-1.153 2.7v6.695a2.295 2.295 0 0 0 2.295 2.295h6.694c1.055 0 2.042-.434 2.701-1.153c.67-.729 1.001-1.755.695-2.851a12.1 12.1 0 0 0-8.38-8.381M11.75 4.76c0-.652.27-1.232.668-1.597c.386-.355.886-.508 1.433-.355c3.55.991 6.349 3.79 7.34 7.34c.153.548 0 1.048-.355 1.434c-.365.397-.945.667-1.597.667h-6.694a.795.795 0 0 1-.795-.795z" clipRule="evenodd"/><path d="M8.672 4.716a.75.75 0 0 0-.45-1.432C4.183 4.554 1.25 8.328 1.25 12.79c0 5.501 4.46 9.961 9.96 9.961a9.96 9.96 0 0 0 9.505-6.973a.75.75 0 1 0-1.43-.45a8.465 8.465 0 0 1-8.074 5.923a8.46 8.46 0 0 1-8.461-8.46a8.465 8.465 0 0 1 5.922-8.074"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path fill-rule="evenodd" d="M14.254 1.365c-1.096-.306-2.122.024-2.851.695c-.719.66-1.153 1.646-1.153 2.7v6.695a2.295 2.295 0 0 0 2.295 2.295h6.694c1.055 0 2.042-.434 2.701-1.153c.67-.729 1.001-1.755.695-2.851a12.1 12.1 0 0 0-8.38-8.381M11.75 4.76c0-.652.27-1.232.668-1.597c.386-.355.886-.508 1.433-.355c3.55.991 6.349 3.79 7.34 7.34c.153.548 0 1.048-.355 1.434c-.365.397-.945.667-1.597.667h-6.694a.795.795 0 0 1-.795-.795z" clip-rule="evenodd"/><path d="M8.672 4.716a.75.75 0 0 0-.45-1.432C4.183 4.554 1.25 8.328 1.25 12.79c0 5.501 4.46 9.961 9.96 9.961a9.96 9.96 0 0 0 9.505-6.973a.75.75 0 1 0-1.43-.45a8.465 8.465 0 0 1-8.074 5.923a8.46 8.46 0 0 1-8.461-8.46a8.465 8.465 0 0 1 5.922-8.074"/></g></svg> </template>
CSS
.icon-pie {
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%22currentColor%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M14.254%201.365c-1.096-.306-2.122.024-2.851.695c-.719.66-1.153%201.646-1.153%202.7v6.695a2.295%202.295%200%200%200%202.295%202.295h6.694c1.055%200%202.042-.434%202.701-1.153c.67-.729%201.001-1.755.695-2.851a12.1%2012.1%200%200%200-8.38-8.381M11.75%204.76c0-.652.27-1.232.668-1.597c.386-.355.886-.508%201.433-.355c3.55.991%206.349%203.79%207.34%207.34c.153.548%200%201.048-.355%201.434c-.365.397-.945.667-1.597.667h-6.694a.795.795%200%200%201-.795-.795z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20d%3D%22M8.672%204.716a.75.75%200%200%200-.45-1.432C4.183%204.554%201.25%208.328%201.25%2012.79c0%205.501%204.46%209.961%209.96%209.961a9.96%209.96%200%200%200%209.505-6.973a.75.75%200%201%200-1.43-.45a8.465%208.465%200%200%201-8.074%205.923a8.46%208.46%200%200%201-8.461-8.46a8.465%208.465%200%200%201%205.922-8.074%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%22currentColor%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M14.254%201.365c-1.096-.306-2.122.024-2.851.695c-.719.66-1.153%201.646-1.153%202.7v6.695a2.295%202.295%200%200%200%202.295%202.295h6.694c1.055%200%202.042-.434%202.701-1.153c.67-.729%201.001-1.755.695-2.851a12.1%2012.1%200%200%200-8.38-8.381M11.75%204.76c0-.652.27-1.232.668-1.597c.386-.355.886-.508%201.433-.355c3.55.991%206.349%203.79%207.34%207.34c.153.548%200%201.048-.355%201.434c-.365.397-.945.667-1.597.667h-6.694a.795.795%200%200%201-.795-.795z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20d%3D%22M8.672%204.716a.75.75%200%200%200-.45-1.432C4.183%204.554%201.25%208.328%201.25%2012.79c0%205.501%204.46%209.961%209.96%209.961a9.96%209.96%200%200%200%209.505-6.973a.75.75%200%201%200-1.43-.45a8.465%208.465%200%200%201-8.074%205.923a8.46%208.46%200%200%201-8.461-8.46a8.465%208.465%200%200%201%205.922-8.074%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/reicon/pie.svg?color=%231a73e8&size=48