Telegram, WhatsApp+380637610482
Valery Danyuk
Valery DanyukdeveloperPagbuo ng mga kagamitang AI para sa mga negosyo. Mataas ang kalidad. Abot-kaya.Mag-chat sa Telegram
Custo — isang preview ng isang site sa ganitong istilo

Custo

Isang gallery na kulay gunmetal na may monolitikong font. Isang showroom sa mahinang kulay abo-berde, kung saan ang isang madilim na bagay at 57px na font ay nagsasalita para sa kanilang sarili.

Ang Custo ay gumaganap bilang isang galeriya ng mga produktong industriyal: isang mainit na metalikong canvas ang nagsisilbing backdrop para sa pisikal na produkto, habang ang malaking-format na tipograpiya ay nagsisilbing pangunahing biswal na palamuti. Ang sistema ay mahigpit na achromatic—walang mga kulay na chromatic—na nagpapahintulot sa madilim na anodized na letterbox at ang geometric gravity ng isang sans-serif na typeface na ihatid ang buong personalidad ng tatak. Binabalanse ng bawat screen ang malawak na puting espasyo na may isang napakalaking pahayag ng tipograpiya, kung saan ang marka ng tatak ay inuulit bilang isang halos elemento ng arkitektura. Ang mga ibabaw ay patag at matte; ang lalim ay nalilikha sa pamamagitan ng sariling repleksyon ng produkto, hindi sa pamamagitan ng mga anino o gradient.

Ang layout ng pahina ay isang patayong nakaayos na istrukturang may iisang hanay na may pinakamataas na lapad ng nilalaman na ~1280px, na nakasentro sa loob ng viewport. Ang elemento ng pangunahing pahina ay sumasaklaw sa buong lapad ng pahina, na nire-render sa edge-to-edge na Canvas Gunmetal #9ea29f, na may larawan ng isang mailbox na nakasentro sa kanan at isang 57px na logo ng CUSTO® na nakaangkla sa ibabang gilid. Sa ibaba ng pangunahing elemento, ang mga seksyon ay nagpapalitan: isang bloke ng teksto na may dalawang hanay (maliit na caption sa kaliwa, malaking pamagat sa kanan), na sinusundan ng isang pahalang na grid ng tatlong card ng imahe ng produkto, pagkatapos ay mga hanay ng teksto at mga imahe na may dalawang hanay, na ang pangunahing teksto ay nagpapalitan sa magkabilang panig. Ang mga gutter sa pagitan ng mga seksyon ay 110px, na lumilikha ng malaking patayong espasyo sa paghinga. Ang nabigasyon ay isang solong transparent na top bar na kumukupas sa Paper White habang nag-i-scroll ka. Ang icon ng CES ay isang nakapirming, lumulutang na elemento sa kanang ibabang sulok. Ang pangkalahatang ritmo ay parang gallery: ilang elemento sa bawat seksyon, malaking font, malalawak na espasyo, at isang larawan ng produkto bilang visual na bantas sa pagitan ng mga text strip.

Ang mga larawan ay pawang product photography ng Custo mailbox, na kinunan sa tatlong mode: full-length portraits laban sa metal frame, mga lifestyle shot na nagpapakita ng interaksyon ng tao sa device, at mga close-up ng scanning interface at LED ring. Lahat ng litrato ay ginawa sa muted, high-contrast tones, kung saan ang matte black finish ng mailbox ay nagsisilbing visual anchor. Walang mga ilustrasyon, abstract graphics, o stock photos. Ang mga litrato ay inilalagay sa mga 8px-radius card o ginagamit sa full-screen sa likod ng 57px logo. Ang CES icon ang tanging multicolor na imahe sa buong website.

Paleta

Neutral

  • Canvas Gunmetal #9ea29f — Ang mainit na kulay abo-berdeng background ng mga pangunahing seksyon at tema ay nagpapaiba sa Custo mula sa karaniwang puting mga template ng SaaS at mas parang arkitektural na kongkreto kaysa sa isang digital na ibabaw.
  • Obsidian #000000 — Body text, manipis na border, mga stroke ng icon - ang tinta na may pinakamataas na contrast sa sistema, na ginagamit para sa mga heading at structural divider.
  • Paper White #ffffff — Mga larawan sa background ng bahagi ng katawan, baliktad na teksto sa gunmetal canvas, teksto sa madilim na background ng potograpiya ng produkto.
  • Anodized Graphite #4b514d — Ang madilim na ibabaw para sa potograpiya ng produkto, mga karagdagang heading, at three-dimensional na teksto ay nagbibigay-diin sa anyo ng mailbox, kaya ang user interface at produkto ay gawa sa iisang materyal.
  • Brushed Steel #8e9194 — Ang mahinahong body text, mga divider ng listahan, at mga karagdagang balangkas ng icon ay nasa pagitan ng Paper White at Obsidian para sa naka-embed na metadata at mga discreet link.
  • Linen Mist #a7aaad — Ang mapusyaw na kulay ng hangganan at mga divider para sa mga heading at linya ng paghahati ay isang banayad na lilim na hindi kailanman nakikipagkumpitensya sa mga linya ng istruktura ng kulay na Obsidian.

Tipograpiya

mula 15 hanggang 57px · 5 hakbang

  • PP Neue Montreal — kapalit: Inter · mga balangkas 400 (Medium) · Isang single-family typographic system ang ginagamit para sa lahat ng bagay mula sa body copy hanggang sa paliwanag na teksto—ang geometric uniformity sa weight ang tatak, na iniiwasan ang paggamit ng anumang pangalawa o display-specific na mga font, kaya ang 'CUSTO®' wordmark na nakatakda sa 57px ay binabasang kabilang sa parehong typographic family gaya ng 15px form input field label.

Mga pagitan at anyo

LayuninKahulugan
Densidadmaluwang
Pangunahing hakbang24px
Radius ng buton31.35px (pill) for primary action; 8px for secondary
Radius ng card8px
Mga aninowalang - mga hangganan sa halip na mga anino
Sa pagitan ng mga seksyon110px
Lapad ng pahina1280px

Gagawa ang AI ng website mo sa estilong Custo at pupunuin ito

  • Punuin ng mga produkto at post gamit ang link - Instagram, TikTok, Facebook.
  • Maglipat ng nilalaman mula sa iyong lumang site—tukuyin lamang ang address.
  • Modernong disenyo gamit ang pinakamahusay na engine: React ( Next.js) na may kasamang server rendering at SEO optimization na agad-agad.
  • Ganap na awtomatikong pag-optimize ng SEO para sa mga resulta ng paghahanap at mga rekomendasyon sa neural network.

Mga katulad na estilo

  • 099 SUPPLY — Isang gallery wall na puno ng mga itim at puting bagay
  • Specht Studio — Isang gallery wall na puno ng palihim na kuryosidad. Ang chrome finish ng studio ay puting ibabaw at itim na letra; ang mga visual na paputok ay ganap na nakatuon sa tilework ng proyekto.
  • Structured — Galeriya ng Renaissance sa papel na parang plasticine
  • Airbnb — Isang tahimik na puting gallery wall na may isang coral red bookmark
  • VSCO — Ang monochrome wall ng gallery ay isang eksibisyon ng mga itim at puting litrato, kung saan ang isang mainit na spotlight ay nagbibigay-liwanag sa susunod na aksyon.
  • Apple (España) — Ang galeriya ng museo, sa banayad na liwanag ng araw, ay isang nag-iisa, nakakabighani, at magaan na puting espasyo, kung saan ang bawat eksibit ay naliliwanagan ng isang spotlight na nakasandal sa isang dingding na may bahagyang kulay.
  • Peak Design — Pader ng gallery, bahagyang naiilawan
  • Apple (España) — Ang eksibisyon ng Obsidian Gallery ay isang madilim na bulwagan kung saan ang isang bagay na gawa sa titan ay kumikinang laban sa isang madilim na kapaligiran.
  • Apple (España) — puting display case ng gallery
  • teenage engineering — Katalogo ng industriya sa pag-iilaw ng studio - ang produkto ang tanging mahalagang bagay sa pahina, at lahat ng iba pa ay tinatalakay sa paligid nito
  • Apple (España) — Isang bintana ng gallery sa hamog sa umaga
  • Apple (España) — Ang White Museum Gallery sa tanghali