Skills Design — Security skill for Claude Code

meshcode-ai/skills-design

[](LICENSE) [](#) [](https://agentskills.io/specification)

**Design skills for Claude Code, Codex, Cursor, and meshcode — homepage/landing design, UI design audit, and design-token systems.** The 3 design skills (`design-*`) are distilled editions containing **judgment knowledge only**, with no scripts: the AI-template tells that make a page look generated (cream+serif+terracotta, the SaaS-card kit, ALL-CAPS eyebrow chrome), conversion-order page structure, a 6-axis UI audit with A–F grading, and a three-layer token architecture (primitive → semantic → component) with a legacy migration rule. They follow the Agent Skills standard (agentkills.io) — unzip into your project's `.meshcode/skills/` (flat layout) and Claude Code, Codex, Cursor, and meshcode desktop pick them up from the next session.

Who this is for

• Founders and marketers — a homepage that converts instead of a template that "looks like AI made it"
• Designers and PMs — a repeatable design-review contract: graded axes, cited evidence, impact-ranked fixes
• Frontend teams — token architecture and a legacy value→token migration map that survives the codemod
• AI agent operators — knowledge-first design skills ready for stores and registries

Skill list

Skill	Role	Core judgment criteria
design-homepage	Homepage / landing page design	Conversion order, AI-template tells, one boldness point, quality floor
design-ui-audit	UI design review	6 axes A–F with cited elements, priority = impact × 1/difficulty
design-design-system	Design tokens / system	3 token layers, dark mode swaps semantic only, mapping-table migration

Install

1. Download the zip → extract into your project's .meshcode/skills/ (flat: `.meshcode/sk