Markenreferenz

hybridathlete.guide

Alle folgenden Angaben werden design/tokens.json zur Erstellungszeit eingelesen. Diese Datei wird generiert aus src/styles/global.css. Sollte ein Wert hier falsch erscheinen, korrigiere das CSS und generiere die Datei neu: Bearbeite weder die JSON-Datei noch diese Seite.

Farbe

DTCG 2025.10-Objektform. Jeder Wert enthält colorSpace und components; der Hex-Wert dient nur der Übersichtlichkeit und ist nicht die maßgebliche Angabe.

bg #ffffff srgb(1, 1, 1) Page background.

ink #0c0c0a srgb(0.0471, 0.0471, 0.0392) Primary text and rules.

soft #f5f3ee srgb(0.9608, 0.9529, 0.9333) Recessed surface behind cards and sections.

muted #6b6b65 srgb(0.4196, 0.4196, 0.3961) Secondary text.

line #e3e1da srgb(0.8902, 0.8824, 0.8549) Hairline and border colour.

accent #047857 srgb(0.0157, 0.4706, 0.3412) Single brand accent. Links, CTAs, active state.

accent-soft #ecfdf5 srgb(0.9255, 0.9922, 0.9608) Tinted accent background.

Typografie

display Fraunces, serif Headlines and display type.

Hybrid athletes train both ends of the curve. 0123456789

body IBM Plex Sans, sans-serif Body copy and UI.

Hybrid athletes train both ends of the curve. 0123456789

Schaltflächen

Drei Ebenen, keine vierte. Wenn ein Steuerelement nicht in eine dieser Ebenen passt, ist die Hierarchie falsch, nicht die Schaltflächengruppe.

One per view. The single action you want taken.

Alternative paths. Never competes with primary.

Tertiary and destructive-adjacent. Text weight only.

Kopf- und Fußzeile

Beides sind aktive Komponenten, keine Screenshots: Die Kopfzeile oben auf dieser Seite und die Fußzeile unten sind die echten Nav.astro und Footer.astro durch das gemeinsame Layout gerendert. Ein Beispiel, das ein Bild einer Komponente ist, veraltet in dem Moment, in dem sich die Komponente ändert; daher gibt es kein solches Beispiel.