Medium
kremang puting pahayagan sa ginintuang oras
Ang medium ay gumagana tulad ng isang silid-basahang pampanitikan na inilipat sa web: isang mainit at kremang background (#f7f4ed) ang pumapalit sa baog na puting tipikal ng SaaS, na nagpaparamdam sa mahahabang teksto na parang isang naka-print na pahina. Ang visual system ay agresibong monochrome—halos lahat ng UI surface, teksto, at mga border ay nasa isang makitid na banda ng mainit na kulay abo mula #242424 hanggang #6b6b6b—kaya ang atensyon ng mambabasa ay ganap na nakatuon sa nilalaman. Ang tanging natatanging kilos ay ang serif headline (GT Super, 120px, weight 400, letter spacing -0.055em), isang sadyang anti-trend na pagpili: isang transitional book serif font na ini-scale para sa display, halos hindi mapapansin sa halip na isang bold geometric sans-serif, na hudyat: "Naglalathala kami ng mga libro, hindi software." Ang mga button ay puno ng "tabletas" na halos itim ang kulay - ang tanging solidong tinta sa pahina.
Ang homepage ay may dalawang kolum: ang kaliwang bahagi ay sumasakop sa halos 55% ng espasyo ng pahina, kung saan ang headline, subtext, at call to action ay nakaayos nang patayo na may malawak na panloob na espasyo; ang kanang bahagi ay sumasakop sa halos 45% ng espasyo ng pahina, na may panel ng ilustrasyon. Ang kaliwang kolum ay nakahanay sa kaliwa (hindi nakasentro), na nag-aangkla sa pahina sa reading axis. Sa ibaba ng homepage, ang pahina ay isang iisang, full-width, kulay kremang strip na may mga nakasentrong link sa footer. Walang mga card grid, feature section, o salit-salit na guhit sa homepage—ang homepage ay isang pahina. Ang densidad ng nilalaman ay sadyang mababa: isang headline, isang pangungusap, isang button, isang larawan. Ang pahina ay isang pabalat, hindi isang dashboard.
Ang mga ilustrasyon ay editoryal at episodiko, hindi sistematiko. Tampok sa pangunahing pahina ang isang ilustrasyong iginuhit ng kamay (isang berdeng bulaklak, isang heometrikong kamay, mga linya ng konstelasyon) sa isang maluwag at medyo inosenteng istilo. Ang mga ilustrasyon ay mukhang mga inatasang akda na nagbabago ayon sa panahon, sa halip na mula sa isang permanenteng aklatan. Walang mga litrato sa pangunahing pahina. Walang mga icon sa pangunahing pahina—lahat ng gawain ay ginagawa ng logo ng teksto at ng teksto. Ang biswal na wika ay pangunahing nakatuon sa teksto, kung saan ang mga ilustrasyon ay nagsisilbing bantas.
Paleta
Neutral
- Newsprint Cream
#f7f4ed— Ang page canvas, background ng pangunahing window, at background ng seksyon ay may mainit at bahagyang kremang kulay na lumilikha ng pakiramdam ng isang naka-print na interface sa halip na isang digital. - Paper White
#ffffff— Mga ibabaw ng baraha, mga nakataas na panel, mga patlang ng pagpasok ng anyo, at anumang mga ibabaw na kailangang ihiwalay mula sa kremang canvas. - Ink
#242424— Body text, body text, mga link, mga heading - bahagyang mas mainit kaysa sa purong itim, maganda ang hitsura sa isang kremang background. - Body Gray
#333333— Ang pangalawang kulay ng teksto at default na kulay ng harapan ay ginagamit kung saan kinakailangan ang isang kulay na bahagyang mas mapusyaw kaysa sa kulay ng tinta nang hindi nawawala ang contrast. - Button Black
#191919— Sinusuportahan ang neutral na kulay para sa mga pangalawang elemento ng UI, mga divider, at mga naka-mute na label. Hindi ito dapat gamitin bilang pangunahing kulay para sa mga panawagan para sa aksyon. - Marginalia Gray
#6b6b6b— Suporta sa neutral na kulay para sa pangalawang UI, mga divider, at mga naka-mute na label.
Tipograpiya
mula 13 hanggang 120px · 5 hakbang
- medium-content-sans-serif-font — kapalit: Inter · mga balangkas 400 · font na may katamtamang nilalaman at walang serif - matatagpuan sa nakuha na datos ngunit hindi inilarawan ng AI.
- GT Super — kapalit: Playfair Display · mga balangkas 400 · Ang mga heading at body text ay isang transitional book serif font sa matinding sukat na may masikip na pagitan ng mga letra at 0.83 na pagitan ng mga linya. Ang pagpili ng 400 weight (hindi bold) sa 120px ay isang natatanging katangian: ang mga anyo ng letra, hindi ang bigat, ang gumagawa ng trabaho. Ang negatibong pagitan ng mga letra ay nagpapakipot sa mga optical gaps, na ginagawang parang isang magkakaugnay na typographic block ang "Mga Kwento at Ideya ng Tao".
- Söhne — kapalit: Inter · mga balangkas 400 · Ang UI sans-serif font ay ginagamit para sa nabigasyon, mga buton, mga subheading, at maliliit na pamagat. Ang hanay na 13–14px ay para sa mga label at buton ng nabigasyon; 20–22px ay para sa mga subheading at pangalawang teksto sa loob ng pamagat. Ang isang malinis na sans-serif na may makataong proporsyon ay nababasa sa maliliit na sukat at hindi nakakaabala sa mas malalaking sukat.
Mga pagitan at anyo
| Layunin | Kahulugan |
|---|---|
| Densidad | karaniwan |
| Pangunahing hakbang | 16-24px |
| Radius ng buton | 9999px |
| Radius ng card | 0px |
| Mga anino | walang - mga hangganan sa halip na mga anino |
| Sa pagitan ng mga seksyon | 64px |
| Lapad ng pahina | 1200px |
Gagawa ang AI ng website mo sa estilong Medium at pupunuin ito
- Punuin ng mga produkto at post gamit ang link - Instagram, TikTok, Facebook.
- Maglipat ng nilalaman mula sa iyong lumang site—tukuyin lamang ang address.
- Modernong disenyo gamit ang pinakamahusay na engine: React ( Next.js) na may kasamang server rendering at SEO optimization na agad-agad.
- Ganap na awtomatikong pag-optimize ng SEO para sa mga resulta ng paghahanap at mga rekomendasyon sa neural network.
Mga katulad na estilo
- Steep — Pagsusuri ng mga Serif Font sa Mainit na Papel
- Newformcap — Pahayagang editoryal sa dressing room
- Claude — Isang artifact na nakalimbag sa mainit na pergamino—tinta sa papel na gawa sa buto, luwad bilang tanging hininga ng kulay
- 11x– Digital workers — Isang sinematikong editoryal na kaparangan—mga panoramic na litrato ng tanawin na nakadikit sa mga napakalaking serif na headline na parang isang luxury magazine na nakalagay
- Revolut — Isang monochrome na akdang editoryal batay sa isang litrato ng mga ulap—puting tinta, mga butones ng pillbox, isang asul na guhit ng kulay sa isang mundong kung hindi man ay kulay abo.
- Scheduling — Tinta ng editoryal sa kremang papel
- Titan — archive ng monochrome na may mainit na kulay
- Programa — Isang Swiss design studio sa tanghali. Ang puting gallery wall ay naiilawan ng isang dilaw na table lamp—lahat ay nasa kulay abo hanggang sa isang buton, icon, o accent ang pumukaw sa atensyon, at pagkatapos ay ang nag-iisang dilaw na accent na iyon ang magbibigay-kahulugan sa buong silid.
- Sana Agents — Kislap ng dayap sa puting background sa editoryal
- Visual — Mainit na editoryal na samizdat. Kremang papel, mga serif poster, monochrome marginalia, isang dilaw na marker.
- Midday — Brosyur na editoryal sa vellum - 72px serif na pamagat sa mainit na batong background, sans-serif na kopya ng katawan na may pagitan, mga kontrol na hugis-pill, walang mga anino
- Chat for impact — Isang klinika na luntian at may mga silid na kulay pastel