Keyboard shortcuts

Press or to navigate between chapters

Press S or / to search in the book

Press ? to show this help

Press Esc to hide this help

SVG assets — reference & aliases

Every svg() import takes an asset:svg/<set>/<name>.svg URI (or your own file path). The bundled catalogue covers 6,404 shapes across four sets, vendored by scripts/fetch-svg-assets.sh and screened with manic svgcheck assets/svg. Licences: assets/svg/LICENSES.md.

Reference notation

svg(logo, (cx, cy), "asset:svg/lucide/rocket.svg", 300);   // an icon
svg(fin,  (cx, cy), "asset:svg/flags/in.svg",       220);   // a flag (ISO code)
svg(joy,  (cx, cy), "asset:svg/emoji/fire.svg",     140);   // an emoji (alias)
svg(joy,  (cx, cy), "asset:svg/emoji/1f525.svg",    140);   // …same, by codepoint
SetCountNamingLicenceImports as
lucide/~1,756icon name (cpu, database, map-pin, …)ISCthemeable outline (recolour it)
heroicons/~324icon name (bolt, beaker, rocket-launch, …)MITthemeable solid glyph
flags/~271ISO 3166-1 alpha-2 (us, in, jp, de, …)MITfull colour
emoji/~4,009Unicode codepoint (1f525.svg) or friendly aliasCC-BY 4.0full colour

Themeable vs faithful. Lucide/Heroicons paint with currentColor, so they take the entity’s colour — recolor(icon, cyan) just works. Flags and emoji keep their real colours. Concave shapes (stars, emblems) fill correctly, and stroke-drawn designs (stripes, Nordic crosses) import as filled bands.

Known limitation. A few flags place their stars with SVG <use> instancing (e.g. cn — China) or <marker>; those instanced glyphs render incorrectly for now (tracked). The flag’s plain fields still show, and all icons/emoji and most flags render cleanly. svgcheck a set before you rely on it.

Emoji friendly aliases

Twemoji files are named by Unicode codepoint; these short names resolve to the same file — either works:

AliasCodepointAliasCodepointAliasCodepoint
grinning1f600heart2764sun2600
smile1f604fire1f525moon1f319
joy1f602rocket1f680cloud2601
wink1f609star2b50zap26a1
thumbsup1f44dtrophy1f3c6rainbow1f308
thumbsdown1f44eparty1f389earth1f30d
check2705brain1f9e0target1f3af
cross274cbulb1f4a1flag1f6a9
warning26a0eyes1f440hourglass231b
thinking1f914clap1f44fchart1f4c8
sob1f62dwave1f44bcomputer1f4bb
muscle1f4aamoney1f4b0phone1f4f1
lock1f512key1f511mail1f4e7
bell1f514door1f6aacar1f697
goat1f410

Any other emoji works by codepoint — e.g. asset:svg/emoji/1f680.svg (🚀). Add your own aliases in scripts/fetch-svg-assets.sh.

Discovering the full catalogue

Browse every bundled asset: the SVG asset catalogue lists all 6,400+ files by set — searchable with ⌘/Ctrl-F, no CLI needed. That page is generated from the assets themselves by scripts/gen-svg-index.py, so it always matches what ships.

If you have the CLI, svgcheck also screens a folder — and shows what each file imports as (paths, points, themeable vs coloured):

$ manic svgcheck assets/svg/lucide
  ✓ rocket.svg — 4 paths, 199 pts, themeable
  ✓ map-pin.svg — 2 paths, 147 pts, themeable
  …
$ manic svgcheck assets/svg/flags        # every country flag
$ manic svgcheck assets/svg/emoji        # every Twemoji

scripts/fetch-svg-assets.sh re-vendors or updates every set from its upstream repo (Lucide · Heroicons · flag-icons · Twemoji). Bring your own: svg(id, pos, "path/to/any.svg") imports any SVG file — vet it with svgcheck first. See the import how-to for positioning, resizing, recolouring, and animating.