diff --git a/skills/creative/claude-design/SKILL.md b/skills/creative/claude-design/SKILL.md index 1e6d91db78e..de276a5b982 100644 --- a/skills/creative/claude-design/SKILL.md +++ b/skills/creative/claude-design/SKILL.md @@ -1,6 +1,6 @@ --- name: claude-design -description: Design-ready operating skill for CLI/API agents creating thoughtful HTML artifacts outside Claude Design's hosted web UI. Use for landing pages, prototypes, UI explorations, decks, component mockups, motion studies, and design-system exercises where the output should be local, self-contained, and high-craft. +description: Design one-off HTML artifacts (landing, deck, prototype). version: 1.0.0 author: BadTechBandit license: MIT @@ -16,6 +16,8 @@ Use this skill when the user asks for design work that would normally fit Claude The goal is to preserve Claude Design's useful design behavior and taste while removing hosted-tool plumbing that does not exist in normal agent environments. +**Before starting, check for other web-design skills like `popular-web-designs` (ready-to-paste design systems for Stripe, Linear, Vercel, Notion, etc.) and `design-md` (Google's DESIGN.md token spec format).** If the user wants a known brand's look, load `popular-web-designs` alongside this one and let it supply the visual vocabulary. If the deliverable is a token spec file rather than a rendered artifact, use `design-md` instead. Full decision table below. + ## When To Use This Skill vs `popular-web-designs` vs `design-md` Hermes has three design-related skills under `skills/creative/`. They do different jobs — load the right one (or combine them): diff --git a/skills/creative/design-md/SKILL.md b/skills/creative/design-md/SKILL.md index b51b25cce61..5884a60c603 100644 --- a/skills/creative/design-md/SKILL.md +++ b/skills/creative/design-md/SKILL.md @@ -1,6 +1,6 @@ --- name: design-md -description: Author, validate, diff, and export DESIGN.md files — Google's open-source format spec that gives coding agents a persistent, structured understanding of a design system (tokens + rationale in one file). Use when building a design system, porting style rules between projects, generating UI with consistent brand, or auditing accessibility/contrast. +description: Author/validate/export Google's DESIGN.md token spec files. version: 1.0.0 author: Hermes Agent license: MIT diff --git a/skills/creative/popular-web-designs/SKILL.md b/skills/creative/popular-web-designs/SKILL.md index eeb2a41a71f..4888c157ebc 100644 --- a/skills/creative/popular-web-designs/SKILL.md +++ b/skills/creative/popular-web-designs/SKILL.md @@ -1,10 +1,6 @@ --- name: popular-web-designs -description: > - 54 production-quality design systems extracted from real websites. Load a template - to generate HTML/CSS that matches the visual identity of sites like Stripe, Linear, - Vercel, Notion, Airbnb, and more. Each template includes colors, typography, components, - layout rules, and ready-to-use CSS values. +description: 54 real design systems (Stripe, Linear, Vercel) as HTML/CSS. version: 1.0.0 author: Hermes Agent + Teknium (design systems sourced from VoltAgent/awesome-design-md) license: MIT