CSS Design System

Settings

design_system: simple
theme:
  - light
  - dark
  - system

Skill loaders strip YAML frontmatter, so settings live here at the top of the body. They are already in your context — never open this file to look them up. When a command changes a setting, rewrite the value in this block.

Create CSS design-system foundations using CSS files only. Do not add Tailwind, Sass, component libraries, CDNs, build steps, or generated JavaScript.

This skill follows a portable structure: one clear CSS entry point loads primitive tokens, semantic theme tokens, base styles, and component classes when the project uses that split. The root directory and file split must follow the target project's existing style location when one exists; do not assume any fixed path from the reference project.

Command Rules