What is a multi-site theme hierarchy?

It is a cascading structure where branding settings flow from a Base Theme to a Brand Theme, then to a Site Theme, and finally to User Preferences, allowing for efficient overrides at every level.

How does this skill handle dark mode?

The skill includes logic for resolving variant themes and automatically generating the necessary CSS media queries or data-attribute selectors to toggle between light and dark modes.

Can I use this for white-label SaaS applications?

Yes, it is specifically designed for white-labeling by providing a tenant-aware theme resolution service that handles unique assets like logos and brand colors for each client.

What technologies are supported by these patterns?

While the provided examples use C# for backend logic and CSS variables for the frontend, the architectural patterns are applicable to any modern web stack including React, Vue, Node.js, and various headless CMS platforms.

Multi-Site Theming Engine

Name: Multi-Site Theming Engine
Author: melodic-software

bymelodic-software

•

コンテンツ管理

Implements scalable branding and white-labeling systems for multi-site and tenant-aware CMS architectures.

概要

This skill provides comprehensive guidance and implementation patterns for building sophisticated multi-site theming systems. It enables developers to manage complex branding hierarchies—from base themes to tenant-specific overrides—using CSS variable hierarchies and dynamic theme resolution services. It is particularly useful for building white-label SaaS platforms, enterprise CMS solutions, and applications requiring runtime theme switching and accessibility-aware customizations through standardized token models.

主な機能

Hierarchical theme inheritance from base to site-specific levels
Built-in support for dark/light modes and accessibility overrides
12 GitHub stars
Dynamic CSS variable generation for real-time theme switching
Tenant-specific branding and asset management (logos, favicons, fonts)
Standardized theme models and token structures for colors and typography

ユースケース

Building white-label SaaS platforms with per-tenant branding and logos
Implementing dynamic user-preference-based interface customizations
Managing multiple regional or sub-branded sites from a single enterprise CMS

概要

主な機能

Hierarchical theme inheritance from base to site-specific levels
Built-in support for dark/light modes and accessibility overrides
12 GitHub stars
Dynamic CSS variable generation for real-time theme switching
Tenant-specific branding and asset management (logos, favicons, fonts)
Standardized theme models and token structures for colors and typography

ユースケース

Building white-label SaaS platforms with per-tenant branding and logos
Implementing dynamic user-preference-based interface customizations
Managing multiple regional or sub-branded sites from a single enterprise CMS