Frontend design
Design a site's whole frontend — design system, greyboxing, real content. Use when the user wants to design or redesign a site's frontend, or to build all the pages of a new site.From its SKILL.md
npx -y skills add Firzus/agent-skills --skill frontend-designAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 1 stars1 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
SKILL.md
1.7 KB, 322 tokens by cl100k_base, as published. Nobody here has run it
Frontend Design
A router: a site's frontend is designed in three phases, each owned by its own skill, handing off through two artifacts at the project root.
| Phase | Skill | Artifact it owns |
|---|---|---|
| 1 | design-system | DESIGN.md — identity: design read, dials, tokens, surfaces |
| 2 | greyboxing | PAGES.md — page list, tiers, statuses, signature elements, motion theses |
| 3 | real-content | the pages themselves — every placeholder replaced, copy self-audit passed |
Invoke the skill for the phase the project is in; each declares its own gates and prerequisites. A phase starts only when the previous phase's artifact exists and its exit gate has passed. The artifacts are the memory: any session can pick the pipeline up by reading them.
Session discipline
Context is the scarce resource — split the work across sessions:
- One session for
design-system, through its grill and validation gate. - One fresh session per page for
greyboxing: readDESIGN.md+PAGES.md, build the page, updatePAGES.md, stop. The site pass gets its own session. - One session for
real-content(one per surface on multi-surface projects).
Small site (fewer than ~5 pages)? Chaining phases in one session is acceptable — the artifacts still get written, so any later session can take over.
What ships with it
Read from the repository
Just SKILL.md. No reference files, no scripts.