◆ Design Guide Skill Input Form

Provide the details below to help Claude's Design Guide skill create modern, professional, accessible UI components and layouts with production-ready code.

►

1️⃣ Project Overview

Choose the type of design work you need
Describe what you want to build in detail
Who will use this interface?
►

2️⃣ Design Preferences

Dark Ops offers a premium, professional aesthetic with subtle gold accents
One accent color for CTAs, buttons, and key interactions (leave blank for default)
Minimal & Clean Professional Modern & Tech Playful & Friendly Premium & Luxe Brutalist
Select the overall feel you want to achieve
►

3️⃣ Component & Layout Requirements

List specific components, features, or layout elements needed
📱 Mobile 💻 Tablet 🖥️ Desktop 📺 Large Displays
Which screen sizes should be supported?
Hover Focus Active/Pressed Disabled Loading Error Success
Which interaction states should be defined?
►

4️⃣ Technical Stack & Output

Choose your preferred tech stack
shadcn/ui is recommended for production-ready accessible components
Complete Code Design Specs Design Tokens Figma-Ready Documentation
Choose what deliverables you need
►

5️⃣ Accessibility & Constraints

WCAG AA is the standard for most web applications
⌨️ Keyboard Navigation 🔊 Screen Reader 🔆 High Contrast Mode 🎬 Reduced Motion ↔️ RTL Support
Select required accessibility features
Any specific limitations, requirements, or things to avoid
►

6️⃣ Additional Context

►

✅ Generated Prompt