Medium
cremeweiße Zeitung in der goldenen Stunde
Medium wirkt wie ein literarischer Lesesaal im Web: Ein warmer, cremiger Hintergrund (#f7f4ed) ersetzt das sterile Weiß, das typisch für SaaS ist, und lässt längere Texte wie eine gedruckte Seite wirken. Das visuelle System ist betont monochrom – fast alle Oberflächen, Texte und Rahmen sind in einem schmalen Band warmer Grautöne von #242424 bis #6b6b6b gehalten – sodass die Aufmerksamkeit des Lesers vollständig auf den Inhalt gelenkt wird. Das einzige charakteristische Merkmal ist die Serifenschrift (GT Super, 120px, Stärke 400, Buchstabenabstand -0,055em), eine bewusste Wahl gegen den Trend: Eine dezente, für die Anzeige optimierte Serifenschrift signalisiert – im Gegensatz zu einer fetten, geometrischen Sans-Serif-Schrift –: „Wir veröffentlichen Bücher, keine Software.“ Die Schaltflächen sind fast schwarz und bilden die einzigen einfarbigen Elemente auf der Seite.
Die Startseite ist zweispaltig: Die linke Spalte nimmt ca. 55 % der Seitenfläche ein und enthält Überschrift, Untertext und Handlungsaufforderung mit großzügigem Innenabstand. Die rechte Spalte umfasst ca. 45 % der Seitenfläche und enthält eine Bildleiste. Die linke Spalte ist linksbündig (nicht zentriert) und orientiert sich so an der Leserichtung. Unterhalb der Startseite befindet sich ein einzelner, cremefarbener Streifen in voller Breite mit zentrierten Links in der Fußzeile. Auf Kartenraster, Feature-Bereiche oder abwechselnde Streifen verzichtet die Startseite – sie ist eine eigenständige Seite. Die Inhaltsdichte ist bewusst gering: eine Überschrift, ein Satz, ein Button, ein Bild. Die Seite dient als Cover, nicht als Dashboard.
Die Illustrationen sind redaktionell und episodisch, nicht systematisch. Die Hauptseite zeigt eine einzelne handgezeichnete Illustration (eine grüne Blume, eine geometrische Hand, Sternenkonstellationen) in einem lockeren, leicht naiven Stil. Die Illustrationen wirken wie Auftragsarbeiten, die saisonal wechseln, und nicht wie aus einer permanenten Sammlung. Es gibt keine Fotos auf der Hauptseite. Es gibt keine Icons auf der Hauptseite – die gesamte Wirkung wird durch das Textlogo und den Text erzielt. Die Bildsprache ist primär textorientiert, wobei die Illustrationen als Satzzeichen dienen.
Palette
Neutral
- Newsprint Cream
#f7f4ed— Die Seitenfläche, der Hintergrund des Hauptfensters und der Abschnittshintergrund sind in einem warmen, leicht cremigen Farbton gehalten, der eher an eine gedruckte als an eine digitale Benutzeroberfläche erinnert. - Paper White
#ffffff— Kartenoberflächen, erhabene Paneele, Formulareingabefelder und alle Oberflächen, die vom cremefarbenen Stoff getrennt werden müssen. - Ink
#242424— Fließtext, Fließtext, Links, Überschriften – etwas wärmer als reines Schwarz, sieht auf cremefarbenem Hintergrund gut aus. - Body Gray
#333333— Die sekundäre Textfarbe und die Standard-Vordergrundfarbe werden verwendet, wenn eine etwas hellere Farbe als die Tintenfarbe benötigt wird, ohne dass der Kontrast darunter leidet. - Button Black
#191919— Für sekundäre UI-Elemente, Trennlinien und ausgeblendete Beschriftungen wird eine neutrale Farbe empfohlen. Sie sollte nicht als primäre Farbe für Handlungsaufforderungen verwendet werden. - Marginalia Gray
#6b6b6b— Unterstützung neutraler Farben für sekundäre Benutzeroberflächen, Trennlinien und gedämpfte Beschriftungen.
Typografie
von 13 auf 120 Pixel · 5 Schritte
- medium-content-sans-serif-font — Ersatz: Inter · Umrisse 400 · Schriftart medium-content-sans-serif - in den extrahierten Daten gefunden, aber von der KI nicht beschrieben.
- GT Super — Ersatz: Playfair Display · Umrisse 400 · Die Überschriften und der Fließtext sind in einer Übergangsschrift mit Serifen in extremer Größe, engem Buchstabenabstand und einem Zeilenabstand von 0,83 gesetzt. Die Wahl der Strichstärke 400 (nicht fett) bei 120px ist ein charakteristisches Merkmal: Die Buchstabenformen, nicht die Strichstärke, wirken. Der negative Buchstabenabstand verringert die optischen Lücken und lässt „Human Stories and Ideas“ wie einen typografisch geschlossenen Block erscheinen.
- Söhne — Ersatz: Inter · Umrisse 400 · Die serifenlose Schriftart UI wird für Navigation, Schaltflächen, Unterüberschriften und kurze Titel verwendet. Der Bereich von 13–14 Pixeln ist für Navigationsbeschriftungen und Schaltflächen vorgesehen; 20–22 Pixel für Unterüberschriften und sekundären Text innerhalb des Titels. Eine klare serifenlose Schriftart mit harmonischen Proportionen ist in kleinen Größen gut lesbar und in größeren unaufdringlich.
Intervalle und Form
| Zweck | Bedeutung |
|---|---|
| Dichte | Durchschnitt |
| Grundlegender Schritt | 16-24px |
| Radius der Schaltfläche | 9999px |
| Kartenradius | 0px |
| Schatten | Nein – Ränder statt Schatten |
| Zwischen den Abschnitten | 64px |
| Seitenbreite | 1200px |
KI erstellt Ihre Website im Medium -Stil und füllt sie aus.
- Teile deine Produkte und Beiträge über den Link – Instagram, TikTok, Facebook.
- Übertragen Sie Inhalte von Ihrer alten Website – geben Sie einfach die Adresse an.
- Modernes Design auf der besten Plattform: React ( Next.js) mit serverseitigem Rendering und SEO-Optimierung direkt nach der Installation.
- Vollautomatisierte SEO-Optimierung für Suchergebnisse und Empfehlungen durch neuronale Netze.
Ähnliche Stile
- Steep — Analyse von Serifenschriften auf warmem Papier
- Newformcap — Leitartikel der Zeitung in der Umkleidekabine
- Claude — Ein Artefakt, gedruckt auf warmem Pergament – Tinte auf Knochenpapier, Ton als einziger Farbtupfer.
- 11x– Digital workers — Eine filmische redaktionelle Ödnis – Panoramaaufnahmen der Landschaft vor dem Hintergrund monumentaler Serifenschriften, die sich wie eine Luxusmagazin-Doppelseite lesen.
- Revolut — Eine monochrome redaktionelle Arbeit, basierend auf einem Foto von Wolken – weiße Tinte, Pillbox-Knöpfe, ein einzelner blauer Farbstreifen in einer ansonsten grauen Welt.
- Scheduling — Tusche auf cremefarbenem Papier
- Titan — Archiv mit warmen Schwarzweißtönen
- Programa — Ein Schweizer Designstudio am Mittag. Die weiße Galeriewand wird von einer einzelnen gelben Tischlampe beleuchtet – alles ist in Grautönen gehalten, bis ein Knopf, ein Symbol oder ein Akzent ins Auge fällt, und dann prägt dieser einzelne gelbe Akzent den gesamten Raum.
- Sana Agents — Limettenglitzer auf weißem Hintergrund im redaktionellen Beitrag
- Visual — Warmer redaktioneller Samisdat. Cremefarbenes Papier, Serifenschrift-Plakate, monochrome Randbemerkungen, ein gelber Marker.
- Midday — Editorial-Broschüre auf Pergament – 72px Serifenschrift-Überschrift auf warmem Steinhintergrund, serifenloser Fließtext mit Zeilenabstand, pillenförmige Steuerelemente, keine Schatten
- Chat for impact — Eine waldgrüne Klinik mit pastellfarbenen Zimmern