Live lint
Preview in context
Fox-ify
Paste or drop any SVG. It is mapped onto the 24 grid, fills become strokes, transforms are baked and points snap, until it passes the icon rules.
Sketch search
Draw a rough shape. The 24 closest icons appear while you draw, ranked in this page against a shape index of the whole set.
Your strokes stay on this device: nothing is uploaded, the sketch is compared with a precomputed index of every icon.
Fusion
Click a part in the preview to select it, then drag it or use the arrow keys.
Motion
A timeline per element of an icon. Click a lane to add a keyframe, drag it to move it, and export the result for every package.
Keyframe
Brand kit
Theme the whole set and export it ready to ship.
Inside the zip
- svg/ with every icon as a themed SVG file
- sprite.svg and icons.css with the brand CSS variables
- favicon/ with favicon.ico, PNGs at 16, 32, 180, 192 and 512, maskable icons and a web manifest
- app/ with store icons and an Android adaptive foreground
- package.json, index.js and typings, ready to publish
Hero 3D
A name, a fusion like cloud&lock:overlap or a modifier like file+check. No icon has this name.
Reduced motion is on, so the turntable stays still.
Loading three.js
Export PNG
three.js loads from jsDelivr when you open this tab. three@0.186.1
Collection
Icons you draw, Fox-ify or fuse are stored in this browser.
Nothing here yet. Draw an icon in the editor, Fox-ify an SVG or save a fusion.