Menu
Typstスライドに合うSVG図解を作成し、スライドへ組み込む。（図の情報設計はimpeccable/layoutを主に参照）
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
Run technical quality checks across accessibility, performance, theming, responsive design, and anti-patterns. Generates a scored report with P0-P3 severity ratings and actionable plan. Use when the user wants an accessibility check, performance audit, or technical quality review.
Amplify safe or boring designs to make them more visually interesting and stimulating. Increases impact while maintaining usability. Use when the user says the design looks bland, generic, too safe, lacks personality, or wants more visual impact and character.
Add moments of joy, personality, and unexpected touches that make interfaces memorable and enjoyable to use. Elevates functional to delightful. Use when the user asks to add polish, personality, animations, micro-interactions, delight, or make an interface feel fun or memorable.
Create distinctive, production-grade frontend interfaces with high design quality. Generates creative, polished code that avoids generic AI aesthetics. Use when the user asks to build web components, pages, artifacts, posters, or applications, or when any design skill requires project context. Call with 'craft' for shape-then-build, 'teach' for design context setup, or 'extract' to pull reusable components and tokens into the design system.
Tones down visually aggressive or overstimulating designs, reducing intensity while preserving quality. Use when the user mentions too bold, too loud, overwhelming, aggressive, garish, or wants a calmer, more refined aesthetic.
Typstスライドをビルドし、PDF化したときの詰まり、はみ出し、過密を確認して修正する。（構図の意図はlayout/impeccableを主に参照）
| name | typst-svg |
| description | Typstスライドに合うSVG図解を作成し、スライドへ組み込む。（図の情報設計はimpeccable/layoutを主に参照） |
Typstスライドに挿入するSVG図解を作るためのスキル。
図が伝えるべきメッセージや視線の流れは .agents/skills/impeccable・layout を主に決め、このスキルは パレットに沿った SVG の作成と Typst への埋め込みを扱う。
template/assets/svg/examples/assets/svg/assets/svg/docs/style-guide.md のパレットに合わせるtemplate/style.typ の colors / theme に合わせる（ここに独自色を増やさない）。
#2C2A4A#B89B4F#DADAD8, カード面 #EFEEEC#2B2F3A、補足: #5A6070#C8C8C5#3A7D44 / #C78B2A / #B94A48 / #3A6EA5#image("assets/svg/name.svg") として挿入するmise run build で確認する.agents/skills/typst-svg を使って、Typstのコンパイルフローを示すSVGを作り、template/main.typ に挿入して