Salad icon
New Added in v0.6.0
A free pencil-style salad icon, drawn by code from 1 arc, 2 lines, 1 circle and 4 curves. Use it as an SVG, a React component, or by name. MIT licensed.
01Use it
Use salad
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 { Salad } from '@matita/icons/react';
<Salad size={24} />
// or by name
import { SketchIcon } from '@matita/icons/react';
<SketchIcon name="salad" />JavaScript
import { Salad, toSvg } from '@matita/icons';
toSvg(Salad, { 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-salad" data-sketch="" aria-hidden="true"><path d="M20.95 10.92C20.9 11.55 20.99 13.52 20.63 14.7C20.26 15.87 19.58 17.07 18.76 18C17.94 18.93 16.84 19.76 15.72 20.27C14.59 20.77 13.25 21.01 12 21.03C10.75 21.04 9.37 20.85 8.24 20.35C7.12 19.85 6.05 18.95 5.23 18.01C4.41 17.07 3.68 15.89 3.33 14.71C2.97 13.53 3.14 11.56 3.1 10.93" stroke-width="1.664"/><path d="M2.58 11.94Q11.99 11.96 21.4 11.94" stroke-width="1.552"/><path d="M8.59 21.43Q11.96 21.2 15.32 21.31" stroke-width="1.568"/><path d="M7.35 10.79C7.23 10.72 6.84 10.56 6.63 10.39C6.41 10.22 6.2 10.01 6.06 9.77C5.91 9.53 5.8 9.23 5.76 8.95C5.72 8.67 5.75 8.36 5.8 8.08C5.86 7.79 5.95 7.5 6.09 7.25C6.23 6.99 6.43 6.74 6.66 6.55C6.89 6.37 7.17 6.2 7.46 6.12C7.75 6.04 8.07 6.04 8.37 6.08C8.67 6.12 9 6.2 9.26 6.36C9.52 6.51 9.76 6.75 9.95 7C10.14 7.25 10.29 7.54 10.41 7.84C10.52 8.15 10.65 8.49 10.64 8.82C10.63 9.14 10.49 9.48 10.36 9.79C10.22 10.1 10.07 10.43 9.83 10.66C9.6 10.9 9.27 11.04 8.96 11.18C8.65 11.32 8.31 11.49 7.98 11.5C7.65 11.52 7.13 11.31 6.96 11.27" stroke-width="1.472"/><path d="M11.79 10.43Q18.13 9.99 17.48 3.85" stroke-width="1.568"/><path d="M12.06 10.61Q11.49 4.26 17.73 4.16" stroke-width="1.616"/><path d="M11.83 10.64Q15.86 7.64 12.41 3.79" stroke-width="1.536"/><path d="M12.3 10.54Q8.59 7.01 12.59 3.82" stroke-width="1.568"/></svg>Pencil variant
import '@matita/icons/pencil.css';
import { Salad } from '@matita/icons/react';
<Salad size={32} pencil />The file is icons/salad.svg in the package (pencil/salad.svg for the pencil variant). Matita 0.6.0.
02How it's drawn
The recipe for salad
Salad is not stored as a drawing. It is a recipe of 1 arc, 2 lines, 1 circle and 4 curves 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.
A 12 12 9 0 180;
L 3 12 21 12;
L 9 21.5 15 21.5;
C 8 8.6 2.2;
Q 12 10.5 18.11 10.09 17.5 4;
Q 12 10.5 11.39 4.41 17.5 4;
Q 12 10.5 15.84 7.53 12.5 4;
Q 12 10.5 8.66 6.97 12.5 4salad as a number: 1940293162
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 salad. Seed 0 is the default.
salad from exact shapes (wobble 0) to the full hand (wobble 1, the default). The exact version is also a ready-made file: exact/salad.svg.
True pixel sizes.