Telegram, WhatsApp+380637610482
Valery Danyuk
Valery DanyukframkallareUtvecklar AI-verktyg för företag. Högkvalitativt. Prisvärt.Skriv i Telegram
Allbirds — en förhandsvisning av en webbplats i den här stilen

Allbirds

Naturmaterial på vitt linne

Allbirds arbetar med ett lugnt, naturligt självförtroende – en nästan helt akromatisk duk, kompletterad av varm sand (#e0dacf) och dämpade jordtoner hämtade direkt från produktfotografering. Användargränssnittet stör inte produktupplevelsen: vita ytor, tunna kanter, navigering med bara versaler och pillerformade kontroller som känns mer som fysiska knappar än webbelement. Self Modern (ett anpassat serif-teckensnitt) används för de få avgörande ögonblick som kräver redaktionell uppmärksamhet – rubriker och kollektionsnamn – medan Geograph används för varje bokstäver, brödtext och knapp i tre balanserade vikter. Kategorikort blir ett färgsystem: varje kort tar sin bakgrundsfärg från den utvalda produkten och förvandlar navigeringen till en levande Pantone-palett.

Den maximala bredden är ~1200px, centrerad med generös sidofyllning. Huvudelementet är en redaktionell remsa i full bredd mot en varm sandfärgad bakgrund med en stor produktkarusell som strålar ut från mitten. Kategorinavigeringen är ett rutnät med fyra identiskt färgade kort i fyra kolumner, där var och en innehåller en centrerad skomodell. Nedanför vikningen växlar layouten mellan delade paneler i full bredd (livsstilsfoto till vänster + produktprov till höger) och centrerade produktkaruseller under en liten, understruken sektionsrubrik. Den övergripande rytmen är: redaktionell panel i full bredd → rutnät med fyra kolumner → centrerad produktkarusell → delning med två kolumner → centrerad produktkarusell. Avståndet mellan sektionerna är 40–56px, vilket skapar luftiga men inte överväldigande övergångar. Navigeringen är en minimalistisk, fast övre bar med centrerade primära länkar.

Fotografi är hela det visuella systemet. Alla produktbilder är närbilder, från en svag vinkel, mot en solid bakgrund som matchar eller kompletterar skons accentfärg, vilket effektivt förvandlar varje foto till en färgstudie. Livsstilsbilderna är tagna i varma, soliga toner, i naturliga miljöer (agavefält, trädäck, ojämn terräng), subtilt dämpade för att matcha den dämpade paletten. Det finns inga illustrationer, inga 3D-renderingar, ingen abstrakt grafik. I samarbete med Pantone används den bokstavliga färgpaletten som ett grafiskt element. Ikonografin är minimalistisk och monokrom (konturikoner i navigering och hjälppositioner).

Palett

Neutral

  • Canvas White #ffffff — Bakgrundsbilder på sidor, kortytor, bakgrundsbilder på produktkort.
  • Charcoal #212121 — En neutral färg stöds för sekundära UI-element, avdelare och dämpade etiketter. Den bör inte användas som primärfärg för uppmaningar till handling.
  • True Black #000000 — Rubriker, ikoner, ramar med hög kontrast, navigeringstext.
  • Warm Sand #e0dacf — Bakgrund för huvudsektion, ytterligare ytskugga, stora redaktionella paneler.
  • Olive Char #222519 — En neutral färg stöds för sekundära UI-element, avdelare och dämpade etiketter. Den bör inte användas som primärfärg för uppmaningar till handling.
  • Iron Gray #525252 — Sekundärtext, hjälptext, diskreta ramar.

Typografi

från 12 till 40px · 6 steg

  • Self Modern — ersättning: Playfair Display · konturer 400 · Rubriker och ledare används sparsamt och framhäver nyckelfraser och samlingstitlar. Serif- och kursivstil bryter monotonin i sans-serif-typsnitt och förmedlar budskapet: "Detta är berättelsens kärna."
  • Geograph — ersättning: Inter · konturer 400, 500, 700 · Det primära teckensnittet för användargränssnittet inkluderar brödtext, navigeringsetiketter, knappar, produktrubriker, sidfot, inmatningsfält och ikoner. 500 för markerade rubriker, 700 för produktnamn. Brett teckenavstånd (0,025–0,10 cm) med versaler i navigeringsetiketter och kategorier skapar en konsekvent varumärkesstil.
  • HurmeGeometricSans3 — ersättning: Inter · konturer 400 · Används sällan som reservetikett eller dedikerad etikett för en knapp. Geograph använder detta system dagligen.

Intervaller och form

ÄndamålMenande
Densitettät
Grundläggande steg8-16px
Knappradie9999px (pill)
Kortradie16px
Skuggoringa gränser istället för skuggor
Mellan sektioner40-56px
Sidbredd1200px

AI kommer att bygga din webbplats i Allbirds -stil och fylla den

  • Fyll på med produkter och inlägg via länken - Instagram, TikTok, Facebook.
  • Överför innehåll från din gamla webbplats – ange bara adressen.
  • Modern design på den bästa sökmotorn: React ( Next.js) med serverrendering och SEO-optimering direkt ur lådan.
  • Helautomatisk SEO-optimering för sökresultat och rekommendationer för neurala nätverk.

Liknande stilar

  • Lightship — Ett filmiskt diorama av öppen väg. Varma krämfärgade galleriväggar prydda med stora landskapsfotografier monterade med tätt mellanrum, tunn svart text knappt synlig på ramarna och en enda ljus orange accent som bryter monokromen likt en brasa på en äng.
  • Faire ES — grossistkatalog av varm grädde
  • Adanola — En redaktionell lookbook på vitt papper. En modefotografering där typografi och fotografi andas på rena vita ytor, med svart bläck som typsnitt och ett subtilt signatur-sans-serif-typsnitt (Favorit), vilket återspeglar varumärkets övergripande stil.
  • Oura Ring — En mysig havregrynsverkstad, badande i mjukt dagsljus
  • Stykka — En skandinavisk verkstad i vitt ljus – ett tyst, handgjort showroom där den enda rösten är fotografi
  • DJI — svart flyg- och rymdcanvas med en enda elektrisk blå accent
  • Altitude Beverages — Monokromt tidningsuppslag. Tänk dig ett modetidningsuppslag utan all färg förutom stillbilderna – texten och det vita utrymmet berättar hela historien.
  • AATHER — En öppen handflata, en enda låga – en stilla lyx innesluten i stillhet
  • Cowboy — Ett belgiskt cykelgalleri i en snövit porslinsmiljö. Ett utställningslokaler där matta ytor, stora typsnitt i redaktionellt material och en praktiskt taget avsaknad av dekoration drar blicken till cykeln och dess innehåll.
  • Refero — Redaktionell layout på vit marmor - en produktsida skapad av en typograf, där serif-rubriken är varumärkets visitkort och allt annat är diskret
  • Face Formula — Ett skandinaviskt redaktionellt porträtt. Ett lugnt uppslag i tidningsstil, där modellens blick och rubriken, skriven med ett kompakt serif-typsnitt, talar för sig själva mot en sval, dimmig bakgrund.
  • Shupatto — Museumsmontre på vit marmor