Theming
Themes ermöglichen die visuelle Anpassung an verschiedene Marken.
Theme-Struktur
Section titled “Theme-Struktur”Was pro Theme definiert wird:
- Farbpalette (Primär, Sekundär, Akzent)
- Typografie (Schriftarten)
- Radien (Border-Radius)
- Schatten
In Figma umsetzen
Section titled “In Figma umsetzen”1. Color Styles austauschen
Section titled “1. Color Styles austauschen”- Alle Color Styles überschreiben
- Namen bleiben gleich, Werte ändern
2. Text Styles anpassen
Section titled “2. Text Styles anpassen”- Schriftarten tauschen
- Größen-Skala bleibt
3. Component-Tests
Section titled “3. Component-Tests”- Alle Komponenten in neuem Theme prüfen
- Dark Mode ebenfalls testen
Brand-Integration
Section titled “Brand-Integration”Prozess:
- Brand Guidelines erhalten
- Farben in Color Styles übersetzen
- Fonts anpassen
- Komponenten testen
- Handoff an Entwickler*innen
Dark Mode
Section titled “Dark Mode”- Jedes Theme braucht Dark Mode
- Gleiche Struktur, andere Werte
- In Figma als Variant testen
Themes machen Celestia zu einem flexiblen White-Label System.