Multiple Themes Strategy

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

Copy link

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

Copy link

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

Copy link

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

Copy link

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;

Copy link

Related Insights

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

Sources: Nord Design System Session • February 2025