Design Theme Generation Skill — Design skill for Claude Code

Design Theme Generation - Claude Skill

A Claude Skill that systematically transforms visual inspirations into professional design themes through moodboard analysis. Generate complete aesthetic specifications with hex codes, font names, spacing values, and anti-pattern lists.

[](https://claude.ai) [](LICENSE)

---

🎨 What This Skill Does

Automatically helps you generate professional, non-generic design themes for:

• Landing pages and marketing sites
• Design systems for products
• UI/UX components and screens
• Color schemes and typography choices
• Brand aesthetics and visual direction

**The Problem:** AI defaults to generic designs (Inter font, #3B82F6 blue, basic card grids)

**The Solution:** Systematic moodboard analysis → Distinctive, professional aesthetics

---

⚡ Quick Start

Installation

1. **Download the skill:**

   # Clone this repository
   git clone https://github.com/yourusername/design-theme-generation.git
   cd design-theme-generation

2. **Upload to Claude.ai:**

   • Go to claude.ai → Settings → Skills
   • Enable Skills if not already enabled
   • Click "+ Upload Skill"
   • Select design-theme-generation.zip

3. **Verify installation:**

   • You should see "design-theme-generation" in your Skills list
   • Description: "Systematically generate professional design themes..."

First Use

Try this prompt in a new Claude chat:

Design a landing page for my meditation app

Claude will automatically:

1. ✅ Ask for product context (emotion, audience, anti-patterns)
2. ✅ Request moodboard examples (3-5 visual inspirations)
3. ✅ Analyze patterns from your examples
4. ✅ Generate complete aesthetic prompt with specific tokens
5. ✅ Be ready to implement the design

---

📖 Usage Examples

Example 1: Simple Request

Design