Car icon
New Added in v0.4.0
A free pencil-style car icon, drawn by code from 1 polyline, 1 line, 2 circles, 2 closed shapes and 1 dot. Use it as an SVG, a React component, or by name. MIT licensed.
01Use it
Use car
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 { Car } from '@matita/icons/react';
<Car size={24} />
// or by name
import { SketchIcon } from '@matita/icons/react';
<SketchIcon name="car" />JavaScript
import { Car, toSvg } from '@matita/icons';
toSvg(Car, { 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-car" data-sketch="" aria-hidden="true"><path d="M5.99 17.4Q4.57 17.46 3.16 17.31Q3.13 14.94 3.19 12.57Q4.38 10.99 5.45 9.31Q6.68 7.65 7.83 5.93Q11.65 5.88 15.47 5.74Q16.44 7.79 17.68 9.69Q19.3 10.05 20.92 10.4Q21.16 13.95 20.91 17.5Q19.68 17.52 18.46 17.56" stroke-width="1.808"/><path d="M9.98 17.47Q12.32 17.37 14.66 17.39" stroke-width="1.728"/><path d="M8.4 15.35C8.52 15.39 8.9 15.48 9.14 15.6C9.37 15.72 9.65 15.86 9.82 16.07C9.99 16.28 10.08 16.57 10.17 16.84C10.26 17.11 10.34 17.41 10.34 17.69C10.34 17.98 10.3 18.31 10.18 18.57C10.06 18.84 9.83 19.05 9.62 19.26C9.42 19.48 9.21 19.71 8.95 19.86C8.7 20 8.38 20.1 8.08 20.13C7.78 20.15 7.45 20.11 7.16 20.01C6.87 19.91 6.57 19.75 6.34 19.54C6.1 19.34 5.91 19.07 5.75 18.79C5.58 18.52 5.44 18.21 5.37 17.89C5.3 17.57 5.28 17.21 5.33 16.88C5.38 16.55 5.52 16.21 5.7 15.92C5.87 15.63 6.11 15.37 6.38 15.16C6.64 14.94 6.95 14.74 7.28 14.64C7.6 14.54 7.98 14.49 8.32 14.53C8.66 14.57 9.15 14.81 9.32 14.87" stroke-width="1.792"/><path d="M17.35 19.52C17.2 19.55 16.79 19.68 16.49 19.71C16.19 19.73 15.85 19.75 15.57 19.66C15.29 19.56 15.02 19.34 14.8 19.11C14.59 18.89 14.4 18.61 14.28 18.31C14.16 18.02 14.06 17.68 14.06 17.36C14.07 17.04 14.18 16.7 14.32 16.4C14.46 16.1 14.65 15.79 14.89 15.57C15.13 15.35 15.45 15.18 15.77 15.06C16.08 14.95 16.45 14.86 16.79 14.88C17.13 14.89 17.51 15 17.81 15.17C18.11 15.34 18.38 15.62 18.6 15.9C18.82 16.18 19.03 16.5 19.14 16.84C19.24 17.19 19.29 17.6 19.24 17.96C19.19 18.32 19.05 18.71 18.85 19.02C18.66 19.34 18.38 19.63 18.07 19.85C17.77 20.06 17.4 20.23 17.03 20.33C16.66 20.43 16.05 20.43 15.85 20.45" stroke-width="1.776"/><path d="M6.82 10.36Q7.59 8.71 8.43 7.09Q9.96 7.24 11.5 7.28Q11.56 8.79 11.44 10.3Q9.13 10.42 6.82 10.36Q7.03 9.84 7.31 9.37" stroke-width="1.712"/><path d="M12.8 7.16Q14.08 7.17 15.35 7.21Q16.32 8.72 17.13 10.32Q15.05 10.32 12.99 10.02Q12.95 8.59 12.8 7.16Q13.61 7.16 14.42 7.19" stroke-width="1.52"/><path d="M19.5 13.37l.01 0" stroke-width="2.48"/></svg>Pencil variant
import '@matita/icons/pencil.css';
import { Car } from '@matita/icons/react';
<Car size={32} pencil />The file is icons/car.svg in the package (pencil/car.svg for the pencil variant). Matita 0.4.0.
02How it's drawn
The recipe for car
Car is not stored as a drawing. It is a recipe of 1 polyline, 1 line, 2 circles, 2 closed shapes and 1 dot 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.
P 5.8 17.5 3 17.5 3 12.5 5.5 9.5 7.8 5.8 15.6 5.8 17.8 9.5 21 10.5 21 17.5 18.7 17.5;
L 10.2 17.5 14.3 17.5;
C 8 17.5 2.2;
C 16.5 17.5 2.2;
Z 6.9 10.2 8.4 7.2 11.5 7.2 11.5 10.2;
Z 12.9 7.2 15.3 7.2 17.1 10.2 12.9 10.2;
O 19.6 13.5car as a number: 74733793
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 car. Seed 0 is the default.
car from exact shapes (wobble 0) to the full hand (wobble 1, the default). The exact version is also a ready-made file: exact/car.svg.
True pixel sizes.