Use when the user wants to design, critique, or refine a website theme, visual style, look and feel, branding, CSS theme, design system, tokens.css file, or CSS token system. Produces theme directions, typography/color/composition/motion systems, implementation-ready CSS custom properties, component motif rules, and light/dark/density variant strategy.
99
100%
Does it follow best practices?
Impact
99%
1.45xAverage score across 7 eval scenarios
Passed
No known issues
The Harbor Climate Commons team has a theme direction for a civic climate data
archive, plus an early tokens.css handoff from a previous contractor. The
handoff is usable enough for a prototype, but it has drifted away from the
direction: developers keep adding local values, component styles are starting
to contradict each other, and accessibility review found several state and
motion gaps.
Read:
inputs/theme-direction.mdinputs/current-tokens.cssRepair the handoff into a production theme system. Do not invent a fresh brand from scratch; preserve the strongest direction decisions and turn them into a coherent, reusable implementation layer.
Produce tokens.css and handoff-notes.md. The result should repair the
existing handoff into a production system, preserve the source direction, and
give future developers enough guidance to extend the archive without adding
local exceptions.