
Airbnb
Unha tranquila parede de galería branca cun único marcador de libros vermello coral
Airbnb funciona cun estilo de "lenzo branco", onde a fotografía reina de xeito supremo: case todas as pantallas son un marco monocromático silencioso, o que permite que as imaxes de pantalla completa das propiedades transmitan a impresión xeral, cun único e rico acento vermello coral (Rausch) como única pista de cor que denota acción. A tipografía é unha sans-serif xeométrica (Airbnb Cereal VF) —na súa maioría tamaños pequenos e seguros— para o texto do corpo, a interface e os títulos das seccións (22-22)—, cun espazado negativo axustado e un espazado xeneroso entre liñas, o que fai que as tarxetas con texto denso sexan lexibles. A interface é plana, sen marco e redondeada: radios de 12-3 nas tarxetas e nos controis, botóns redondos en forma de pílula e sombras suaves e en capas só para elementos destacados como a barra de busca. Todo o demais (tarxetas, elementos da lista, ligazóns) baséase no espazo en branco e nas liñas finas en lugar dos acentos cromados.
Un deseño de ancho completo sen límite de ancho máximo fixo (o contido esténdese de bordo a bordo dentro da área visible, con aproximadamente 40 px de recheo horizontal en cada lado no escritorio). A heroína é unha cápsula de busca flotante, centrada nun lenzo branco neutro sen imaxe nin título; a barra de busca É a heroína. Debaixo da busca, a páxina fai a transición en seccións apiladas verticalmente e de desprazamento horizontal (son visibles catro filas: Vivendas destacadas, Hoteis fantásticos, Outra cidade, Dispoñible o mes que vén), cada unha de aproximadamente 320 px de alto, separadas por barras verticais de 48 px. Cada sección usa unha grella de 7 cartas con desbordamento horizontal e navegación por frechas. O pé de páxina é unha grella de 3 columnas de ligazóns sobre un fondo #f7f7f7, seguida dunha barra inferior con información sobre dereitos de autor, opcións de idioma/moeda e iconas de redes sociais. A navegación é unha barra superior fixa con navegación por pestanas centrada e controis aliñados á dereita.
A fotografía domina o sistema visual, con imaxes de pantalla completa de anuncios de propiedades inmobiliarias como principal tipo de contido. Todas as fotos son tomas cálidas e ben iluminadas de interiores e exteriores de casas e hoteis reais, procesadas con corrección de cor natural (sen filtros pesados nin duotonos). As imaxes están recortadas cunha relación de aspecto de 1:1 para as fichas de anuncios, enchendo o bordo da ficha sen sangrías. As iconas en toda a interface teñen un contorno monocromático (grosor de liña ~16–16), usado con moderación para as categorías de navegación e os controis da IU. O logotipo é o único elemento gráfico multicolor (Rausch). Sen ilustracións, sen renderizacións 3D, sen gráficos abstractos: a linguaxe visual é fotografía pura e iconografía monocromática minimalista sobre un lenzo branco suave.
Paleta
Marca
- Rausch
#ff385c— O vermello úsase como elemento decorativo para iconas, sinais e pequenos detalles gráficos. Non se debe usar como cor principal para chamadas á acción. - Rausch 600
#e00b41— Unha versión prensada e escura da pintura Rausch para superficies usadas como acentos de marca en superficies activas/palantes.
Neutro
- Hof
#222222— O corpo do texto, o texto principal, os títulos, os contornos das iconas e o fondo invertido son dunha cor neutra próxima ao negro, que serve de base para todo o sistema acromático. - Foggy
#6a6a6a— Texto secundario, subtítulos silenciados, texto auxiliar, recheo de iconas desactivado e metadatos discretos debaixo dos títulos das tarxetas. - Grey 500
#c1c1c1— Texto desactivado, texto de marcador de posición nos campos de entrada e contornos de iconas silenciados onde se precisa desenfasis no estado. - Bebe
#ebebeb— Bordes finos, campos de entrada subliñados, separadores entre liñas de lista e liñas divisorias sutís. - Deco
#dddddd— Imaxes de fondo de tarxetas para contedores inactivos, marcadores de posición e estados de tarxetas desactivados. - Faint
#f7f7f7— A imaxe de fondo do lenzo da páxina, a superficie do pé de páxina e o estado do cursor para os elementos interactivos son dun ton suave e cremoso que diferencia esta páxina das tarxetas brancas puras.
Tipografía
de 11 a 28 px · 5 pasos
- Airbnb Cereal VF — substitución: Circular · contornos 400, 500, 600, 700 · Unha fonte sans-serif xeométrica personalizada deseñada para Airbnb. O corpo do texto está posicionado a 14px/400, as etiquetas da interface de usuario a 16px/500, os títulos das seccións a 20px/600, 22px/500 cun espazado entre letras axustado de -0,02 em e os títulos das páxinas a 28px/700. O espazado entre letras negativo diminúe ao aumentar o tamaño, unha característica das fontes sans-serif xeométricas en tamaños de pantalla máis grandes. Activa a función de glifo alternativo "sal".
Intervalos e forma
| Propósito | Significado |
|---|---|
| Densidade | denso |
| Paso básico | 12px |
| Radio do botón | 9999px |
| Radio da tarxeta | 12px |
| Sombras | sombras suaves |
| Entre seccións | 48px |
| Largura da páxina | 1440px |
A IA creará o teu sitio web ao estilo de Airbnb 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
- Apple (España) — vitrina de galería branca
- Silencio — Unha habitación branca con artefactos flotantes. Unha exposición de galería feita de papel cálido, onde cada elemento ocupa o seu lugar sobre un fondo de volume negativo, e o silencio é unha decisión de deseño intencionada.
- Oakâme — Un obradoiro provenzal bañado polo sol esculpido en pedra cálida
- Nike — Unha galería monocromática de logros deportivos: paredes brancas, o produto como obra de arte, cromo disolto no fondo.
- Arc — galería branca industrial sobre a auga da medianoite
- Rivian — Un monolito eléctrico no muro de formigón da galería. Rivian presenta cada vehículo como unha escultura contra un vasto espazo branco, cunha tipografía tan grande que se converte nun elemento arquitectónico e un único amarelo cálido que rompe a atmosfera monocromática, como a luz solar sobre unha superficie mate.
- Analogue — Vitrina negra da galería: as mercadorías pairan no baleiro
- ddna — vitrina de museo cálida sobre liño sen tratar
- Zellerfeld — Un obradoiro de escultor sobre mármore branco: as superficies monolíticas do pedestal, unha única faísca de cobalto, un susurro de letras minúsculas do chan ao teito
- UY Studio — A galería de pedra do mosteiro é un espazo tranquilo con muros de formigón, onde frascos de perfume se atopan sobre plintos brancos, iluminados por unha lámpada de 400 vatios e catro lámpadas grises cálidas.
- Basic.Space — galería curatorial sobre mármore branco
- COS — unha galería moderna con paredes brancas