Menü
Author and update SVG visual assets using project branding identity
Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.
Basierend auf der SOC-Berufsklassifikation
Step 2 — Architecture and domain design, one feature at a time
Step 1 — discover requirements through stakeholder interviews and write Gherkin acceptance criteria
Generate and update architecture diagrams, living glossary, and system overview from existing project docs
Enforce code quality using ruff, pytest coverage, and static type checking
Create pull requests with conventional commits, proper formatting, and branch workflow
Flow protocol — design and operate state machine workflows with FLOW.md + WORK.md
| name | design-assets |
| description | Author and update SVG visual assets using project branding identity |
| version | 1.0 |
| author | designer |
| audience | designer |
| workflow | branding |
Create or update docs/assets/logo.svg and docs/assets/banner.svg from the project's branding identity in docs/branding.md.
docs/assets/ is empty after project setupRead docs/branding.md. Extract: project name, tagline, primary/accent colors, tone of voice. If colors are absent, run skill design-colors first.
All SVGs must follow these constraints (W3C SVG 2 spec — CSS properties take precedence over presentation attributes; inline <style> required for cascade control):
viewBox="0 0 W H" always set; no fixed width/height on <svg> root--color-primary, --color-accent with fallback hexfont-family: system-ui, -apple-system, sans-serif (no external imports)<image> refs; raster only if base64-inlinedrole="img" and aria-label="<description>" on every <svg> (WCAG 1.1.1 — non-text content requires text alternative)viewBox="0 0 1200 300". Three zones:
viewBox="0 0 100 100" (square). One recognizable shape readable at 16px. No text in the mark; create a separate lockup if text is needed.
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 300" role="img" aria-label="<project-name> banner">
<style>
:root { --color-primary: #XXXXXX; --color-accent: #XXXXXX; }
.bg { fill: var(--color-primary); }
.title { fill: #ffffff; font-family: system-ui, -apple-system, sans-serif; font-size: 56px; font-weight: 700; }
.sub { fill: var(--color-accent); font-family: system-ui, -apple-system, sans-serif; font-size: 22px; }
</style>
<rect class="bg" width="1200" height="300"/>
<!-- content -->
</svg>
git add docs/assets/
git commit -m "design(assets): <create|update> <banner|logo>"
docs/branding.md read before writing any SVGdocs/branding.md; skill design-colors run if absentviewBox set; no fixed width/height on <svg> rootrole="img" and aria-label presentdocs/assets/