pie chart icon
pie-chart from Font Awesome Solid by Dave Gandy · Solid · CC-BY-4.0 Attribution required.
- Name
- pie-chart
- Set
- Font Awesome Solid
- Style
- Solid
- Viewbox
- 640×640
- License
- CC BY 4.0
The same icon in other sets
pie-chart-filledAnt Design Iconspie-chartBootstrap Iconspie-chartBoxIcons v2pie-chartBoxIcons v2 Solidpie-chartCodiconspie-chartElement Pluspie-chart-fillEva Iconspie-chartFeather Iconspie-chart-solidFlowbite Iconspie-chartHuge Iconspie-chartHumbleiconspie-chartIonIconspie-chartJam Iconspie-chartLucidepie-chartMaterial Symbolspie-chartMaterial Symbols Lightpie-chartRadix Iconspie-chart-fillRemix Iconpie-chart-boldSolarpie-chart-outlineTeenyicons
Use the pie chart icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M544.4 304h-176c-17.7 0-32-14.3-32-32V96c0-17.7 14.4-32.2 31.9-29.9c107 14.2 191.8 99 206 206c2.3 17.5-12.2 31.9-29.9 31.9M254.6 101.2c18.1-3.8 33.8 11 33.8 29.5V328c0 5.6 2 11 5.5 15.3L426 502.7c11.7 14.1 9.2 35.4-6.9 44.1C385 565.4 345.9 576 304.4 576c-132.5 0-240-107.5-240-240c0-115.5 81.5-211.9 190.2-234.8M509.8 352h64c18.5 0 33.3 15.7 29.5 33.8c-10.2 48.4-35 91.4-69.6 124.2c-12.3 11.7-31.6 9.2-42.4-3.9l-84.4-101.7c-17.3-20.9-2.4-52.4 24.6-52.4h78.2z"/></svg>
React
import type { SVGProps } from "react";
export function Fa7SolidPieChart(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M544.4 304h-176c-17.7 0-32-14.3-32-32V96c0-17.7 14.4-32.2 31.9-29.9c107 14.2 191.8 99 206 206c2.3 17.5-12.2 31.9-29.9 31.9M254.6 101.2c18.1-3.8 33.8 11 33.8 29.5V328c0 5.6 2 11 5.5 15.3L426 502.7c11.7 14.1 9.2 35.4-6.9 44.1C385 565.4 345.9 576 304.4 576c-132.5 0-240-107.5-240-240c0-115.5 81.5-211.9 190.2-234.8M509.8 352h64c18.5 0 33.3 15.7 29.5 33.8c-10.2 48.4-35 91.4-69.6 124.2c-12.3 11.7-31.6 9.2-42.4-3.9l-84.4-101.7c-17.3-20.9-2.4-52.4 24.6-52.4h78.2z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M544.4 304h-176c-17.7 0-32-14.3-32-32V96c0-17.7 14.4-32.2 31.9-29.9c107 14.2 191.8 99 206 206c2.3 17.5-12.2 31.9-29.9 31.9M254.6 101.2c18.1-3.8 33.8 11 33.8 29.5V328c0 5.6 2 11 5.5 15.3L426 502.7c11.7 14.1 9.2 35.4-6.9 44.1C385 565.4 345.9 576 304.4 576c-132.5 0-240-107.5-240-240c0-115.5 81.5-211.9 190.2-234.8M509.8 352h64c18.5 0 33.3 15.7 29.5 33.8c-10.2 48.4-35 91.4-69.6 124.2c-12.3 11.7-31.6 9.2-42.4-3.9l-84.4-101.7c-17.3-20.9-2.4-52.4 24.6-52.4h78.2z"/></svg> </template>
CSS
.icon-pie-chart {
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%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M544.4%20304h-176c-17.7%200-32-14.3-32-32V96c0-17.7%2014.4-32.2%2031.9-29.9c107%2014.2%20191.8%2099%20206%20206c2.3%2017.5-12.2%2031.9-29.9%2031.9M254.6%20101.2c18.1-3.8%2033.8%2011%2033.8%2029.5V328c0%205.6%202%2011%205.5%2015.3L426%20502.7c11.7%2014.1%209.2%2035.4-6.9%2044.1C385%20565.4%20345.9%20576%20304.4%20576c-132.5%200-240-107.5-240-240c0-115.5%2081.5-211.9%20190.2-234.8M509.8%20352h64c18.5%200%2033.3%2015.7%2029.5%2033.8c-10.2%2048.4-35%2091.4-69.6%20124.2c-12.3%2011.7-31.6%209.2-42.4-3.9l-84.4-101.7c-17.3-20.9-2.4-52.4%2024.6-52.4h78.2z%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%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M544.4%20304h-176c-17.7%200-32-14.3-32-32V96c0-17.7%2014.4-32.2%2031.9-29.9c107%2014.2%20191.8%2099%20206%20206c2.3%2017.5-12.2%2031.9-29.9%2031.9M254.6%20101.2c18.1-3.8%2033.8%2011%2033.8%2029.5V328c0%205.6%202%2011%205.5%2015.3L426%20502.7c11.7%2014.1%209.2%2035.4-6.9%2044.1C385%20565.4%20345.9%20576%20304.4%20576c-132.5%200-240-107.5-240-240c0-115.5%2081.5-211.9%20190.2-234.8M509.8%20352h64c18.5%200%2033.3%2015.7%2029.5%2033.8c-10.2%2048.4-35%2091.4-69.6%20124.2c-12.3%2011.7-31.6%209.2-42.4-3.9l-84.4-101.7c-17.3-20.9-2.4-52.4%2024.6-52.4h78.2z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fa7-solid/pie-chart.svg?color=%231a73e8&size=48
