Medium
xornal branco cremoso na hora dourada
Medium funciona como unha sala de lectura literaria transplantada á web: un fondo cálido e cremoso (#f7f4ed) substitúe o branco estéril típico dos SaaS, facendo que os textos longos parezan unha páxina impresa. O sistema visual é agresivamente monocromático (case todas as superficies da interface de usuario, o texto e os bordos están nunha estreita banda de grises cálidos que van do #242424 ao #6b6b6b), polo que a atención do lector está completamente centrada no contido. O único xesto característico é o título con serifas (GT Super, 120 px, peso 400, espazado entre letras -0,055 em), unha elección deliberada antitendencia: unha fonte con serifas de libro de transición escalada para a visualización, apenas perceptible en lugar dunha sans-serif xeométrica en negriña, sinala: "Publicamos libros, non software". Os botóns son "pílulas" cheas de cor case negra, a única tinta sólida da páxina.
A páxina de inicio ten dúas columnas: a esquerda ocupa aproximadamente o 55 % do espazo da páxina, co título, o subtexto e a chamada á acción dispostos verticalmente cun espazo interno xeneroso; a dereita ocupa aproximadamente o 45 % do espazo da páxina, cun panel de ilustracións. A columna esquerda está aliñada á esquerda (non centrada), ancorando a páxina ao eixe de lectura. Debaixo da páxina de inicio, a páxina é unha única franxa de cor crema de ancho completo con ligazóns centradas no pé de páxina. Non hai grellas de tarxetas, seccións de funcións nin franxas alternas na páxina de inicio: a páxina de inicio É unha páxina. A densidade de contido é intencionadamente baixa: un título, unha frase, un botón, unha imaxe. A páxina é unha portada, non un panel.
As ilustracións son editoriais e episódicas, non sistemáticas. A páxina principal presenta unha única ilustración debuxada a man (unha flor verde, unha man xeométrica, liñas de constelación) nun estilo solto e lixeiramente inxenuo. As ilustracións parecen obras por encargo que cambian estacionalmente, en lugar de pertencer a unha biblioteca permanente. Non hai fotografías na páxina principal. Non hai iconas na páxina principal: todo o traballo lévano a cabo o logotipo de texto e o texto. A linguaxe visual está principalmente orientada ao texto, e as ilustracións serven como signos de puntuación.
Paleta
Neutro
- Newsprint Cream
#f7f4ed— O lenzo da páxina, o fondo da xanela principal e o fondo da sección son dun ton cálido e lixeiramente cremoso que crea a sensación dunha interface impresa en lugar dunha dixital. - Paper White
#ffffff— Superficies de tarxetas, paneis en relevo, campos de entrada de formularios e calquera superficie que precise separarse do lenzo cor crema. - Ink
#242424— Corpo de texto, corpo de texto, ligazóns, títulos: lixeiramente máis cálidos que o negro puro, quedan ben sobre un fondo crema. - Body Gray
#333333— A cor de texto secundaria e a cor de primeiro plano predeterminada úsanse cando se require unha cor lixeiramente máis clara que a cor da tinta sen perder contraste. - Button Black
#191919— Admítese unha cor neutra para elementos secundarios da interface de usuario, divisores e etiquetas silenciadas. Non se debe usar como cor principal para chamadas á acción. - Marginalia Gray
#6b6b6b— Compatibilidade con cores neutras para a interface de usuario secundaria, divisores e etiquetas silenciadas.
Tipografía
de 13 a 120 px · 5 pasos
- medium-content-sans-serif-font — substitución: Inter · contornos 400 · tipo de letra medium-content-sans-serif: atopada nos datos extraídos pero non descrita pola IA.
- GT Super — substitución: Playfair Display · contornos 400 · As cabeceiras e o corpo do texto están feitos cunha fonte serif de transición de libro a unha escala extrema, con espazado axustado entre letras e un espazado entre liñas de 0,83. A elección dun grosor de 400 (non en negra) a 120 px é unha característica distintiva: son as formas das letras, non o grosor, as que fan o traballo. O espazado negativo entre letras reduce os ocos ópticos, facendo que "Historias e ideas humanas" pareza un bloque tipográfico cohesivo.
- Söhne — substitución: Inter · contornos 400 · A fonte sans-serif UI úsase para a navegación, os botóns, os subtítulos e os títulos pequenos. O rango de 13 a 14 px é para as etiquetas e os botóns de navegación; de 20 a 22 px é para os subtítulos e o texto secundario dentro do título. Unha fonte sans-serif limpa con proporcións humanísticas é lexible en tamaños pequenos e discreta en tamaños grandes.
Intervalos e forma
| Propósito | Significado |
|---|---|
| Densidade | media |
| Paso básico | 16-24px |
| Radio do botón | 9999px |
| Radio da tarxeta | 0px |
| Sombras | sen bordos en vez de sombras |
| Entre seccións | 64px |
| Largura da páxina | 1200px |
A IA creará o teu sitio web ao estilo de Medium e o encherá
- Enche con produtos e publicacións a través da ligazón: Instagram, TikTok, Facebook.
- Transfire contido do teu sitio antigo: só tes que especificar o enderezo.
- Deseño moderno no mellor motor: React ( Next.js) con renderización de servidor e optimización SEO listas para usar.
- Optimización SEO totalmente automatizada para resultados de busca e recomendacións de redes neuronais.
Estilos semellantes
- Steep — Análise de fontes serif en papel quente
- Newformcap — Editorial do xornal no vestiario
- Claude — Un artefacto impreso en pergamiño cálido: tinta sobre papel de óso, arxila como único alento de cor
- 11x– Digital workers — Un ermo editorial cinematográfico: fotografías panorámicas da paisaxe contra titulares monumentais con serifas que se len como a publicación dunha revista de luxo.
- Revolut — Un traballo editorial monocromo baseado nunha fotografía de nubes: tinta branca, botóns de caixa de pastillas, unha única franxa azul de cor nun mundo que doutro xeito sería en escala de grises.
- Scheduling — Tinta editorial sobre papel crema
- Titan — arquivo monocromático de tons cálidos
- Programa — Un estudo de deseño suízo ao mediodía. A parede branca da galería está iluminada por unha única lámpada de mesa amarela; todo está en tons grises ata que un botón, unha icona ou un detalle chama a atención, e entón ese único detalle amarelo define toda a habitación.
- Sana Agents — Brillo de lima sobre fondo branco no editorial
- Visual — Samizdat editorial cálido. Papel crema, pósteres serif, marxinal monocromático, un rotulador amarelo.
- Midday — Folleto editorial en pergamiño: título con serifas de 72 px sobre un fondo de pedra cálida, corpo de texto sans-serif con espazado, controis en forma de pílula, sen sombras
- Chat for impact — Unha clínica verde bosque con habitacións en cores pastel