Rocket icon
A free pencil-style rocket icon, drawn by code from 2 curves, 1 line, 3 polylines and 1 circle. Use it as an SVG, a React component, or by name. MIT licensed.
01Use it
Use rocket
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 { Rocket } from '@matita/icons/react';
<Rocket size={24} />
// or by name
import { SketchIcon } from '@matita/icons/react';
<SketchIcon name="rocket" />JavaScript
import { Rocket, toSvg } from '@matita/icons';
toSvg(Rocket, { 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-rocket" data-sketch="" aria-hidden="true"><path d="M8.96 16.63Q8.49 7.03 12.28 2.42" stroke-width="1.552"/><path d="M15.12 16.98Q15.66 7.12 11.79 2.36" stroke-width="1.616"/><path d="M8.92 16.62Q12.28 16.36 15.63 16.5" stroke-width="1.712"/><path d="M9.04 11.43Q7.52 13.27 5.86 14.99Q6.01 16.73 6.16 18.47Q7.67 17.4 9.09 16.23" stroke-width="1.792"/><path d="M14.52 11.13Q16.22 13.05 17.82 15.06Q18.14 16.75 18.17 18.47Q16.58 17.25 14.86 16.22" stroke-width="1.664"/><path d="M12.68 10.92C12.58 10.96 12.27 11.14 12.06 11.15C11.85 11.17 11.61 11.11 11.4 11.03C11.19 10.96 10.97 10.86 10.79 10.71C10.62 10.56 10.47 10.36 10.37 10.14C10.27 9.93 10.22 9.68 10.2 9.44C10.19 9.19 10.19 8.91 10.28 8.68C10.37 8.45 10.57 8.23 10.76 8.07C10.95 7.9 11.19 7.77 11.43 7.68C11.67 7.58 11.95 7.48 12.21 7.49C12.48 7.49 12.78 7.57 13.03 7.69C13.27 7.82 13.52 8.01 13.7 8.22C13.88 8.44 14.03 8.72 14.1 9C14.17 9.28 14.16 9.59 14.12 9.88C14.07 10.17 13.99 10.47 13.84 10.73C13.69 10.98 13.47 11.24 13.23 11.4C12.98 11.57 12.66 11.68 12.37 11.74C12.07 11.79 11.59 11.74 11.43 11.74" stroke-width="1.456"/><path d="M10.25 18.8Q11.01 20.27 11.92 21.66Q12.91 20.27 13.8 18.82" stroke-width="1.52"/></svg>Pencil variant
import '@matita/icons/pencil.css';
import { Rocket } from '@matita/icons/react';
<Rocket size={32} pencil />The file is icons/rocket.svg in the package (pencil/rocket.svg for the pencil variant). Matita 0.3.0.
02How it's drawn
The recipe for rocket
Rocket is not stored as a drawing. It is a recipe of 2 curves, 1 line, 3 polylines and 1 circle 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.
Q 9 16.5 8.5 7 12 2.5;
Q 15 16.5 15.5 7 12 2.5;
L 9 16.5 15 16.5;
P 9 11.5 6 15 6 18.5 9 16.5;
P 15 11.5 18 15 18 18.5 15 16.5;
C 12 9.5 1.6;
P 10.5 19 12 21.5 13.5 19rocket as a number: 3866886229
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 rocket. Seed 0 is the default.
True pixel sizes.