design-baselinelisted

# Design Baseline ## What it does Web frontends built through SPECTER with no design input from the user tend to ship as plain unstyled HTML. This skill generates one machine-readable token artifact plus a small stylesheet the first time a Feature needs a UI surface, so "no design requirements" still ships something coherent rather than nothing. Unlike a design-judgment/process skill, this produces **actual values** — a real palette, type scale, spacing scale, and WCAG floors — ready to use as-is, or as the base a later design-direction pass builds on. ## When to use - **Automatic trigger**: a Feature's `### In scope` includes a web UI surface (a page, a component tree, a dashboard) and `docs/design/DESIGN.md` does not exist yet in this project. - Not triggered again once `docs/design/DESIGN.md` exists — subsequent UI Features read the existing tokens instead of regenerating them. ## How it works ### 1. Generate once, reuse always On first trigger: copy `assets/tokens.css` and `assets/base.css` into the project (conventionally `docs/design/tokens.css` and `docs/design/base.css`, adjust the path to match the project's actual static-asset layout), and instantiate `assets/DESIGN.md.template` as `docs/design/DESIGN.md` with today's date and the triggering Feature number filled in. On every later UI Feature: read `docs/design/DESIGN.md` and the linked stylesheets; **never** hardcode a new color, font size, or spacing value that isn't already one of the semantic tokens