Design & Creative
317 skills
UI/UX design and component libraries
brainstorming
obra
You MUST use this before any creative work - creating features, building components, adding functionality, or modifying behavior. Explores user intent, requirements and design before implementation.
vercel-react-best-practices
langgeniusVerified organization
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patter
skill-creator
langgeniusVerified organization
Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends Claude's capabilities with specialized knowledge, workfl
orpc-contract-first
langgeniusVerified organization
Guide for implementing oRPC contract-first API patterns in Dify frontend. Triggers when creating new API contracts, adding service endpoints, integrating TanStack Query with typed contracts, or migrat
web-design-guidelines
langgeniusVerified organization
Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".
brand-guidelines
anthropicsVerified organization
Applies Anthropic's official brand colors and typography to any sort of artifact that may benefit from having Anthropic's look-and-feel. Use it when brand colors or style guidelines, visual formatting
canvas-design
anthropicsVerified organization
Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create ori
plan-design-review
garrytan
Designer's eye review of a live site. Finds visual inconsistency, spacing issues, hierarchy problems, interaction feel, AI slop patterns, typography issues, missed states, and slow-feeling interaction
design-consultation
garrytan
Design consultation: understands your product, researches competitors, proposes a complete design system (aesthetic, typography, color, layout, spacing, motion), and generates font+color preview pages
qa-design-review
garrytan
Designer's eye QA: finds visual inconsistency, spacing issues, hierarchy problems, AI slop patterns, and slow interactions — then fixes them. Iteratively fixes issues in source code, committing each f
ui-ux-pro-max
nextlevelbuilder
UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Actions: plan, build, creat
frontend-ui-ux
code-yeongyu
Designer-turned-developer who crafts stunning UI/UX even without design mockups
write-pr
tldraw
Writing pull request titles and descriptions for the tldraw repository. Use when creating a new PR, updating an existing PR's title or body, or when the /pr command needs PR content guidance.
review-docs
tldraw
Review and improve documentation with parallel evaluation and iterative improvement loop.
write-unit-tests
tldrawVerified organization
Writing unit and integration tests for the tldraw SDK. Use when creating new tests, adding test coverage, or fixing failing tests in packages/editor or packages/tldraw. Covers Vitest patterns, TestEdi
write-issue
tldrawVerified organization
Writing and maintaining GitHub issues for the tldraw repository. Use when creating new issues, editing issue titles/bodies, triaging issues, or cleaning up issue metadata (types, labels).
write-example
tldrawVerified organization
Writing examples for the tldraw SDK examples app. Use when creating new examples, adding SDK demonstrations, or writing example code in apps/examples.
write-e2e-tests
tldrawVerified organization
Writing Playwright E2E tests for tldraw. Use when creating browser tests, testing UI interactions, or adding E2E coverage in apps/examples/e2e or apps/dotcom/client/e2e.
skill-creator
tldrawVerified organization
Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends Claude's capabilities with specialized knowledge, workfl
web-renderer-test
remotion-devVerified organization
Add a test case to the web renderer
writing-docs
remotion-devVerified organization
Guides for writing and editing Remotion documentation. Use when adding docs pages, editing MDX files in packages/docs, or writing documentation content.
web-design-guidelines
calcom
Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".
web-design-guidelines
sickn33
Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".
canvas-design
sickn33
Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create ori