Multi Brand Theming
Generate custom brand palettes from hex colors using UDS tokens
What You Can Do
Convert your brand colors (hex input) into complete, WCAG-compliant palettes that integrate seamlessly with the Universal Design System token architecture. Manage multiple brands or products with distinct visual identities while maintaining shared component libraries and consistent design foundations. Switch between themes at runtime and create dark mode variants automatically.
Features
input your brand colors and generate primary, secondary, accent, neutral, and status color palettes automatically
create distinct visual identities for multiple products using a single shared component library
custom palettes map directly to the Universal Design System token model with locked foundation layers
auto-generate dark theme tokens from light brand colors while maintaining WCAG contrast compliance
apply palettes dynamically via `data-theme` attribute without component code changes
customize individual token values (colors, shadows, border-radius, display fonts) per brand while inheriting shared foundations
maintain separate `tokens/design-tokens.json` files for each brand within a single design system
ensure accessibility compliance across all generated palette colors and contrast ratios
Example Output
Example 1: Brand Color Input
Brand colors: Primary #0052FF, Secondary #FF6B35, Accent #00D4AA
Generated Palette Output:
{
"theme": {
"myBrand": {
"color-primary": "#0052FF",
"color-primary-hover": "#0041CC",
"color-secondary": "#FF6B35",
"color-accent": "#00D4AA",
"color-text-default": "#1A1A1A",
"color-bg-default": "#FFFFFF",
"color-status-success": "#00AA44"
},
"myBrand-dark": {
"color-primary": "#4D9FFF",
"color-text-default": "#F5F5F5"
}
}
}
Example 2: Multi-Brand Setup Apply different themes to different product surfaces:
<!-- Product A -->
<main data-theme="brand-a">...</main>
<!-- Product B -->
<aside data-theme="brand-b">...</aside>
Both use identical component code; only token values change.
What's Included
- SKILL.md: multi-brand theming instruction file with UDS token architecture reference
- Palette generator template: hex color input → full palette JSON structure
- Token override checklist: which foundation layers stay locked vs which palette tokens vary by brand
- Multi-brand implementation guide: organize separate `design-tokens.json` files per brand
- Dark mode variant workflow: auto-generate dark palettes with WCAG compliance verification
Who It's For
- Brand managers — manage multiple brand identities and visual guidelines across product lines
- Design system owners — implement white-label and multi-tenant theming at scale
- Product leads — launch co-branded or white-label products with shared component libraries
- Marketing ops teams — customize UI for different market segments or customer tiers
- Enterprise UX teams — maintain brand consistency across distributed product portfolios
Best For
- Creating white-label or multi-tenant SaaS products with brand-specific UI
- Implementing dark mode variants alongside light brand themes
- Building enterprise design systems that support multiple owned brands
- Converting brand guidelines (hex colors, fonts) into token-driven palettes
- Managing runtime theme switching without component code duplication
You might also like
Design comprehensive brand identity systems from scratch, including logos in 55+ styles, corporate identity programs with 50+ deliverables, design tokens and UI styling frameworks, professional banners in 22+ styles, custom SVG icons, and optimized social media assets across 8+ platforms. Claude generates production-ready files with mockups, specifications, and platform-specific formatting for immediate use.
You can rapidly map talent ecosystems across industries, organizations, and skill domains. Claude analyzes relationships between talent, roles, expertise areas, and organizational structures to create comprehensive ecosystem visualizations. Get strategic insights into talent concentration, skill gaps, and competitive positioning through data-driven mapping.
by imbue-ai
This skill synthesizes candidate background data into comprehensive risk assessments and placement success predictions for executive-level roles. You submit candidate profiles, career history, and organizational context, and receive structured risk scores, red flag analysis, and data-driven placement recommendations tailored to C-suite and director-level recruitment.
by imbue-ai
Articulate what makes your organization unique as an employer. This skill guides you through competitive research, cultural analysis, and messaging refinement to build an Employer Value Proposition that resonates with top talent and differentiates your company in the talent market. You'll uncover your authentic competitive advantages, test messaging against your target talent profiles, and create a validation roadmap to ensure your EVP actually drives recruitment and retention outcomes.
by imbue-ai
Evaluate your recruitment pipeline with advanced metrics analysis and diagnostic tools. Get actionable insights into time-to-hire, conversion rates, cost-per-hire, and candidate quality scores. Identify bottlenecks, forecast hiring timelines, and optimize your talent acquisition strategy with data-driven recommendations.
by imbue-ai
You can quickly build comprehensive executive candidate profiles that include background analysis, competency assessment, and cultural fit evaluation. You'll gain market intelligence on competitive talent landscapes, compensation benchmarking, and recruitment timing. You'll develop targeted recruitment strategies based on skill gaps, succession planning needs, and organizational priorities.
by imbue-ai
You can extract and structure technical requirements from job descriptions, RFPs, or project briefs, then systematically evaluate candidates against those criteria. This skill generates detailed scoring matrices, identifies skill gaps, highlights candidate strengths, and produces hiring recommendations with clear reasoning for better decision-making.
by imbue-ai
Analyze your job descriptions for language that may exclude underrepresented candidates, identify diverse talent pools across multiple sourcing channels, and build actionable equity-focused sourcing strategies. You'll audit hiring processes for bias, create targeted outreach plans, and establish metrics to measure progress toward meaningful diversity goals.
by imbue-ai