Vercel
Terminal printe op wyt papier
It ûntwerpsysteem fan Vercel is in oefening yn dissiplinearre monochroom: in hast wyt doek (#fafafa), swarte letters, tinne rânen en in folsleine ôfwêzigens fan dekorative kleur. De fisuele taal ropt in ûntwikkeldersterminal op dy't yn print werjûn wurdt - Geist Sans is amper lêsber op 'e "heroyske" skaal mei in gewicht fan 400-450 en in letterôfstân fan -0.06em, wylst Geist Mono labels, metadata en koadefoarbylden tapast yn haadletters fan 11-13px. Knoppen binne skerpe radii fan 6px of rjochthoeken fan suver swart op wyt of wyt op swart. It systeem fertrout op kontrast en typografyske hiërargy ynstee fan kleur, mei it trijehoekige teken (▲) en in wurdmerk mei twa rigels as de ienige branding-eleminten. Oerflakken wurde boppe-op elkoar steapele yn 'e folchoarder #fafafa → #ebebeb → #171717, wêrtroch djipte ûntstiet troch it feroarjen fan toanwearden ynstee fan skaad of kleur. Elk elemint is boud op in 4px-raster mei in kompakte tichtheid, wat resulteart yn in ynterface dy't tinken docht oan it notebook fan in yngenieur - presys, funksjoneel en net bang foar wite romte.
De kontener is 1280px breed, sintraal, mei royale horizontale padding (24-48px). It haadblok brûkt in asymmetryske komposysje mei trije sônes: in grutte koptekst oan de linkerkant, in merkglyf sintraal, en in "wynbrauw"-blok oan de rjochterkant. Under it haadblok is de ynhâld yn ôfwikseljende strepen regele: in stripe oer folsleine breedte mei it logo fan 'e kliïnt, folge troch in seksje mei twa kolommen "Agent Creators" mei de koptekst oan de linkerkant en in produktlayout oan de rjochterkant, folge troch in raster fan trije kaarten mei funksjes. Seksjes wurde skieden troch fertikale goten fan 96-128px sûnder skiedings of eftergrûnoffsets. De navigaasje is in inkele fêste paniel fan 64px mei in wazige eftergrûn. Kaartrasters brûke konsekwint in yndieling mei twa of trije kolommen mei goten fan 16-24px. De algemiene tichtheid is kompakt - de tekst is maklik te lêzen, der is genôch wyt romte, mar de lettergrutte en komponintgrutte foarkomme dat de pagina luchtich oanfielt.
De ôfbyldings binne spar en altyd funksjoneel. It wichtichste fisuele elemint is de swarte trijehoek (▲) - in geometrysk merkteken dat ferskynt as in sweefjend silhouet op 'e "haad" skaal. Klantlogo's op 'e proof-of-concept strip brûke de werklike wurdmerken fan elk merk yn griisskaal. Produktmodellen (Notion's chat-ynterface, CLI-terminalútfier, paspoartkaart) binne ynbêde as ljochtmodus-skermôfbyldings yn ynliste kaarten. Der binne gjin foto's, yllustraasjes of 3D-eleminten - it systeem is suver typografy en geometryske foarmen op wyt papier.
Palet
Neutraal
- Obsidian
#171717— Haadkoppen, navigaasjegrinzen, donkere knopopfoling en listmarkers binne allegear hast swart, wêrtroch hurdens en opfallende sêding foarkommen wurde. - Paper White
#fafafa— It sidedoek, de kaartoerflakken, de ljochte opfolingen fan 'e knoppen - dit is de standerteftergrûn wêrop alles oars leit. - Pure White
#ffffff— Ferhege kaartoerflakken, ynfoegsels, ynfierfjilden. - Hairline
#ebebeb— 1px-rânen op knoppen, keppelings en kaarten binne sichtber by hege zoomnivo's, mar ûnsichtber by lege zoomnivo's. - Ash
#c9c9c9— Útskeakele tekst, gedempte labels, merknammewettermerken yn klantlogo's. - Smoke
#a8a8a8— Sekundêre tekst, plakferfangende tekst, subtile ikoanopfolling.
Typografy
fan 11 oant 64px · 6 stappen
- Geist Sans — ferfanging: Inter · sketsen 400, 450, 500 · It primêre lettertype foar de ynterface en kopteksten is in oanpast ûntworpen geometrysk sans-serif fan Vercel mei krappe letterôfstân by grutte maten (-0.06em by 56-64px, -0.05em by 30px). Foar de kopteksten boppe oan 'e pagina is in gewicht fan 450 keazen: dikker as Ljocht mar lichter as Semi-Fet, wêrtroch in selsbewuste, mar net oerhearskjende, toan ûntstiet.
- Geist Mono — ferfanging: JetBrains Mono · sketsen 400, 500, 600 · In sekundêr lettertype mei in monospaced-romte foar ûnderskriften, koadeblokken, CLI-útfierpanielen, metadata en haadlettertekst. De kombinaasje fan 8px/600px/haadlettertekst makket it mooglik om lytse wurdtekens krekt te pleatsen. In brede letterôfstân (0.071em) yn 'e ferzje mei in monospaced-romte biedt genôch romte foar haadlettertekst.
Yntervallen en foarm
| Doel | Betsjutting |
|---|---|
| Dichtheid | ticht |
| Basisstap | 12px |
| Knopradius | 6px |
| Kaartradius | 6px |
| Skaden | gjin grinzen ynstee fan skaden |
| Tusken seksjes | 96-128px |
| Sidebreedte | 1280px |
AI sil jo webside bouwe yn Vercel -styl en it folje
- Folje oan mei produkten en berjochten fia de link - Instagram, TikTok, Facebook.
- Oerdrage ynhâld fan jo âlde side - spesifisearje gewoan it adres.
- Modern ûntwerp op 'e bêste motor: React ( Next.js) mei serverrendering en SEO-optimalisaasje direkt út 'e doaze.
- Folslein automatisearre SEO-optimalisaasje foar sykresultaten en oanbefellings foar neurale netwurken.
Ferlykbere stilen
- Headspace — In sinnige wellnesshoeke op waarm papier
- WHOOP — Prestaasjelaboratoarium om middernacht - wite klinyske laboratoariumtafels ûnder in swarte teatrale leechte, in inkele pearse puls fan elektrisiteit
- Together AI — Undersykskonsole op gletsjerpapier
- v0 by Vercel — Draaibanktekening. Presyzje en funksjonaliteit binne fan it grutste belang, wêrby't elk elemint in dúdlik doel tsjinnet op in skjin, technysk perfekt oerflak.
- Dovetail — In blauwdruk ûnder in swarte moanne - amper sichtbere graflinen, wyt lettertype, ien pearse fonkeling
- Glideapps — monochrome tekentafel mei ien elektryske turquoise fonkeling
- Timescale — Technyske tekening op waarm grafiekpapier
- UGLYCASH — In mei stickers bedekt notysjeboek op crèmekleurich papier straalt de sfear út fan in stoere, maksimalistyske fintech dy't mei grutskens syn gaos sjen lit.
- Sprout Social — In griene sprút op swarte leisteen. Ien helder aksint op in strang monochroom doek, wêrfan de kleur allinnich brûkt wurdt foar aksje, mei in selsbewust geometrysk lettertype dat as oanwizings tsjinnet.
- Krea — galery noir om middernacht
- Evergreen — Sinnekas op linnenpapier
- Factory — De terminal fan 'e "oarlochskeamer" om middernacht. De "fabryk" is in skerp swart kontrôlepaniel dêr't in inkele wite kaart lânt as in mei in bûselampe ferljochte ferstjoering - it ienige objekt yn 'e keamer is it wurk sels.