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
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
You can conduct full market research studies—concept tests, pricing research, and purchase intent surveys—in minutes instead of weeks, without recruiting real respondent panels. Claude generates diverse synthetic survey responses based on your research questions, then applies Semantic Similarity Rating to validate directional accuracy against real-world behavior. This methodology, validated by PyMC Labs across 57 surveys, delivers statistically meaningful insights at near-zero cost.
by imbue-ai
Create compelling employer brand narratives and recruitment content that resonates with your target talent pool across social platforms. Generate cohesive content calendars aligned with your hiring needs, complete with platform-specific strategies that position your company as an employer of choice and drive qualified candidate engagement.
by imbue-ai
You can design end-to-end recruiting workflows tailored to your hiring process, configure complex ATS logic including approval gates and conditional routing, and troubleshoot workflow bottlenecks. Claude helps you map candidate journeys, implement automation rules, and align workflows with your team's hiring standards—whether you're scaling from startup to enterprise or optimizing existing systems.
by imbue-ai
You'll design customer interview frameworks that extract decision-relevant insights, synthesize survey responses and transcripts into actionable market understanding, and identify economically viable customer segments. This skill helps you distinguish between customer opinions, behavioral evidence, and revealed preferences—allowing you to produce opportunity assessments that quantify market size, customer needs, and competitive positioning with confidence.
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
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