Medium
krämvit tidningstidning vid gyllene timmen
Medium fungerar som ett litterärt läsrum omplanterat till webben: en varm, krämig bakgrund (#f7f4ed) ersätter det sterila vita som är typiskt för SaaS, vilket gör att långa texter känns som en tryckt sida. Det visuella systemet är aggressivt monokromt – nästan alla UI-ytor, text och ramar är i ett smalt band av varma gråtoner som sträcker sig från #242424 till #6b6b6b – så läsarens uppmärksamhet är helt fokuserad på innehållet. Den enda signaturgesten är serif-rubriken (GT Super, 120px, vikt 400, bokstavsavstånd -0.055em), ett medvetet anti-trend-val: ett övergångsliknande bok-serif-teckensnitt skalat för visning, knappt märkbart snarare än ett djärvt geometriskt sans-serif, signalerar: "Vi publicerar böcker, inte programvara." Knapparna är fulla "piller" av nästan svart färg – det enda solida bläcket på sidan.
Hemsidan har två kolumner: vänster sida tar upp ~55 % av sidans utrymme, med rubrik, undertext och uppmaning till handling arrangerade vertikalt med generöst internt avstånd; höger sida tar upp ~45 % av sidans utrymme, med en illustrationspanel. Den vänstra kolumnen är vänsterjusterad (inte centrerad), vilket förankrar sidan till läsaxeln. Under hemsidan finns sidan en enda, fullbred, krämfärgad remsa med centrerade länkar i sidfoten. Inga kortrutnät, funktionsavsnitt eller alternerande ränder på hemsidan – hemsidan ÄR en sida. Innehållstätheten är avsiktligt låg: en rubrik, en mening, en knapp, en bild. Sidan är ett omslag, inte en instrumentpanel.
Illustrationerna är redaktionella och episodiska, inte systematiska. Huvudsidan har en enda handritad illustration (en grön blomma, en geometrisk hand, konstellationslinjer) i en lös, något naiv stil. Illustrationerna ser ut som beställningsverk som ändras säsongsvis, snarare än från ett permanent bibliotek. Det finns inga fotografier på huvudsidan. Det finns inga ikoner på huvudsidan – allt arbete utförs av textlogotypen och texten. Det visuella språket är främst textorienterat, med illustrationerna som interpunktion.
Palett
Neutral
- Newsprint Cream
#f7f4ed— Sidans arbetsyta, huvudfönstrets bakgrund och sektionsbakgrunden har en varm, lätt krämig nyans som skapar känslan av ett tryckt gränssnitt snarare än ett digitalt. - Paper White
#ffffff— Kortytor, upphöjda paneler, formulärinmatningsfält och alla ytor som behöver separeras från den krämfärgade arbetsytan. - Ink
#242424— Brödtext, brödtext, länkar, rubriker - något varmare än rent svart, ser bra ut mot en krämfärgad bakgrund. - Body Gray
#333333— Den sekundära textfärgen och standardförgrundsfärgen används där en färg något ljusare än bläckfärgen krävs utan att kontrasten förloras. - Button Black
#191919— En neutral färg stöds för sekundära UI-element, avdelare och dämpade etiketter. Den bör inte användas som primärfärg för uppmaningar till handling. - Marginalia Gray
#6b6b6b— Stöd för neutrala färger för sekundärt användargränssnitt, avdelare och dämpade etiketter.
Typografi
från 13 till 120px · 5 steg
- medium-content-sans-serif-font — ersättning: Inter · konturer 400 · teckensnittet medium-content-sans-serif – finns i den extraherade datan men beskrivs inte av AI:n.
- GT Super — ersättning: Playfair Display · konturer 400 · Rubrikerna och brödtexten är ett övergångsliknande bokliknande typsnitt i extrem skala med snävt bokstavsavstånd och ett radavstånd på 0,83. Valet av en vikt på 400 pixlar (inte fetstil) vid 120 pixlar är ett signaturdrag: bokstavsformerna, inte vikten, gör jobbet. Det negativa bokstavsavståndet minskar de optiska luckorna, vilket gör att "Human Stories and Ideas" känns som ett sammanhängande typografiskt block.
- Söhne — ersättning: Inter · konturer 400 · UI-typsnittet sans-serif används för navigering, knappar, underrubriker och små titlar. Intervallet 13–14px är för navigeringsetiketter och knappar; 20–22px är för underrubriker och sekundärtext i titeln. Ett rent sans-serif med humanistiska proportioner är läsbart i små storlekar och diskret i större.
Intervaller och form
| Ändamål | Menande |
|---|---|
| Densitet | genomsnitt |
| Grundläggande steg | 16-24px |
| Knappradie | 9999px |
| Kortradie | 0px |
| Skuggor | inga gränser istället för skuggor |
| Mellan sektioner | 64px |
| Sidbredd | 1200px |
AI kommer att bygga din webbplats i Medium -stil och fylla den
- Fyll på med produkter och inlägg via länken - Instagram, TikTok, Facebook.
- Överför innehåll från din gamla webbplats – ange bara adressen.
- Modern design på den bästa sökmotorn: React ( Next.js) med serverrendering och SEO-optimering direkt ur lådan.
- Helautomatisk SEO-optimering för sökresultat och rekommendationer för neurala nätverk.
Liknande stilar
- Steep — Analys av serif-teckensnitt på varmt papper
- Newformcap — Redaktionell tidning i omklädningsrummet
- Claude — En artefakt tryckt på varmt pergament – bläck på benpapper, lera som enda färgfläkt
- 11x– Digital workers — En filmisk redaktionell ödemark – panoramafotografier av landskapet mot monumentala serifrubriker som läser som ett uppslag i ett lyxigt tidskriftsblad
- Revolut — Ett monokromt redaktionellt verk baserat på ett fotografi av moln – vitt bläck, knappar på pilleraskar, en enda blå färgstrimma i en annars gråskalig värld.
- Scheduling — Redaktionell bläck på krämfärgat papper
- Titan — varmtonat monokromt arkiv
- Programa — En schweizisk designstudio mitt på dagen. Den vita tavelväggen är upplyst av en enda gul bordslampa – allt går i grå nyanser tills en knapp, ikon eller accent fångar ögat, och sedan definierar den enda gula accenten hela rummet.
- Sana Agents — Lime glitter på vit bakgrund i ledare
- Visual — Varm redaktionell samizdat. Krämfärgat papper, serif-affischer, monokrom marginalia, en gul tuschpenna.
- Midday — Redaktionell broschyr på vellum - 72px serif-rubrik mot varm stenbakgrund, sans-serif-text med mellanrum, pillerformade kontroller, inga skuggor
- Chat for impact — En skogsgrön klinik med pastellfärgade rum