Início →
Hostel BrooklinHostel Brooklindesde 2014

Comparativo · 4 direções estéticas

Qual identidade conversa
melhor com o Hostel?

Cada variação aplica uma paleta + tipografia + linguagem de forma diferentes sobre o mesmo conteúdo institucional. Abra cada uma para ver a landing completa renderizada com o tema.

Boutique aconchegante

Casa de vó contemporânea

Tons quentes (terracota, creme, sage), tipografia serifa Fraunces + manuscrita Caveat, cantos arredondados, sombras quentes. Reforça o lema "A casa é sua!" do Portuga.

Tipografia
Fraunces · Manrope · Caveat
Mood
Acolhedor, artesanal, familiar

Ideal para

Público misto, valoriza o lado familiar do hostel

Ver landing renderizada →

Moderno corporativo

Para o público Berrini

Paleta azul-marinho profundo + cinza pedra + dourado discreto. Tipografia Inter limpa, cantos sutis (4–8px), sombras minimalistas, layout denso. Comunica profissionalismo.

Tipografia
Inter (display + body)
Mood
Confiável, clean, profissional

Ideal para

Business travelers da Av. Berrini, viajantes corporativos

Ver landing renderizada →

Vibrante jovem

Energia urbana de SP

Magenta elétrico + amarelo neon + preto absoluto. Tipografia Space Grotesk bold, bordas grossas pretas, sombras offset duras (estilo brutalist). Cantos retos, alto contraste.

Tipografia
Space Grotesk · Inter
Mood
Ousado, urbano, divertido

Ideal para

Mochileiros, Gen Z, viajantes "instagramáveis"

Ver landing renderizada →

Brasilidade contemporânea

Modernismo tropical

Verde-floresta + mostarda + terracota + azul-céu. Tipografia Playfair Display itálica (modernista). Cantos generosos e orgânicos, sombras esverdeadas. Referências Niemeyer/Burle Marx.

Tipografia
Playfair Display · Inter · Caveat
Mood
Sofisticado, brasileiro, contemporâneo

Ideal para

Turistas internacionais, viajantes culturais

Ver landing renderizada →

Como funciona: as quatro variações usam o mesmo HTML, mesmas seções e mesmo conteúdo. A diferença é puramente cosmética — paleta, tipografia, raios de borda e sombras são trocados via data-theme no HTML. Você pode escolher uma para virar o padrão do site, ou combinar elementos das quatro.