ElevenLabs
Isang photo essay sa maayang kulay krema na may banayad na mga headline. Isang notebook na istilong Bauhaus—papel na kulay itlog, itim na tinta, at isang lila at orange na accent para sa display ng produkto.
Gumagana ang ElevenLabs sa isang mainit at puting minimalistang istilo: isang canvas na kulay itlog (#fdfcfc) na may itim na tipo at isang patong ng mainit na taupe na ibabaw (#f5f3f1). Tahimik at may kumpiyansa ang pagkakakilanlan ng tatak—ang halos hindi makilalang tipo ng titik na Waldenburg 300 ay nagha-highlight sa mga headline nang may lubos na kalinawan (-0.02em), habang ang Inter 400/500 ay nagbibigay sa lahat ng iba pa ng kalmadong neutralidad. Dalawang kulay na accent—matingkad na lila #0447ff at matingkad na orange #ff4704—ang lumalabas lamang sa loob ng mga visual na elemento ng produkto (mga audiosphere, mga icon ng produkto), hindi kailanman bilang chrome sa UI. Ang mga bahagi ay nananatiling patag o bahagyang nakataas na may manipis na 1px na mga border, malapad na 20px na radii sa mga card, at ganap na puno ng 9999px na mga buton. Ang sistema ay nakapagpapaalaala sa isang Bauhaus studio sa kremang papel: maingat, editoryal at teknikal na tumpak.
Ang mga seksyong may buong lapad ay nakaayos nang patayo sa isang solong gitnang hanay na may pinakamataas na lapad na 1280px na panlabas na gutter. Ang pangunahing seksyon ay asymmetrical: ang heading ay nakahanay sa kaliwa sa antas ng Waldenburg na 48px, ang teksto ng paglalarawan ay nakahanay sa kanan, at dalawang butones na hugis-pill ang matatagpuan sa ibaba ng heading. Sa ibaba ng pangunahing seksyon ay isang malaking tabbed na navigation bar na sumasaklaw sa buong lapad ng nilalaman. Ang mga seksyon ay nagpapalitan sa pagitan ng kulay-itlog na balat at taupe na mga background na may mga patayong gutter na 96–125px. Ang footer ay isang compact, iisang strip. Ang nabigasyon ay isang minimalistang top bar—walang nakapirming pag-uugali, walang mega-menu. Ang ritmo ng nilalaman ay tumutugma sa istilo ng editoryal: maraming puting espasyo, isang pangunahing visual na elemento bawat seksyon, at walang mga card grid sa ilalim ng seksyong "Trust".
Ang biswal na disenyo ay pinangungunahan ng isang iskema ng kulay: malalaking gradient sa anyo ng malalambot na audio sphere (200px+ na bilog na may mga radial transition mula lila hanggang kahel at rosas) ang nagsisilbing pangunahing elementong grapiko. Ang mga logo sa seksyong "Trust" ay inihaharap sa isang low-contrast grayscale laban sa isang matte na canvas na background. Minimal lamang ang potograpiya—walang mga larawan ng pamumuhay o produkto. Ang ikonograpiya ay kalat-kalat at monochrome (itim na balangkas o mga icon na puno, walang mga chromatic icon). Ang biswal na sistema ay mas nakapagpapaalala sa isang publikasyon ng disenyo kaysa sa isang katalogo ng produkto—ang paghihigpit sa editoryal ay nangingibabaw kaysa sa epekto sa marketing.
Paleta
Tatak
- Violet Spark
#0447ff— Biswal na Diin ng Produkto - Lumalabas lamang sa loob ng mga ilustrasyon ng audio sphere at mga pandekorasyon na icon ng produkto; hindi kailanman ginagamit para sa mga elemento ng interface.
Neutral
- Eggshell
#fdfcfc— Ang page canvas, mga ibabaw ng butones, at mga ibabaw ng card ay mainit, bahagyang krema, sa halip na matingkad na puti, upang maiwasan ang digital glare at mabigyan ang site ng katahimikan na parang papel. - Warm Taupe
#f5f3f1— Ang mga divider strip, mga pandekorasyon na kard, at karagdagang antas ng ibabaw – isang hakbang na mas malalim kaysa sa matte na ibabaw – ay lumilikha ng tahimik at walang hangganang paghihiwalay. - Stone
#ebe8e4— Ang manipis na mga border, divider, at background ng icon ay isang mainit na kulay abo na nasa pagitan ng taupe at medium gray nang hindi nakakaramdam ng lamig. - Ink
#000000— Maging ito man ay body text, mga button na puno, nabigasyon, o mga link, ang purong itim ay nagsisilbing pundasyon para sa isang mainit na paleta ng kulay at lumilikha ng tanging matalas na contrast sa sistema. - Graphite
#44403b— Body text, mga heading ng seksyon - isang banayad at mainit na maitim na kulay abo para sa teksto na kailangang maging matingkad at walang kagaspangan ng itim. - Smoke
#777169— Ang pangunahing teksto, mga maingat na paglalarawan, at mga kapsyon ay nasa katamtamang-mainit na kulay abo; ang nangingibabaw, mababasa, ngunit kalmadong istilo ng mga kard at tematikong teksto.
Tipograpiya
mula 10 hanggang 48px · 8 hakbang
- Waldenburg — kapalit: Inter (300) or Söhne Light · mga balangkas 300 · Para sa mga heading at elemento ng disenyo lamang. Ginagamit sa 48/36/32px na format na may font weight na 300—hindi pangkaraniwan ang isang ultra-light na font; karamihan sa mga website ay gumagamit ng 600-700; ang banayad na font na ito ay nagpapakita ng awtoridad sa pamamagitan ng pagpipigil. Ang masikip na espasyo ng mga letra na -0.02em ay lumilikha ng mas malapit na pagkakatugma sa pagitan ng mga letra sa mas malalaking sukat. Mga Alternatibo: "Inter" sa 300 weight o "Söhne" sa light weight bilang isang premium na alternatibo.
- Inter — kapalit: Inter or system-ui · mga balangkas 400, 500 · Lahat ng wala sa screen: body text, nabigasyon, mga buton, mga link, mga label, mga input field, mga card. 400 ang default na timbang; 500 ang nakalaan para sa mga buton at mga naka-highlight na link. Ang mga sukat ay mula 10 hanggang 10, na may pinaikling pagitan ng mga linya (1.47–1.6), na nagbibigay ng espasyo para sa mga talata. Ang maliit na pagitan ng mga letra na +1 (2) sa mga sukat mula 14 hanggang 3 ay nagpapabuti sa pagiging madaling mabasa sa maliliit na sukat.
- Geist Mono — kapalit: JetBrains Mono or IBM Plex Mono · mga balangkas 400 · Mikroteksto na matatagpuan sa tabi ng kodigo o teknikal na teksto, nakaposisyon sa 13px—bihirang gamitin (dalas = 28) para sa mga teknikal na label o metadata. Isang patong, malaking taas ng linya na 1.69.
Mga pagitan at anyo
| Layunin | Kahulugan |
|---|---|
| Densidad | siksik |
| Pangunahing hakbang | 8-16px |
| Radius ng buton | 9999px |
| Radius ng card | 20px |
| Mga anino | walang - mga hangganan sa halip na mga anino |
| Sa pagitan ng mga seksyon | 96-125px |
| Lapad ng pahina | 1280px |
Gagawa ang AI ng website mo sa estilong ElevenLabs 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
- Awesomic — Editoryal na zinc mesh na may orange na bantas na nakapagpapaalala ng confetti
- Monad — teknikal na dyornal ng editoryal tungkol sa mainit na pergamino
- Dub — Control panel ng Link na gawa sa matte rice paper
- Seline Analytics — Isang tahimik na analytical table sa mainit na papel
- Notion — Isang mainit na kuwaderno na papel sa ilalim ng araw ng tanghali
- Anthropic — Isang siyentipikong field journal sa mainit na vellum—mga kalmadong ibabaw na garing, mga serif na heading editoryal, at isang natatanging accent na luwad na lumilitaw lamang kapag kinakailangan ng aksyon.
- Calendly — Madilim na asul na tinta sa malamig na marmol
- Augen Pro — Ang puting presentasyon ng Apple ay nagtatampok ng klinikal, magaan, at de-kuryenteng asul bilang tanging accent sa isang monochrome na espasyo.
- Antimetal — Isang kronikong editoryal sa kremang papel—isang tahimik na umaga sa isang siyentipikong dyornal, kung saan ang pagtitimpi ay naghahatid ng kumpiyansa at ang mga serif ang siyang nagpapabigat
- Perk — Electric lime sa mainit na parchment paper
- Ditto — Isang workshop na naliliwanagan ng araw na lumilikha ng mga sample ng wildflower. Mainit na kremang ibabaw, matingkad na dilaw na kulay, malalim na asul na tinta, mga organikong kulay na namumukadkad sa likod ng obra.
- Officevibe — Isang magasin na editoryal sa mainit at kulay kremang papel. Isipin ang isang maalalahaning sanaysay tungkol sa pamamahala ng HR, na inilalahad bilang isang produkto—isang cursive serif font na bumubulong sa isang modernong asul na interface.