Typografie

Heading trennt semantische Ebene und visuelle Größe: level rendert h1–h6, size steuert die Skala. Text bietet drei Größen und drei Töne aus den semantischen Tokens. Prose gestaltet Markdown-Inhalte ohne zusätzliche Typography-Abhängigkeit.

Überschriften-Skala

display bis h4: Manrope mit Gewicht 800, leicht negativem Tracking und ausbalancierten Zeilenumbrüchen.

display

Daten, die erzählen

h1

Monatsbericht November

h2

Umsatz nach Kanal

h3

Direkt und organisch

h4

Kleine Abschnitte

Ebene und Größe getrennt

level bestimmt das gerenderte Element, size nur das Aussehen. So bleibt die Dokumentstruktur korrekt, auch wenn eine Überschrift visuell klein oder groß erscheint.

Heading level 2, Größe h4

Semantisch h2, visuell h4

Heading level 3, Größe h2

Semantisch h3, visuell h2

Text

Drei Größen und drei Töne aus den semantischen Tokens: default für Haupttext, muted für Erklärungen, subtle für große, ruhige Schrift.

Großer Einstieg mit 18 px für Vorspänne und Lead-Absätze.

Standardtext mit 16 px. Er trägt den Großteil der Inhalte und bleibt bewusst ruhig.

Kleiner, gedämpfter Text für Hinweise und Hilfestellungen.

Subtiler Ton für große, ruhige Zwischenüberschriften.

Prose

Prose gestaltet Markdown-Inhalte ohne zusätzliche Typography-Abhängigkeit: Absätze, Listen, Links in accent-text, Inline-Code, Zitate und Tabellen.

Wie Auswertungen entstehen

Jede Kennzahl wird aus den Rohdaten berechnet und stündlich aktualisiert. Details stehen in der Token-Übersicht.

Umsatz je Kanal und Tag
Aktive Konten und Retention
Fehlerquote der Importe

Gute Dashboards beantworten eine Frage, nicht zwanzig gleichzeitig.

const report = await loadReport({ range: "30d" });

Inline-Code wie formatNumber() bleibt in der Mono-Schrift.

Kennzahl	Wert
Umsatz	42.000 €
Aktive Konten	1.234