visual-design-foundationslisted

# Visual Design Foundations ## Coverage Design and audit visual craft for interface surfaces. Covers palette direction, type scale, spacing rhythm, hierarchy, density, elevation, borders, contrast intent, visual weight, motion feel, brand fit, and when a visual system should be split into deeper color, typography, or motion skills. ## Philosophy Visual design is not decoration after structure; it is how the structure becomes legible. Good visual craft makes priority, grouping, affordance, and tone visible without asking the user to parse every label. Keep this skill at foundation level. If the task needs formal color math, font-loading engineering, or token governance, hand off to the skill that owns that contract. ## Method 1. Name the surface type: operational tool, docs, dashboard, editorial page, marketplace, or brand page. 2. State the intended tone and scanning demand. 3. Choose palette roles before picking raw colors: surface, text, accent, success, warning, danger, info, disabled. 4. Define type roles: page title, section heading, control label, body, metadata, numeric emphasis. 5. Set spacing and density rules that match repeated use, not one screenshot. 6. Use elevation, border, and background only to clarify grouping or affordance. 7. Check visual decisions against `semiotics` and `a11y` before treating them as done. ## Evals This skill ships a comprehension-eval artifact at [`examples/evals/visual-design-foundations.json`](https://github.com/jacob-balslev