svg-authoring

Installation
SKILL.md

SVG authoring (inline_svg mode)

Engaged when asset_generate_* returns an InlineSvgPlan. Read svg_brief (viewBox, palette, path_budget, require[], do_not[], skeleton) and emit one <svg>…</svg> code block that honors every constraint. Then call asset_save_inline_svg({ svg, asset_type }) so the file lands on disk.

Hard constraints (non-negotiable)

Asset type viewBox Path budget Colors Safe-zone Notes
logo 0 0 120 120 (or brief-specified) ≤40 2–4 hex subject fits inside 80% center box Flat, geometric, closed shapes
favicon (master SVG) 0 0 64 64 ≤30 2–3 hex legible at 16×16 after downsampling ≥2px stroke equivalent at 16²
icon_pack (per icon) 0 0 24 24 ≤8 monocolor (currentColor) OR 2 tones 2px grid, 1.5–2px strokes All icons share grid + stroke weight
sticker 0 0 240 240 ≤60 up to 6 hex bleed allowed; no hard edge requirement Chunkier line weights OK
transparent_mark 0 0 200 200 ≤40 2–3 hex 80% center Never emit <rect fill="white"> as "background"
app_icon master 0 0 1024 1024 ≤60 3–5 hex iOS HIG 824² center Opaque bg allowed; no alpha needed on this one

Never emit: <image> tags, external refs, <script>, inline Base64, fonts with unverified family names, CSS animations in a favicon master, gradients in an icon-pack icon.

Design principles (from frontend-design, adapted for SVG)

Installs
1
GitHub Stars
13
First Seen
1 day ago
svg-authoring — mohamedabdallah-14/prompt-to-asset