ryanthedev

Design — Design skill for Claude Code

Design community

description: Establish design foundations — purpose, audience, aesthetic direction Run the design-for-ai skill in setup mode.

How to install Design

Installs to ~/.claude/skills/ryanthedev-design-for-ai-design/SKILL.md

Terminal

mkdir -p ~/.claude/skills/ryanthedev-design-for-ai-design && curl -fsSL https://raw.githubusercontent.com/ryanthedev/design-for-ai/HEAD/commands/design.md -o ~/.claude/skills/ryanthedev-design-for-ai-design/SKILL.md

Restart Claude Code, or start a new session, for it to be picked up.

What Design does

description: Establish design foundations — purpose, audience, aesthetic direction

Run the design-for-ai skill in setup mode. Gather design context through conversation:

Ask: "What are you building? What problem does it solve?"
Ask: "Who is the audience? Describe a typical user."
Ask: "Pick 3 words for the personality/feeling of this design."
Ask: "Any brand constraints? Framework? Accessibility requirements?"
Ask: "Show me a reference site (what should it feel like?) an

Alternatives in Design

Brand Guidelines — Apply Anthropic's official brand colors and typography to artifacts 94.1k ★
Od Contribute — Open a first-contribution PR (or bug issue) on nexu-io/open-design — works for non-coders too 91.8k ★
Export Diagram — Export a diagram-design HTML file to .svg and .png next to the source 27.2k ★