cli/assets/skills/ui-styling/references/canvas-design-system.md
Visual design philosophy, systematic composition, and sophisticated visual communication.
Canvas design operates through two-phase process:
Create visual philosophy - aesthetic movement expressed through form, space, color, composition. Not layouts or templates, but pure visual philosophy.
What is created: Design manifesto emphasizing:
Philosophy structure (4-6 paragraphs):
Express philosophy through canvas artifacts:
Information lives in design, not paragraphs. Express ideas through:
Text as rare, powerful gesture:
Work must appear:
Use scientific visual language:
Philosophy: Communication through monumental form and bold geometry.
Expression:
Philosophy: Color as primary information system.
Expression:
Philosophy: Quiet visual contemplation through texture and breathing room.
Expression:
Philosophy: Natural clustering and modular growth patterns.
Expression:
Philosophy: Pure order and restraint.
Expression:
Embed conceptual DNA without announcing:
Intentional palette:
Example palette:
--color-primary: oklch(0.55 0.22 264)
--color-accent: oklch(0.75 0.18 45)
--color-neutral: oklch(0.90 0.02 264)
--color-dark: oklch(0.25 0.15 264)
Thin fonts preferred:
Font integration:
./canvas-fonts directorySystematic approach:
Spacing discipline:
Technical specs:
When creating multiple pages:
Before finalizing:
Create based on philosophy and principles.
User already said: "It isn't perfect enough. Must be pristine, masterpiece of craftsmanship, as if about to be displayed in museum."
Apply this standard before delivery.
Required files:
Philosophy file contains:
Canvas file contains:
Apply canvas design for: