Examples

Explore real-world examples of themes generated with shadcnai to get inspiration for your own projects.

Quick Examples

Here are some popular theme descriptions and their typical outputs:

Corporate & Professional

Banking Application

shadcnai theme "professional banking app with trustworthy blue tones and high contrast"

Generated Theme Highlights:

• Primary: Deep navy blue (#1e3a8a)
• Accent: Gold highlights (#f59e0b)
• Background: Clean whites and light grays
• Dark mode: Sophisticated dark blues with warm accents

Enterprise Dashboard

shadcnai theme "enterprise software dashboard with Microsoft-inspired design"

Generated Theme Highlights:

• Primary: Microsoft blue (#0078d4)
• Secondary: Subtle grays and blues
• Charts: Professional color palette
• Excellent accessibility contrast ratios

Creative & Artistic

Design Agency Portfolio

shadcnai theme "creative design agency with bold geometric colors and modern gradients"

Generated Theme Highlights:

• Primary: Vibrant purple (#8b5cf6)
• Accent: Electric lime (#84cc16)
• Background: Dramatic dark with color pops
• Shadows: Deep, modern drop shadows

Art Gallery Website

shadcnai theme "contemporary art gallery with museum-quality minimalism"

Generated Theme Highlights:

• Primary: Sophisticated charcoal (#374151)
• Accent: Gallery white (#fefefe)
• Minimal color palette
• Focus on content presentation

E-commerce & Retail

Fashion Boutique

shadcnai theme "luxury fashion boutique with rose gold and champagne accents"

Generated Theme Highlights:

• Primary: Rose gold (#e879f9)
• Secondary: Champagne (#fbbf24)
• Background: Soft neutrals
• Elegant typography support

Tech Store

shadcnai theme "modern electronics store with Apple-inspired clean design"

Generated Theme Highlights:

• Primary: Space gray (#6b7280)
• Accent: Apple blue (#007aff)
• Clean whites and subtle shadows
• Product-focused color scheme

SaaS & Productivity

Project Management Tool

shadcnai theme "productivity app with Notion-inspired calm and focus colors"

Generated Theme Highlights:

• Primary: Calm blue (#3b82f6)
• Secondary: Warm grays
• Excellent readability
• Stress-reducing color palette

Analytics Dashboard

shadcnai theme "data analytics platform with clear visualization colors"

Generated Theme Highlights:

• Chart colors: Distinct, accessible palette
• Primary: Data-friendly blue (#1d4ed8)
• Background: Clean for data clarity
• High contrast for readability

Theme Variations by Model

See how different AI models interpret the same prompt:

Prompt: "Startup landing page with energetic, modern colors"

Google AI (Gemini 1.5 Flash)

shadcnai theme "startup landing page with energetic, modern colors" --model gemini-1.5-flash

• Style: Balanced and professional
• Colors: Bright blue primary, orange accents
• Approach: Business-friendly with energy

OpenAI (GPT-4.1)

shadcnai theme "startup landing page with energetic, modern colors" --model gpt-4.1

• Style: Creative and bold
• Colors: Electric purple, lime green accents
• Approach: Artistic and unconventional

Anthropic (Claude 3.5 Sonnet)

shadcnai theme "startup landing page with energetic, modern colors" --model claude-3-5-sonnet-20241022

• Style: Sophisticated yet energetic
• Colors: Deep teal, vibrant coral accents
• Approach: Thoughtful brand building

Cerebras (Llama 3.1 70B)

shadcnai theme "startup landing page with energetic, modern colors" --model llama3.1-70b

• Style: Tech-forward and dynamic
• Colors: Cyan primary, electric yellow accents
• Approach: Silicon Valley aesthetic

Temperature Comparisons

See how temperature affects creativity:

Prompt: "E-commerce website with trustworthy design"

Conservative (Temperature 0.3)

shadcnai theme "e-commerce website with trustworthy design" --temperature 0.3

• Result: Safe blues and grays
• Colors: Navy, light blue, neutral grays
• Style: Traditional, reliable, conventional

Balanced (Temperature 0.7)

shadcnai theme "e-commerce website with trustworthy design" --temperature 0.7

• Result: Interesting but practical
• Colors: Teal primary, warm gray accents
• Style: Modern yet approachable

Creative (Temperature 1.2)

shadcnai theme "e-commerce website with trustworthy design" --temperature 1.2

• Result: Unexpected but functional
• Colors: Deep forest green, gold accents
• Style: Unique, memorable, still trustworthy

Industry-Specific Examples

Healthcare & Medical

Medical Practice

shadcnai theme "medical practice website with calming, professional colors"

• Calming blues and greens
• High accessibility compliance
• Trust-building color psychology

Health App

shadcnai theme "health tracking app with wellness-focused design"

• Nature-inspired greens
• Stress-reducing palette
• Motivational accent colors

Education & Learning

Online Course Platform

shadcnai theme "online learning platform with focus and concentration colors"

• Brain-friendly blues
• Minimal distractions
• Clear hierarchy colors

Children's Educational App

shadcnai theme "children's learning app with playful, engaging colors"

• Bright, cheerful palette
• High contrast for young eyes
• Fun but not overwhelming

Finance & Fintech

Investment Platform

shadcnai theme "investment platform with Wall Street sophistication"

• Deep navy and gold
• Wealth-associated colors
• Premium feel

Budgeting App

shadcnai theme "personal finance app with approachable, non-intimidating design"

• Friendly greens and blues
• Accessible to all demographics
• Positive money associations

Creative Inspiration Prompts

Nature-Inspired

# Ocean theme
shadcnai theme "ocean depths with coral reef accents and sea foam highlights"

# Forest theme
shadcnai theme "ancient forest with moss greens and golden sunlight filtering through"

# Mountain theme
shadcnai theme "mountain sunrise with alpine blue and warm golden peaks"

Cultural & Geographic

# Japanese minimalism
shadcnai theme "Japanese zen garden with natural stones and bamboo green"

# Scandinavian design
shadcnai theme "Scandinavian hygge with warm woods and cozy winter whites"

# Mediterranean vibes
shadcnai theme "Mediterranean sunset with terracotta and azure blue"

Artistic Movements

# Art Deco
shadcnai theme "1920s Art Deco with gold geometric patterns and deep emerald"

# Bauhaus
shadcnai theme "Bauhaus-inspired with primary colors and functional minimalism"

# Cyberpunk
shadcnai theme "cyberpunk neon with electric blue and hot pink accents"

Color Psychology Examples

Emotions & Moods

Calming & Relaxing

shadcnai theme "meditation app with zen tranquility and peaceful blues"

Energizing & Motivating

shadcnai theme "fitness app with high-energy oranges and motivational reds"

Professional & Trustworthy

shadcnai theme "consulting firm with authoritative navy and reliable grays"

Creative & Inspiring

shadcnai theme "design tool with creative purples and inspiring yellows"

Advanced Examples

Multi-Brand System

# Main brand
shadcnai theme "tech company primary brand with modern blue and silver"

# Consumer product line
shadcnai theme "same tech company's consumer app with friendly, approachable colors"

# Enterprise solution
shadcnai theme "same tech company's enterprise software with professional, serious tones"

Accessibility-First

# High contrast for visual impairments
shadcnai theme "accessible design with WCAG AAA compliance and high contrast ratios"

# Color-blind friendly
shadcnai theme "color-blind accessible interface with distinct patterns and shapes"

# Low vision support
shadcnai theme "low vision support with high contrast and clear distinction between elements"

Seasonal Themes

# Spring
shadcnai theme "spring renewal with fresh greens and blooming flower accents"

# Summer
shadcnai theme "summer energy with bright blues and sunny yellow highlights"

# Autumn
shadcnai theme "autumn warmth with rich oranges and deep burgundy"

# Winter
shadcnai theme "winter elegance with cool blues and silver frost accents"

Testing Your Themes

After generating themes, test them in different contexts:

Light vs Dark Mode

All themes generate both modes automatically. Test your content in both to ensure readability.

Different Screen Sizes

Colors may appear different on various devices. Test on mobile, tablet, and desktop.

Accessibility Testing

Use tools like:

• WAVE Web Accessibility Evaluator
• axe DevTools
• Lighthouse accessibility audit

Color Contrast

Ensure your generated themes meet WCAG guidelines:

• AA: 4.5:1 for normal text
• AAA: 7:1 for enhanced accessibility

Next Steps

Ready to create your own themes? Head to the Usage guide for detailed instructions, or check out the API Reference for programmatic integration.