Vercel
Terminal oq qog'ozga bosilgan
Vercel dizayn tizimi intizomli monoxrom mashqidir: deyarli oq rangli kanvas (#fafafa), qora shrift, yupqa chegaralar va dekorativ ranglarning to'liq yo'qligi. Vizual til ishlab chiquvchining bosma nashrda ko'rsatilgan terminalini eslatadi — Geist Sans "qahramonona" shkala bo'yicha 400-450 og'irlikda va -0.06em harflar oralig'ida zo'rg'a o'qiladi, Geist Mono esa yorliqlar, metama'lumotlar va kod namunalarini 11-13 piksel kattaliklarda qo'llaydi. Tugmalar o'tkir 6 piksel radiusli yoki oq rangda sof qora yoki qora rangda oq rangdagi to'rtburchaklardir. Tizim rang o'rniga kontrast va tipografik ierarxiyaga tayanadi, uchburchak belgisi (▲) va ikki qatorli so'z belgisidan yagona brending elementlari sifatida foydalanadi. Sirtlar bir-birining ustiga #fafafa → #ebebeb → #171717 tartibida joylashtirilgan bo'lib, soya yoki rang o'rniga tonal qiymatlarni o'zgartirish orqali chuqurlik yaratadi. Har bir element ixcham zichlikka ega 4 pikselli panjara ustiga qurilgan, natijada muhandisning daftarini eslatuvchi interfeys paydo bo'ladi — aniq, funktsional va oq bo'shliqdan qo'rqmaydi.
Konteyner kengligi 1280 piksel, markazda joylashgan, gorizontal to'ldirgichli (24-48 piksel). Asosiy blok assimetrik uch zonali kompozitsiyadan foydalanadi: chapda katta sarlavha, markazda brend glif va o'ngda "qosh" bloki. Asosiy blok ostida kontent navbatma-navbat chiziqlar shaklida joylashtirilgan: mijoz logotipi tushirilgan to'liq kenglikdagi chiziq, undan keyin chapda sarlavha va o'ngda mahsulot joylashuvi tushirilgan ikki ustunli "Agent yaratuvchilari" bo'limi, undan keyin xususiyatlarga ega uchta kartadan iborat panjara. Bo'limlar ajratgichlarsiz yoki fon siljishlarisiz 96-128 pikselli vertikal oluklar bilan ajratilgan. Navigatsiya xira fonga ega bitta sobit 64 pikselli paneldir. Karta panjaralari doimiy ravishda 16-24 pikselli oluklar bilan ikki yoki uch ustunli joylashuvdan foydalanadi. Umumiy zichlik ixcham - matnni o'qish oson, oq bo'shliq yetarli, ammo shrift o'lchami va komponent o'lchamlari sahifaning havodor ko'rinishiga yo'l qo'ymaydi.
Tasvirlar siyrak va har doim funktsionaldir. Asosiy vizual element qora uchburchak (▲) — "katta" shkala bo'yicha suzib yuruvchi siluet sifatida ko'rinadigan geometrik brend belgisi. Kontseptsiyani tasdiqlash chizig'idagi mijoz logotiplari har bir brendning haqiqiy so'z belgilarini kulrang shkala bo'yicha ishlatadi. Mahsulot maketlari (Notion chat interfeysi, CLI terminali chiqishi, pasport kartasi) ramkalangan kartalar ichiga yorug'lik rejimidagi skrinshotlar sifatida joylashtirilgan. Hech qanday fotosuratlar, illyustratsiyalar yoki 3D elementlar yo'q — tizim sof tipografiya va oq qog'ozdagi geometrik shakllardan iborat.
Palitra
Neytral
- Obsidian
#171717— Asosiy sarlavhalar, navigatsiya chegaralari, qorong'u tugmalar to'ldirish va ro'yxat markerlari deyarli qora rangda bo'lib, qo'pollik va yorqin to'yinganlikdan saqlaydi. - Paper White
#fafafa— Sahifa tuvali, kartochka yuzalari, tugmalarning yorug'lik bilan to'ldirilishi — bularning barchasi boshqa narsalar joylashgan standart fondir. - Pure White
#ffffff— Ko'tarilgan karta yuzalari, qo'shimchalar, kiritish maydonlari. - Hairline
#ebebeb— Tugmalar, havolalar va kartalardagi 1px chegaralar yuqori zum darajalarida ko'rinadi, lekin past zum darajalarida ko'rinmaydi. - Ash
#c9c9c9— Mijoz logotiplarida matn o'chirilgan, yorliqlar o'chirilgan, brend nomi suv belgilari. - Smoke
#a8a8a8— Ikkilamchi matn, joy egallovchi matn, nozik belgi to'ldirish.
Tipografiya
11 dan 64 pikselgacha · 6 qadam
- Geist Sans — almashtirish: Inter · konturlar 400, 450, 500 · Interfeys va sarlavhalar uchun asosiy shrift Vercel tomonidan ishlab chiqilgan maxsus geometrik sans-serif bo'lib, katta o'lchamlarda harflar oralig'i tor (56-64 pikselda -0.06em, 30 pikselda -0.05em). Sahifaning yuqori qismidagi sarlavhalar uchun 450 og'irlik tanlandi: Lightdan qalinroq, lekin Yarim Qalindan yengilroq, bu o'ziga ishongan, ammo haddan tashqari bo'ysunmaydigan ohangni yaratadi.
- Geist Mono — almashtirish: JetBrains Mono · konturlar 400, 500, 600 · Taglavhalar, kod bloklari, CLI chiqish panellari, metama'lumotlar va katta harflar uchun bir oraliqli ikkilamchi shrift. 8px/600px/katta harflar kombinatsiyasi kichik so'z belgilarini aniq joylashtirish imkonini beradi. Bir oraliqli versiyada keng harflar oralig'i (0.071em) katta harflar uchun yetarli joy beradi.
Intervallar va shakl
| Maqsad | Ma'nosi |
|---|---|
| Zichlik | zich |
| Asosiy qadam | 12px |
| Tugma radiusi | 6px |
| Karta radiusi | 6px |
| Soyalar | soyalar o'rniga chegaralar yo'q |
| Bo'limlar orasida | 96-128px |
| Sahifa kengligi | 1280px |
Sun'iy intellekt veb-saytingizni Vercel uslubida yaratadi va uni to'ldiradi
- Mahsulotlar va postlarni Instagram, TikTok, Facebook havolalari orqali to'ldiring.
- Eski saytingizdan kontentni o'tkazing — shunchaki manzilni ko'rsating.
- Eng yaxshi dvigatelda zamonaviy dizayn: React ( Next.js) server renderlash va SEO optimallashtirish bilan darhol.
- Qidiruv natijalari va neyron tarmoq tavsiyalari uchun to'liq avtomatlashtirilgan SEO optimallashtirish.
O'xshash uslublar
- Headspace — Issiq qog'ozda quyoshli sog'lomlashtirish burchagi
- WHOOP — Yarim tunda ishlaydigan laboratoriya - qora teatr bo'shlig'i ostidagi oq klinik laboratoriya stollari, bitta binafsha elektr impulsi
- Together AI — Muzlik qog'ozidagi tadqiqot konsoli
- v0 by Vercel — Torna chizmasi. Aniqlik va funksionallik juda muhim, har bir element toza, texnik jihatdan mukammal sirtda aniq maqsadga xizmat qiladi.
- Dovetail — Qora oy ostida chizma — zo'rg'a ko'rinadigan grafik chiziqlari, oq shrift, bitta binafsha uchqun
- Glideapps — bitta elektr firuza uchqunli monoxrom chizma stoli
- Timescale — Issiq grafik qog'ozga muhandislik chizmasi
- UGLYCASH — Krem rangli qog'ozga stiker bilan qoplangan daftar o'zining betartibligini mag'rurlik bilan namoyish etadigan dadil, maksimalist fintech muhitini aks ettiradi.
- Sprout Social — Qora shiferdagi yashil nihol. Qattiq monoxrom tuvaldagi yorqin aksent, uning rangi faqat harakat uchun ishlatiladi va ishonchli geometrik shrift yo'l ko'rsatkichlari vazifasini bajaradi.
- Krea — yarim tunda galereya noir
- Evergreen — Zig'ir qog'ozdagi quyosh issiqxonasi
- Factory — Yarim tunda "urush xonasi" terminali. "Zavod" - bu qora boshqaruv paneli bo'lib, u yerga bitta oq kartochka xuddi chiroq yonib turgan xabarnoma kabi tushadi - xonadagi yagona narsa - bu ishning o'zi.