{"slug": "anthropic-s-frontend-design-skill-names-the-three-cliche-ai-looks-hex-codes", "title": "Anthropic's frontend-design skill names the three cliché \"AI looks\", hex codes included", "summary": "Anthropic has released an official Claude Code skill called frontend-design that aims to prevent AI agents from producing generic-looking web designs. The skill, which is a 55-line prose file with no scripts, identifies three common AI-generated design clichés, including a cream background with serif typography and terracotta accents, and provides hex codes for these patterns. With over 825,000 installs, it is the third most-installed agent skill, and its approach of describing failure modes rather than banning specific elements is highlighted as a useful prompt-engineering pattern.", "body_md": "Anthropic ships an official Claude Code skill whose whole job is stopping your agent from designing the same page every other agent designs. It is called frontend-design, it is 55 lines of prose with no scripts and no component library, and it has 825,477 installs as of the August 27, 2026 Skillselion catalog sync, which makes it the third most-installed agent skill overall.\n\nWe read the file line by line for the [frontend-design deep dive](https://skillselion.com/skills/anthropics/skills/frontend-design?utm_source=devto&utm_medium=social&utm_campaign=frontend-design-dive-aug-28#deep-dive) on its listing page. Disclosure: we run Skillselion, the directory the dive lives on.\n\nThe part worth your attention is one paragraph in the middle. Anthropic describes, with a hex code, exactly what AI-generated design collapses into when nobody stops it.\n\n\"AI-generated design right now clusters around three looks: (1) a warm cream background (near #F4F1EA) with a high-contrast serif display and a terracotta accent; (2) a near-black background with a single bright acid-green or vermilion accent; (3) a broadsheet-style layout with hairline rules, zero border-radius, and dense newspaper-like columns. All three are legitimate for some briefs, but they are defaults rather than choices.\"\n\nSource: `SKILL.md`\n\n, \"Process\" section, [anthropics/skills](https://github.com/anthropics/skills) on GitHub. Quotes verified against the upstream file on August 19, 2026; the file last changed June 9, 2026.\n\nIf you have shipped an agent-built landing page this year, you have probably shipped look number one.\n\nThe earlier version of this skill banned aesthetics by name: Inter, Roboto, purple gradients on white. The rewrite drops the blacklist entirely and replaces it with descriptions of the failure modes. A banned-fonts list rots the day a new default font appears. A description of the cliché generalizes: the agent can recognize the cream-serif-terracotta pattern in any font, any framework, any year.\n\nThat is a prompt-engineering pattern worth stealing for your own skills: describe the failure mode you want avoided instead of enumerating instances of it.\n\nThe file changes agent behavior in eight moves. The short version:\n\nThe full walkthrough with every quoted section lives in the [deep dive on the frontend-design listing](https://skillselion.com/skills/anthropics/skills/frontend-design?utm_source=devto&utm_medium=social&utm_campaign=frontend-design-dive-aug-28).\n\nTwo honest caveats from our read. It optimizes for distinctiveness, so on plain internal tools it can over-art-direct; constrain it with your own brief. And it contains almost no engineering: one CSS-specificity warning and a quality floor (responsive, keyboard focus, reduced motion), no accessibility depth, no performance budgets. It tells your agent what designed means, not how to ship it.\n\nOne more thing to check before installing: a repackaged clone of this skill circulates under a different owner. Verify the repo owner is anthropics.\n\nfrontend-design is the biggest entry in a cluster of skills that all attack the same problem: agent output that looks generated. If you are building out a design-side setup, these are the neighbors, with installs as of the same August 27 catalog sync:\n\nWe keep the whole category ranked by real installs on the [frontend design skills hub](https://skillselion.com/best/skills-for-frontend-design?utm_source=devto&utm_medium=social&utm_campaign=frontend-design-dive-aug-28), and the section-by-section reads for other major skills in the [Deep Dives library](https://skillselion.com/deep-dives?utm_source=devto&utm_medium=social&utm_campaign=frontend-design-dive-aug-28). If you want to see how a discovery skill does the instructions-only trick at even larger scale, the [find-skills listing](https://skillselion.com/skills/vercel-labs/skills/find-skills?utm_source=devto&utm_medium=social&utm_campaign=frontend-design-dive-aug-28) sits at 3,135,861 installs, and the broader [skills directory](https://skillselion.com/skills?utm_source=devto&utm_medium=social&utm_campaign=frontend-design-dive-aug-28) is refreshed daily from skills.sh, GitHub and MCP registries, ranked by real installs.\n\nInstall line, if you want it:\n\n```\nnpx skills add https://github.com/anthropics/skills --skill frontend-design\n```\n\n825,477 installs, as of the August 27 sync, for a file that is mostly a client brief. Read the file before you let it art-direct you.", "url": "https://wpnews.pro/news/anthropic-s-frontend-design-skill-names-the-three-cliche-ai-looks-hex-codes", "canonical_source": "https://dev.to/skillselion/anthropics-frontend-design-skill-names-the-three-cliche-ai-looks-hex-codes-included-f29", "published_at": "2026-08-28 08:22:40+00:00", "updated_at": "2026-08-28 08:48:56.486666+00:00", "lang": "en", "topics": ["ai-tools", "developer-tools", "generative-ai"], "entities": ["Anthropic", "Claude Code", "Skillselion", "GitHub"], "alternates": {"html": "https://wpnews.pro/news/anthropic-s-frontend-design-skill-names-the-three-cliche-ai-looks-hex-codes", "markdown": "https://wpnews.pro/news/anthropic-s-frontend-design-skill-names-the-three-cliche-ai-looks-hex-codes.md", "text": "https://wpnews.pro/news/anthropic-s-frontend-design-skill-names-the-three-cliche-ai-looks-hex-codes.txt", "jsonld": "https://wpnews.pro/news/anthropic-s-frontend-design-skill-names-the-three-cliche-ai-looks-hex-codes.jsonld"}}