Das Designsystem hinter Digital Dunia
Logo, Farben, Typografie und Komponenten – die visuelle Grundlage des Markenauftritts, an einem Ort. Konsistent über jede Seite.
Logo
Die Marke besteht aus dem Globus-Netzwerk-Symbol und der Didone-Wortmarke. Auf dunklem Grund die helle Version, auf hellem Grund die dunkle. Mindestbreite im Web: 140px. Schutzraum mindestens 50 % der Globushöhe.
Symbol · Favicon Ausreichend Schutzraum, volle Farbkontraste, unverzerrt skaliert.
Nicht verzerren, einfärben, drehen oder auf unruhigen Hintergründen platzieren.
Farben
Teal ist die dominante Primärfarbe, Gold der Akzent – niemals als Flächenfüllung, nur für Text, Buttons, Linien und das Logo. Cyan sparsam für Datenelemente und Hover.
Typografie
Drei Schriften mit klaren Rollen: Playfair Display für Display & Überschriften, Plus Jakarta Sans für Fließtext & UI, JetBrains Mono für Kennzahlen und Labels.
Strategie, SEO-Texte und Beratung aus einer Hand — persönlich, datengetrieben und ohne Agentur-Overhead. Fließtext steht in 16–18px mit einer Zeilenhöhe von 1,7.
Komponenten
Die Bausteine, aus denen jede Seite zusammengesetzt ist – mit konsistenten Radien, Schatten und Hover-Zuständen.
SEO-Texte schreiben lassen
Handgeschrieben, ranken für Ihre Keywords, halten Leser.
CSS-Tokens
Die Custom Properties dieses Projekts liegen in src/styles/tokens.css.
:root{
/* Marke */
--teal:#097070; --gold:#C8A24E; --cyan:#0ABAB5;
--dark:#0F172A; --darker:#080D19; --light:#F8F6F3;
/* Neutral */
--card:#FFFFFF; --card-dark:#1E293B; --border:#E2E8F0;
--slate-400:#94A3B8; --slate-600:#475569; --slate-700:#334155;
/* Funktional */
--red:#EF4444; --green:#10B981;
/* Radien */
--r-sm:8px; --r-md:12px; --r-lg:16px; --r-pill:100px;
/* Schrift */
--font-display:"Playfair Display",serif;
--font-sans:"Plus Jakarta Sans",sans-serif;
--font-mono:"JetBrains Mono",monospace;
}