Design theme

Skill kensaurus/cursor-kenji/skills/design-theme

🦖Curated Cursor AI agent skills, slash commands, MCP configs, subagents & rules for full-stack dev — React 19, Next.js 15, Supabase, Tailwind v4, TypeScript

Install

npx -y skills add kensaurus/cursor-kenji --skill design-theme

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

One thing to look at

6 stars6 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

What its author says it does

Copied from the file, not written here

Apply cohesive visual themes to artifacts (slides, docs, landing pages). Provides 11 pre-set themes with colors/fonts. Use when user mentions "apply theme", "color palette", "brand colors", "styling slides", "presentation design", "visual identity", or wants consistent styling across artifacts.

The file declares its own license as MIT. That is the author’s claim about this one file, and it is not the same thing as the license GitHub reports for the repository, which is listed with the other numbers below.

SKILL.md

5.9 KB, as published. Nobody here has run it

Theme Factory Skill

a curated collection of professional font and color themes. Once a theme is chosen, it can be applied to any artifact.

Purpose

To apply consistent, professional styling to presentation slide decks or other artifacts. Each theme includes:

A cohesive color palette with hex codes
Complementary font pairings for headers and body text
A distinct visual identity suitable for different contexts and audiences

Usage Instructions

To apply styling to a slide deck or other artifact:

Show available themes: Display the theme options to allow users to see all available themes
Ask for their choice: Ask which theme to apply
Wait for selection: Get explicit confirmation about the chosen theme
Apply the theme: Apply the selected theme's colors and fonts

Themes Available

The following 10 themes are available:

1. Ocean Depths

Professional and calming maritime theme

Primary: #1a365d (deep blue)
Secondary: #2c5282
Accent: #63b3ed
Background: #ebf8ff
Heading Font: Playfair Display
Body Font: Source Sans Pro

2. Sunset Boulevard

Warm and vibrant sunset colors

Primary: #c05621 (burnt orange)
Secondary: #dd6b20
Accent: #ed8936
Background: #fffaf0
Heading Font: Poppins
Body Font: Open Sans

3. Forest Canopy

Natural and grounded earth tones

Primary: #276749 (forest green)
Secondary: #38a169
Accent: #9ae6b4
Background: #f0fff4
Heading Font: Merriweather
Body Font: Lato

4. Modern Minimalist

Clean and contemporary grayscale

Primary: #1a202c (charcoal)
Secondary: #4a5568
Accent: #718096
Background: #f7fafc
Heading Font: Inter
Body Font: Inter

5. Golden Hour

Rich and warm autumnal palette

Primary: #744210 (golden brown)
Secondary: #b7791f
Accent: #ecc94b
Background: #fffff0
Heading Font: Cormorant Garamond
Body Font: Work Sans

6. Arctic Frost

Cool and crisp winter-inspired theme

Primary: #2b6cb0 (ice blue)
Secondary: #4299e1
Accent: #90cdf4
Background: #ebf8ff
Heading Font: Montserrat
Body Font: Nunito

7. Desert Rose

Soft and sophisticated dusty tones

Primary: #97266d (dusty rose)
Secondary: #d53f8c
Accent: #ed64a6
Background: #fff5f7
Heading Font: DM Serif Display
Body Font: DM Sans

8. Tech Innovation

Bold and modern tech aesthetic

Primary: #2d3748 (slate)
Secondary: #4c51bf
Accent: #667eea
Background: #edf2f7
Heading Font: JetBrains Mono
Body Font: IBM Plex Sans

9. Botanical Garden

Fresh and organic garden colors

Primary: #285e61 (teal)
Secondary: #319795
Accent: #81e6d9
Background: #e6fffa
Heading Font: Libre Baskerville
Body Font: Karla

10. Midnight Galaxy

Dramatic and cosmic deep tones

Primary: #1a1a2e (midnight)
Secondary: #16213e
Accent: #e94560
Background: #0f0f23
Text: #edf2f7
Heading Font: Orbitron
Body Font: Rajdhani

11. Tsumagoi Ranch

Neo-Brutalist "Cute-alism" - Japanese ranch/campground aesthetic

Primary: #0c85f4 (mountain blue)
Secondary: #10b981 (pine green)
Accent: #ff6b35 (campfire orange)
Accent Alt: #FF6D38 (navigate orange - CTAs)
Premium: #8584FF (navigate purple)
Background Light: #faf7f2 (warm cream)
Background Dark: #0c1424 (night sky)
Border: #b8a080 (wood/sand tone)
Text: #1a1a1a (near black)
Heading Font: M PLUS Rounded 1c
Body Font: Inter
Body JP: Noto Sans JP
Mono: JetBrains Mono

Neo-Brutal Shadows: Hard-edge 3px 3px 0 0 #b8a080 (no blur) Border Style: 3px solid with rounded-xl corners Motion: Bounce easing cubic-bezier(0.34, 1.56, 0.64, 1)

See themes/tsumagoi-ranch.md for full specification including mobile patterns.

Application Process

After a preferred theme is selected:

Read the corresponding theme specifications
Apply the specified colors and fonts consistently throughout
Ensure proper contrast and readability
Maintain the theme's visual identity across all elements

Create Your Own Theme

To handle cases where none of the existing themes work, create a custom theme based on:

User's brand colors
Specific aesthetic direction
Industry or context requirements

Generate a new theme with:

5 color palette (primary, secondary, accent, background, text)
Font pairing (heading + body)
A descriptive name

After generating, show it for review before applying.

CRITICAL: Check Existing First

Before applying ANY theme, verify:

Check for existing theme/design system:

cat tailwind.config.* 2>/dev/null | grep -A30 "colors\|fontFamily"
cat src/styles/globals.css docs/THEME_GUIDE.md 2>/dev/null

Check for existing CSS variables:

rg "var\(--" --type css --type tsx | head -20

Check for existing brand colors:

Look in public/ for logos
Check existing components for color patterns

Why: Themes must integrate with existing design systems, not override them arbitrarily.

Validation

After applying a theme:

Visual consistency → All components use theme colors
Contrast check → Text readable on backgrounds (4.5:1 min)
Font loading → Google Fonts load correctly
Dark mode → If applicable, verify dark variant works
Mobile check → Typography scales appropriately
Print preview → If printable, colors work in print