Brand-Kit · lebendes Token-System

Robin

Du bist nicht allein.

Robin — lern dich verstehen

Alle Werte stammen aus src/design/tokens.json (Single Source). Richtung A: das Marken-System erbt die Ghibli-Cel+-Dualität der Charakterarbeit — painterly Welt, cleaner Charakter, warmes Licht, eine Palette.

Farben

Palette

Marke

heart#D34F4F--heartSignatur / Marken-Rot (Herz, Claim 'Du bist nicht allein.')

heart-light#FF8A8A--heart-lighthelles Herz (Finale)

Flächen

cream#F6F1E7--creamSeiten-Hintergrund (warm)

paper#FDFBF6--paperKarten-/Panel-Fläche

warm#EAE2D3--surface-warmwarmer Karten-BG (Portrait-Cover)

Text

ink#2C3440--inkPrimärtext / dunkel

ink-soft#5A6474--ink-softSekundärtext

Akzente

gold#E3B34C--goldGold (Pulse/Akzent)

teal#5F7F78--tealTeal (Links/Meta)

rose#C98A7D--roseRose

sage#A8B89A--sageSage-Grün

dusty#7E93AC--dustygedämpftes Blaugrau

Dimensionen · Mind/Body/Soul

mind#C9D8EA--dim-mind

body#CFDCC4--dim-body

soul#E4D3EE--dim-soul

Charakter

eye#3D4E66--char-eyeLea Identität v3 — dunkelblauer Augen-Anker (kühler Grau-Stich)

Typografie

Fredoka · Nunito

Display — Fredoka --display

Du bist nicht allein.

500 · 600 · 700 — Headings, Buttons, Eyebrows

Body — Nunito --body

Robin hilft dir, selbst zu erkennen, was dir fehlt — warm und ehrlich, ohne dich zu drängen.

400 · 600 · 700 — Fließtext

--text-hero clamp(2.2rem,4.6vw,3.7rem)Robin

--text-h2 clamp(1.5rem,3vw,2.15rem)Robin

--text-lead clamp(1rem,1.4vw,1.16rem)Robin

--text-body 1remRobin

--text-small 0.9remRobin

Motion

Bewegung & Timing

Duolingos Handwerk ja, seine Logik (Streak-Zwang) nein. Live-Demos aus den echten Site-Keyframes.

🌱

breathe--dur-breathe · 5.2sRobin-Idle (Atem)

heartbeat--dur-heartbeat · 2.6sHerzschlag

Dauern

--dur-micro0.18sButton-Press/Hover

--dur-fast0.22sKarten-Hover

--dur-base0.25s

--dur-reveal0.65sScroll-Reveal (Karten faden ein)

--dur-slow0.8sAtmo-/Opacity-Fades

--dur-heartbeat2.6sHerzschlag-Loop

--dur-breathe5.2sRobin-Idle (Atem)

Easings

--ease-standardease

--ease-in-outease-in-out

--ease-outease-out

--ease-expocubic-bezier(.16,1,.3,1)

--ease-springcubic-bezier(.2,1.4,.4,1)

--ease-jump-outcubic-bezier(.45,0,.55,1)

--ease-jump-incubic-bezier(.4,0,.5,1)

Assets

Robin & Welt

Quelle bleibt die Asset-Bibliothek (docs/05-Design/asset-library/, character-ref 1903157, Identität v3). Hier das Schaufenster.

Verbal-Identität

Stimme

Warm und ehrlich zugleich

So„Das klingt anstrengend. Magst du erzählen, was los ist?"

So nicht„Oh, du Armer, wird schon!" · „Verstanden. Weiter."

Fragt, statt zu belehren

So„Was davon zieht dich am meisten runter?"

So nicht„Du müsstest einfach früher ins Bett."

Da, ohne zu drängen

So„Ich bin hier, wenn du reden willst. Kein Muss."

So nicht„Du warst 4 Tage weg! Deine Serie ist futsch."

Wertfrei, nie urteilend

So„Wie fühlt sich das für dich an?"

So nicht„Das war keine kluge Entscheidung."

Verständlich, nie fachchinesisch

SoAlltagssprache, klare Absicht, kein Jargon.

So nicht„Deine Gesamtverfassung zeigt eine Dysregulation der Soul-Dimension."

So klingt Robin NIE:CheerleaderDozentErsatzfreundDaten-Dashboard mit GesichtStreak-Wärter