TGV · Design-Kanon · Marken & Mandanten · Stand 2026-07-13

Grundfarben & Schriften je Mandant

Was pro Mandant/Marke die Farb- und Schrift-Welt bestimmt — wortgetreu aus dem Token-SSOT geerntet (tokens.css + foundation.css), mit ehrlichem Regel-Status. Zwei verschiedene Dinge, die nie vermischt werden: ① die MARKE (data-brand — färbt die ganze Oberfläche) und ② die ENTITÄTS-Farbe (kennzeichnet, WEM ein Datum gehört — Badge/Punkt, nie die Fläche).

Deine Frage „Es ist doch bereits eine Regel, oder?" — Antwort: JA, als Checklisten-Regeln, aber OHNE Prüfer-Gate: R-72 „Marke = data-brand, kein Komponenten-Unterschied" + R-71 Typo-Skala stehen im Regelwerk (📋 manuell), und der aaGate prüft Kontraste token-basiert — aber kein Harness-Check erzwingt heute „nur Token, keine hardcodierten Farben/Schriften im Screen". Das ist jetzt Regel-Kandidat JE-132 und geht an KANON#01 (Composer Gate E + assertConformance).

① Die Marken (data-brand) — Farbwelt der Oberfläche

Drei Override-Stufen, komponiert frei mit data-theme (hell/dunkel). Quelle: tokens.css Z.286–365. Gleiche Komponenten überall — nur Farb-Rollen wechseln (R-72); Stimme/Wortschatz je Marke = DESIGN#04.

TGV CORE (Default, ohne data-brand — startact-Blau auf kühlem Papier)
DIE Farbwelt der TGV-App: kühles Papier + startact-Blau als Akzent. Mandant jcbinetti, Shell, RKA/Cockpits. Vollständige Palette (tokens.css Z.28–92, „Kühl-Umstellung" — vorher warm):

Flächen-Kaskade (R-127: 4 Schichten, nie Grau-auf-Grau)

--bg-app (0) = p-paper
#f4f6f9
--bg-zone (1) = p-paper-3
#e2e7ef
--bg-card (2) = p-white
#ffffff
--bg-inset (3) = p-paper-2
#eceff4

Tinte & Linien

--text = p-ink
#1f2530
--text-muted
#5b626e
--text-hint (AA-Fix 04.07.)
#636a76
--border = p-line
#e1e4ea
--border-strong
#ccd1da

Akzent, Auswahl & Bedeutungs-Anker

--c-action (startact-Blau)
#185fa5
--c-action-bg
#e6f1fb
--selected-bg = p-gold-50
#fff7e0
--selected-bd = p-gold
#e3c200
--c-confirm ⚓
#3b6d11
--c-warn ⚓
#854f0b
--c-danger ⚓
#a32d2d
Dark-Werte definiert (Z.221–238): bg-app #14171b · bg-zone #171a1f · bg-card #1c2026 · bg-inset #242931 · text #e6e9ef-Familie · action p-blue-300 #7db4e3. ⚓ = White-Label-ANKER: confirm/warn/danger bleiben in JEDER Marke gleich (Bedeutungs-Farben) — nur Aktion/Flächen dürfen die Marke tragen.
gabriel (data-brand="gabriel" — VOLLE Flächen-Marke)
Warme Terracotta auf Crème — tiefe Override-Stufe: Akzent UND Flächen UND Linien UND Selektion. Mit eigener Crème-Kaskade für R-127 (nie Crème-auf-Crème).
--c-action
#9a4a28
--c-action-bg
#f6e7de
--bg-app
#faf5ec
--bg-zone
#efe4cf
--bg-card
#fffdf8
--bg-inset
#f2e9da
--selected-bg
#fbe7cf
--selected-bd
#d99a3a
Dark-Werte definiert (Z.330–346): bg #1d1813 · surface #262019 · action #e0a07a — Marke wirkt in BEIDEN Themes.
megabook (data-brand="megabook" — reine AKZENT-Marke)
Leichte Override-Stufe: NUR Akzent + Fokus lila, alle Flächen bleiben neutral. Das Muster für schnelle White-Label-Mandanten.
--c-action
p-purple-700
--c-action-bg
p-purple-50
--c-action-ink
p-purple-800

② Die Mandant-/Entitäts-Farben — wem gehört das Datum

8 feste Farb-Rollen (Rampe 50/700/800) für die Entitäts-Achse — sie erscheinen als Badge/Farb-Punkt am Objekt (JC-Entscheid 13.07.: G4-Form, volle Farbe), NIE als Flächen-Marke. Quelle: foundation.css .ds-axis--ent-* Z.325–333.

C3 C4 Privat gabriel kivisai anna lorenzo julien
⚠ Offene Punkte an dieser Tabelle (aus dem Badge-Dossier): C4 = teal (foundation/dein 08.07.-Kanon) vs. purple (tokens.css-G3) — W6, deine Wahl offen (teal empfohlen; purple bleibt kivisai) · --p-pink-* (anna) fehlt in tokens.css (foundation nutzt hartcodierte Fallbacks) → Token-Nachtrag KANON#01/DESIGN#01.

③ Schriften — der ehrliche Stand

WasDefiniert alsPro Mandant?
Schriftart--font-sans: system-ui, -apple-system, "Segoe UI", sans-serif (tokens.css Z.154) — EINE Schrift für alles; Mono nur für Code/IDs.NEIN. Es gibt heute KEINE per-Mandant-Schrift — kein data-brand-Block überschreibt --font-sans. Wenn du das willst, ist es ein neuer Entscheid (Register-Zeile + Token-Slot), kein vergessenes Feature.
Typo-Skala6 Größen (h1 22 · h2 18 · h3 16 · body 16 · small 13 · micro 11) · 3 Gewichte (400/500/600) — R-71; Chat-Haupttext TGV-weit EINE Größe.Gleich für alle Marken (bewusst — Ruhe/Stringenz). Dichte-Achse separat: data-mode essential/pro skaliert Typo/Spacing, keine Farben.

④ Weitergabe an den Prüfer der Screen-Bildung

Damit es nie wieder „nur Doku" ist, geht dieser Kanon an die DREI Prüf-Stellen (KANON#01-Übergabe, siehe JE-132):

Prüf-StelleWas sie prüfen sollStatus
Composer Gate E (Screen-Bau)Jeder neue Screen deklariert seine Marke NUR über data-brand; Farben/Schriften ausschließlich als var(--…)-Token — kein Hex, kein font-family im Screen-Markup.heute Playbook-Text (U-Regeln) — Kandidat
assertConformance (Harness)Neuer Check „Marken-Token-Treue": kein hardcodierter Farbwert/font-family außerhalb der Token-Dateien im gerenderten Screen; Bedeutungs-Anker (confirm/warn/danger) unverändert je Marke.existiert NICHT — Kandidat JE-132 (aaGate prüft nur Kontrast)
AGENT-UX#02-ChecklisteR-72 + R-71 abhaken mit Blick auf DIESE Seite (Soll-Werte nebenan statt Erinnerung).R-72/R-71 in Checkliste ✅ — Verweis hierher ergänzt
Quellen (geerntet, wortgetreu): tokens.css Z.286–365 (Marken-Blöcke light+dark) · Z.42–121 (Rollen/Rampen) · Z.154 (font) · Z.367ff (data-mode) · foundation.css Z.294–353 (Entitäts-Rampen) · V3-Darstellung: Paletten-Tab der Landkarte ↗. Regel-Anker: R-72 R-71 R-127. Pflege: Ändert sich ein Token-Block, zieht DIESE Seite nach (KONZEPT#01).