Bone icon
New Added in v0.4.0
A free pencil-style bone icon, drawn by code from 2 lines and 4 circles. Use it as an SVG, a React component, or by name. MIT licensed.
01Use it
Use bone
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 { Bone } from '@matita/icons/react';
<Bone size={24} />
// or by name
import { SketchIcon } from '@matita/icons/react';
<SketchIcon name="bone" />JavaScript
import { Bone, toSvg } from '@matita/icons';
toSvg(Bone, { 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-bone" data-sketch="" aria-hidden="true"><path d="M9.1 16.73Q12.76 13.08 16.36 9.38" stroke-width="1.6"/><path d="M7.58 14.82Q10.83 10.79 14.65 7.33" stroke-width="1.568"/><path d="M7.43 16.67C7.56 16.61 7.91 16.37 8.17 16.31C8.43 16.26 8.74 16.27 9 16.34C9.27 16.41 9.55 16.56 9.77 16.74C9.99 16.93 10.19 17.18 10.33 17.45C10.46 17.72 10.55 18.04 10.57 18.35C10.59 18.66 10.56 19.01 10.45 19.3C10.34 19.59 10.13 19.85 9.92 20.08C9.7 20.3 9.44 20.51 9.17 20.62C8.89 20.73 8.56 20.75 8.26 20.74C7.95 20.73 7.61 20.7 7.33 20.57C7.05 20.43 6.81 20.17 6.6 19.92C6.39 19.66 6.16 19.36 6.08 19.04C5.99 18.72 6.03 18.34 6.08 18C6.13 17.66 6.19 17.28 6.35 16.99C6.52 16.7 6.81 16.45 7.08 16.25C7.36 16.05 7.69 15.86 8.02 15.79C8.35 15.72 8.89 15.82 9.07 15.83" stroke-width="1.6"/><path d="M5.94 13.66C6.08 13.71 6.51 13.81 6.77 13.95C7.02 14.09 7.29 14.28 7.47 14.51C7.64 14.74 7.77 15.06 7.8 15.35C7.84 15.63 7.77 15.95 7.67 16.23C7.58 16.52 7.44 16.8 7.24 17.04C7.05 17.28 6.8 17.54 6.51 17.68C6.22 17.81 5.86 17.83 5.52 17.84C5.18 17.85 4.81 17.84 4.49 17.72C4.18 17.6 3.85 17.37 3.63 17.12C3.4 16.87 3.24 16.53 3.14 16.2C3.03 15.87 2.96 15.49 3.02 15.16C3.07 14.82 3.24 14.46 3.44 14.17C3.65 13.88 3.93 13.62 4.24 13.42C4.55 13.22 4.92 13 5.29 12.94C5.65 12.89 6.08 12.98 6.45 13.08C6.82 13.19 7.22 13.35 7.52 13.59C7.81 13.83 8.12 14.37 8.25 14.53" stroke-width="1.76"/><path d="M16.41 8.95C16.4 8.82 16.35 8.43 16.37 8.16C16.39 7.9 16.4 7.6 16.53 7.36C16.65 7.13 16.88 6.91 17.11 6.74C17.34 6.57 17.61 6.42 17.9 6.35C18.18 6.27 18.5 6.25 18.8 6.28C19.1 6.31 19.42 6.38 19.69 6.52C19.97 6.66 20.23 6.88 20.42 7.12C20.61 7.36 20.78 7.67 20.85 7.97C20.92 8.27 20.92 8.61 20.86 8.92C20.81 9.24 20.71 9.59 20.52 9.85C20.34 10.11 20.03 10.33 19.75 10.51C19.46 10.69 19.13 10.89 18.79 10.96C18.46 11.02 18.07 10.97 17.72 10.89C17.38 10.81 17.03 10.67 16.72 10.48C16.42 10.28 16.11 10.03 15.91 9.73C15.7 9.43 15.54 9.04 15.5 8.69C15.46 8.33 15.64 7.76 15.67 7.58" stroke-width="1.456"/><path d="M15.17 3.56C15.3 3.54 15.68 3.46 15.93 3.48C16.18 3.51 16.46 3.57 16.68 3.7C16.9 3.84 17.09 4.05 17.26 4.27C17.42 4.48 17.56 4.73 17.65 4.99C17.73 5.25 17.77 5.54 17.76 5.82C17.76 6.11 17.73 6.43 17.62 6.69C17.5 6.95 17.29 7.17 17.08 7.38C16.87 7.58 16.64 7.79 16.37 7.91C16.11 8.03 15.8 8.09 15.5 8.1C15.19 8.12 14.85 8.1 14.57 7.99C14.29 7.87 14.01 7.65 13.79 7.43C13.57 7.2 13.38 6.91 13.25 6.62C13.11 6.32 13.02 5.99 12.98 5.66C12.95 5.32 12.94 4.94 13.04 4.62C13.14 4.3 13.35 4 13.57 3.72C13.78 3.45 14.03 3.15 14.32 2.98C14.62 2.8 15.17 2.71 15.34 2.66" stroke-width="1.616"/></svg>Pencil variant
import '@matita/icons/pencil.css';
import { Bone } from '@matita/icons/react';
<Bone size={32} pencil />The file is icons/bone.svg in the package (pencil/bone.svg for the pencil variant). Matita 0.4.0.
02How it's drawn
The recipe for bone
Bone is not stored as a drawing. It is a recipe of 2 lines and 4 circles 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.
L 9.48 16.36 16.36 9.48;
L 7.64 14.52 14.52 7.64;
C 8.41 18.41 2;
C 5.59 15.59 2;
C 18.41 8.41 2;
C 15.59 5.59 2bone as a number: 3683705231
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 bone. Seed 0 is the default.
bone from exact shapes (wobble 0) to the full hand (wobble 1, the default). The exact version is also a ready-made file: exact/bone.svg.
True pixel sizes.