Skills Design — Security skill for Claude Code
Design skills for Claude Code, Codex, Cursor — homepage and landing page design, UI design audit with A-F grading, design tokens and design systems (primitive/semantic/component layers, dark mode, mig.
How to install Skills Design
This entry records only its repository, not the path inside it, so there is no
exact command to give. Open meshcode-ai/skills-design and copy the folder into
~/.claude/skills/, or the file into ~/.claude/agents/.
What Skills Design does
Design skills for Claude Code, Codex, Cursor — homepage and landing page design, UI design audit with A-F grading, design tokens and design systems (primitive/semantic/component layers, dark mode, migration). Knowledge-first agent skills: AI-template tells, conversion structure, judgment criteria + output contracts, no scripts. MIT.
Alternatives in Security
- Anthropic Cybersecurity Skills — 734+ structured cybersecurity skills for AI agents · MITRE ATT&CK mapped · agentskills.io open standard · Work 3.8k ★
- Loongsuite Pilot — Local-first telemetry collector for AI coding agents — unified OpenTelemetry events for Claude Code, Codex, Cu 150 ★
- Amazon Skills — Free AI agent skills for Amazon sellers— keyword research, competitor analysis, listing audit & more 127 ★
README
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
- Download the zip → extract into your project's
.meshcode/skills/(flat: `.meshcode/sk
Related Skills
Colors
Run a color-only design audit — contrast, near-duplicates, dark mode, semantic coverage. Scoped variant of /ui
Claude Code Marketing Skills
git clone https://github.com/cognyai/claude-code-marketing-skills ~/.claude/skills/claude-code-marketing-skill
UI UX Review
Run a visual design conformance audit using the ui-ux-engineer agent — spacing, typography, colour tokens, res
Skillen
Audit your AI coding skills using your real conversation history — find the toxic ones wasting tokens. Support
AI Structure Audit
Evidence-driven audit of AI systems across prompt, context, harness, loop, and graph layers.
Deploy Public
Audit and update the public repo README files and landing page, then commit ~/.claude/ private repo, sync, and
Related Agents
UI Visual.Agent
Use when designing or reviewing the visual UI for the target repo: layout metrics, spacing, typography, semant
CSS Engineer
CSS Engineer (Tier 3): implements design tokens and modern CSS — cascade layers, container queries, :has, nest
UI Polisher
Improves Heron's Svelte components for visual polish and consistency — 4/8 px grid, semantic tokens that work