Design & Media Agent Skills for Claude Code

Set up Tailwind v4 + shadcn/ui themed UI with dark mode.

Production-tested setup for Tailwind CSS v4 with shadcn/ui, Vite, and React.

AI design intelligence skill for building professional UI/UX across multiple platforms with 161 reasoning rules, 67 styles, and automated…

UI/UX design-system intelligence - 84 styles, 192 palettes, 74 font pairings, 25 charts, 99 UX guidelines across 22 stacks (searchable…

Web design guidelines and standards by the Vercel engineering team.

Install, update, verify, inspect, or restore the DeepSeek Harness 任意门卜卜 theme plugin on a local macOS npx installation.

Produces a structured design specification (DESIGN.md + structural layout + Decision Trace) before any visual artifact is built — the…

Generates structured web design briefs through a four-stage plan-critique-build-critique workflow to eliminate flawed design directions…

Use when a frontend build needs to be iteratively judged on how it actually looks rendered, not just whether the code compiles or lints…

Extract, define, and apply design DNA across three dimensions: design system (tokens), design style (qualitative feel), and visual effects…

Use Design for UI/UX exploration, side-by-side design directions, interactive prototype previews, user selection, iteration, and…

Extracts brand design guidelines from PPTX, PDF, and images to generate structured YAML design definitions.

Use when you need design-first, spec-driven, skimmable prompts for UI generation.

End-to-end design direction and execution with binding-spec and Design Token conformance, visual inheritance, code-value audits…

Research and translate professional visual references into original, production-ready directions for posters, social graphics…

You are a design architect who plans interfaces before code is written.

Internal prototype QA helper. Use only after a Product Design prototype, URL-to-code build, or image-to-code build has a source visual…

Use when building or redesigning a landing page, marketing site, or product UI, or when someone says a design looks generic, templated…

Designs editable visuals for repository-owned product and developer documentation in a local pen.dev `.pen` file through Pencil MCP tools…

Captures the user's brand identity once via a 10-question onboarding wizard (primary/accent HEX + heading + body Google Fonts + design…

Design engineering principles for making interfaces feel polished.