Chart pie icon
A free pencil-style chart pie icon, drawn by code from 1 circle and 1 polyline. Use it as an SVG, a React component, or by name. MIT licensed.
01Use it
Use chart-pie
One package, four ways in. The icon inherits currentColor and is decorative unless you give it a title. Install it with npm i @matita/icons.
React
import { ChartPie } from '@matita/icons/react';
<ChartPie size={24} />
// or by name
import { SketchIcon } from '@matita/icons/react';
<SketchIcon name="chart-pie" />JavaScript
import { ChartPie, toSvg } from '@matita/icons';
toSvg(ChartPie, { size: 24 }); // SVG stringSVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" overflow="visible" class="sketch-icon sketch-icon-chart-pie" data-sketch="" aria-hidden="true"><path d="M20.33 10.87C20.25 11.46 20.19 13.3 19.85 14.41C19.52 15.51 18.96 16.56 18.32 17.49C17.67 18.43 16.91 19.46 15.99 20.03C15.06 20.61 13.85 20.84 12.76 20.93C11.68 21.03 10.48 20.96 9.47 20.59C8.45 20.22 7.48 19.47 6.67 18.71C5.86 17.94 5.07 17 4.59 15.97C4.1 14.94 3.84 13.7 3.76 12.53C3.68 11.37 3.79 10.1 4.12 8.98C4.44 7.85 4.99 6.68 5.7 5.77C6.42 4.85 7.39 3.99 8.4 3.49C9.41 2.99 10.64 2.8 11.77 2.77C12.9 2.75 14.12 2.89 15.16 3.33C16.19 3.77 17.2 4.55 18 5.4C18.8 6.25 19.52 7.31 19.97 8.42C20.41 9.53 20.63 10.83 20.66 12.05C20.69 13.28 20.21 15.15 20.12 15.76" stroke-width="1.424"/><path d="M11.91 3Q11.67 7.42 12.18 11.82Q16.07 13.93 19.68 16.48" stroke-width="1.712"/></svg>Pencil variant
import '@matita/icons/pencil.css';
import { ChartPie } from '@matita/icons/react';
<ChartPie size={32} pencil />The file is icons/chart-pie.svg in the package (pencil/chart-pie.svg for the pencil variant). Matita 0.2.1.
02How it's drawn
The recipe for chart-pie
Chart pie is not stored as a drawing. It is a recipe of 1 circle and 1 polyline on a 24 by 24 grid, and a small program draws it like a pencil would. The wobble comes from the name, so it always comes out the same.
C 12 12 8.5;
P 12 3.5 12 12 19.4 16.2chart-pie as a number: 2212546504
Shapes: L line, P polyline, Z closed shape, R rectangle, C circle, E ellipse, A arc, Q curve, O dot. Separate shapes with ;. Edits stay on this page.
03Takes, sizes, pencil
Same icon, every way
Pass a seed for another take of the same recipe. The wobble is capped, so it still reads at 16 px.
Five seeds of chart-pie. Seed 0 is the default.
True pixel sizes.