Medium
diari blanc cremós a l'hora daurada
Medium funciona com una sala de lectura literària trasplantada a la web: un fons càlid i cremós (#f7f4ed) substitueix el blanc estèril típic del SaaS, fent que els textos llargs semblin una pàgina impresa. El sistema visual és agressivament monocrom (gairebé totes les superfícies de la interfície d'usuari, el text i les vores es troben en una estreta banda de grisos càlids que van del #242424 al #6b6b6b), de manera que l'atenció del lector està completament centrada en el contingut. L'únic gest característic és el títol serif (GT Super, 120px, pes 400, espaiat entre lletres -0.055em), una elecció deliberada antitendència: una font serif de llibre de transició escalada per a la visualització, gairebé imperceptible en lloc d'una sans-serif geomètrica en negreta, indica: "Publiquem llibres, no programari". Els botons són "píndoles" plenes de color gairebé negre, l'única tinta sòlida de la pàgina.
La pàgina d'inici té dues columnes: el costat esquerre ocupa aproximadament el 55% de l'espai de la pàgina, amb el títol, el subtext i la crida a l'acció disposats verticalment amb un espaiat intern generós; el costat dret ocupa aproximadament el 45% de l'espai de la pàgina, amb un panell d'il·lustracions. La columna esquerra està alineada a l'esquerra (no centrada), ancorant la pàgina a l'eix de lectura. Sota la pàgina d'inici, la pàgina és una única franja de color crema d'amplada completa amb enllaços centrats al peu de pàgina. No hi ha quadrícules de targetes, seccions de funcions ni franges alternes a la pàgina d'inici: la pàgina d'inici ÉS una pàgina. La densitat de contingut és intencionadament baixa: un títol, una frase, un botó, una imatge. La pàgina és una portada, no un tauler de control.
Les il·lustracions són editorials i episòdiques, no sistemàtiques. La pàgina principal presenta una única il·lustració dibuixada a mà (una flor verda, una mà geomètrica, línies de constel·lació) en un estil fluix i lleugerament ingenu. Les il·lustracions semblen obres per encàrrec que canvien estacionalment, en lloc de provenir d'una biblioteca permanent. No hi ha fotografies a la pàgina principal. No hi ha icones a la pàgina principal: tota la feina la fan el logotip de text i el text. El llenguatge visual està principalment orientat al text, i les il·lustracions serveixen com a signes de puntuació.
Paleta
Neutral
- Newsprint Cream
#f7f4ed— El llenç de la pàgina, el fons de la finestra principal i el fons de la secció són d'un to càlid i lleugerament cremós que crea la sensació d'una interfície impresa en lloc de digital. - Paper White
#ffffff— Superfícies de targetes, panells en relleu, camps d'entrada de formularis i qualsevol superfície que s'hagi de separar del llenç de color crema. - Ink
#242424— Text del cos, text del cos, enllaços, encapçalaments: lleugerament més càlid que el negre pur, queda bé sobre un fons crema. - Body Gray
#333333— El color de text secundari i el color de primer pla per defecte s'utilitzen quan es requereix un color lleugerament més clar que el color de la tinta sense perdre contrast. - Button Black
#191919— S'admet un color neutre per a elements secundaris de la interfície d'usuari, divisors i etiquetes apagades. No s'ha d'utilitzar com a color principal per a les crides a l'acció. - Marginalia Gray
#6b6b6b— Compatibilitat amb colors neutres per a la interfície d'usuari secundària, els divisors i les etiquetes apagades.
Tipografia
de 13 a 120px · 5 passos
- medium-content-sans-serif-font — reemplaçament: Inter · esquemes 400 · font medium-content-sans-serif: es troba a les dades extretes però no és descrita per la IA.
- GT Super — reemplaçament: Playfair Display · esquemes 400 · Els encapçalaments i el text del cos són una font serif de llibre de transició a una escala extrema amb un espaiat de lletra ajustat i un espaiat de línia de 0,83. L'elecció d'un gruix de 400 (no negreta) a 120 px és una característica distintiva: les formes de les lletres, no el gruix, fan la feina. L'espaiat negatiu de les lletres redueix els buits òptics, fent que "Històries i idees humanes" sembli un bloc tipogràfic cohesionat.
- Söhne — reemplaçament: Inter · esquemes 400 · La font sans-serif UI s'utilitza per a la navegació, els botons, els subtítols i els títols petits. El rang de 13–14 px és per a les etiquetes i els botons de navegació; 20–22 px és per als subtítols i el text secundari dins del títol. Una font sans-serif neta amb proporcions humanístiques és llegible en mides petites i discreta en mides més grans.
Intervals i forma
| Propòsit | Significat |
|---|---|
| Densitat | mitjana |
| Pas bàsic | 16-24px |
| Radi del botó | 9999px |
| Radi de la targeta | 0px |
| Ombres | sense vores en comptes d'ombres |
| Entre seccions | 64px |
| Amplada de la pàgina | 1200px |
La IA crearà el vostre lloc web a l'estil Medium i l'omplirà.
- Omple amb productes i publicacions a través de l'enllaç: Instagram, TikTok, Facebook.
- Transfereix contingut del teu lloc web antic; només cal que especifiquis l'adreça.
- Disseny modern en el millor motor: React ( Next.js) amb renderització de servidor i optimització SEO des del primer moment.
- Optimització SEO totalment automatitzada per a resultats de cerca i recomanacions de xarxes neuronals.
Estils similars
- Steep — Anàlisi de fonts serif sobre paper càlid
- Newformcap — Editorial del diari al vestidor
- Claude — Un artefacte imprès sobre pergamí càlid: tinta sobre paper d'os, argila com a únic alè de color
- 11x– Digital workers — Un erm editorial cinematogràfic: fotografies panoràmiques del paisatge contraposades a titulars monumentals amb serifes que semblen una publicació de revista de luxe.
- Revolut — Una obra editorial monocroma basada en una fotografia de núvols: tinta blanca, botons de pastillera, una única franja blava de color en un món que d'altra banda seria en escala de grisos.
- Scheduling — Tinta editorial sobre paper crema
- Titan — arxiu monocrom de tons càlids
- Programa — Un estudi de disseny suís al migdia. La paret blanca de la galeria està il·luminada per una única làmpada de taula groga; tot és en tons grisos fins que un botó, una icona o un detall crida l'atenció, i aleshores aquest únic detall groc defineix tota l'habitació.
- Sana Agents — Brillantor de llima sobre fons blanc a l'editorial
- Visual — Samizdat editorial càlid. Paper crema, pòsters serif, lletres marginals monocromes, un retolador groc.
- Midday — Fullet editorial sobre vitel·la: títol serif de 72 px sobre un fons de pedra càlida, cos de text sans-serif amb espaiat, controls en forma de píndola, sense ombres
- Chat for impact — Una clínica de color verd bosc amb habitacions de colors pastel