Multiple Themes Strategy

Balancing product and marketing needs with a single design system through effective theming

Core Insight: Use one design system with contextual theming for product and marketing needs

When to Apply

Multi-product planning → Supporting diverse product requirements
Brand consistency initiatives → Maintaining unified brand across contexts
Design system scaling → Expanding to serve different use cases

Why This Works

✓ Unified foundation - Alex (Nord): "Maintain unified foundation while serving different business needs"
✓ Reduced duplication - Shared tokens and components prevent divergent systems
✓ Contextual optimization - Dense layouts for dashboards, spacious for marketing
✓ Simplified maintenance - One system to update when brand evolves

Alternative Approaches

Separate design systems - Clear boundaries → Duplicate work, brand inconsistency
One-size-fits-all - Simple to maintain → Compromises don't serve any use case well
Component variations only - Flexible components → Complex APIs, harder to use correctly

Quick Example

/* Global foundation */
--color-primary: #0066cc;
--font-family: "Inter", sans-serif;

/* Product theme - dense */
--spacing-component: 8px;
--font-size-body: 14px;

/* Marketing theme - spacious */
--spacing-component: 16px;
--font-size-body: 16px;

Props vs. Slots - Component APIs that support theming
Component Tagging Strategies - Tracking themed component usage

Sources: Nord Design System Session • February 2025

Multiple Themes Strategy - Infa