fth-design-crafter
Installation
SKILL.md
FTH Design Crafter
One skill for the whole visual system: FOUNDATIONS decides color and type from evidence, SPEC writes it down as DESIGN.md and tokens, PAGE designs screens on top of it, REVIEW checks pages and code against it.
The goal is a system that belongs to this product. It must not look like a template or like typical AI output, including Claude's own habits (warm cream + terracotta, serif-heavy "editorial" defaults).
Pick the mode
| Request | Mode | Read |
|---|---|---|
| Colors, palette, fonts, typography, "make it look like us", new brand look | FOUNDATIONS | references/research-protocol.md, references/color-method.md, references/typography-method.md, references/font-sources.md |
| DESIGN.md (google-labs-code/design.md format), tokens, Tailwind theme, extract a system from a URL, lint and enforce | SPEC | references/mode-spec.md |
| Design a page, landing, dashboard, screen structure | PAGE | references/mode-page.md, references/page-rules.md, references/page-examples.md |
| Review, audit, critique a page or UI code | REVIEW | references/mode-review.md, references/review-rubric.md |
A full run goes FOUNDATIONS → SPEC → PAGE → REVIEW. Start later only when the earlier output already exists (for example, an approved DESIGN.md).