Telegram, WhatsApp+380637610482
Valery Danyuk
Valery DanyukdesenvolvedorDesenvolvemento de ferramentas de IA para empresas. Alta calidade. Asequible.Escribir en Telegram
Airbnb — unha vista previa dun sitio con este estilo

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ósitoSignificado
Densidadedenso
Paso básico12px
Radio do botón9999px
Radio da tarxeta12px
Sombrassombras suaves
Entre seccións48px
Largura da páxina1440px

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