Frontend Design
- Visual
- Web
Deciding how a UI should look and feel before you build it: typography, colour, hierarchy, and escaping the default templated appearance.
A situation it fits
Your app works fine, but every screen looks like the same generic template every other AI app ships with. You want it to feel designed.
7 scenarios in the bank answer to Frontend Design. The rest are in the game.
Skills it gets confused with
These share a family with Frontend Design, which is another way of saying they are the ones you might reach for by mistake.
- Theme FactoryPut a consistent look on something already built: pick or generate a colour-and-font theme and apply it across slides, docs, or a page.
- Web Artifacts BuilderAmbitious claude.ai artifacts with many moving parts: React, Tailwind, component libraries, real state and routing rather than a single static page.
- Algorithmic ArtArt that is generated rather than drawn: flow fields, particle systems, seeded randomness you can re-roll and tune. Code is the medium.
- Brand GuidelinesApplies Anthropic's own brand colours and type to an artifact. Only right when the thing genuinely should look like Anthropic made it.
- Canvas DesignStill visual art delivered as a .png or print-ready .pdf: a poster, a flyer, a one-page piece meant to be looked at rather than clicked.
- responsive-design (wshobson)Make one layout work across screen sizes — fluid grids, breakpoints, and sensible touch targets — so a page reads well on phone, tablet, and desktop without a separate mobile site.
Knowing what Frontend Design does is the easy half. Telling it apart from the others under time pressure is the game.
Today's sessionFrontend Design is part of anthropics/skills. Licence: Apache-2.0. The description above was written for this game, not taken from the skill.