Modal
Qorong'i server xonasidagi fosforli terminal - yagona yorug'lik manbai yorqin yashil rang
Modal qorong'i server xonasidagi fosforesans terminali kabi ishlaydi: deyarli qora kanvas, och yashil rangli shrift va LED holat indikatori vazifasini bajaradigan bitta yorqin ohak-yashil aksent. Dizayn tili ishlab chiquvchiga yo'naltirilgan - svetofor nuqtalari bo'lgan monospace kod oynalari, imzo yashil rangidagi izometrik 3D piktogrammalar va ko'p miqdorda oq bo'shliq, har bir bo'limda bitta elementning yonib turishiga imkon beradi. Tipografiya sarlavhalar uchun maxsus shrift (Goga) va barcha UI elementlari uchun o'zgaruvchan shrift (Inter) o'rtasida bo'linadi, ikkalasi ham tor salbiy kuzatuv bilan o'rnatiladi. Ranglar teng taqsimlangan: aksariyat ekranlar axromatik va yorqin ohak-yashil rang faqat asosiy harakatlarda, logotipda, 3D rasmlarda va urg'u momentlarida ko'rinadi. Komponentlar tekis va ramkasiz bo'lib, chuqurlik soyalar o'rniga nozik yashil chegaralar va fon xiralashishi orqali yaratiladi.
Modal kontentni joylashtirish uchun maksimal kengligi 1280 piksel bo'lgan to'liq kenglikdagi qorong'u maketdan foydalanadi. Qahramon oynasi markazda joylashgan: sarlavha (och yashil rangdagi birinchi jumla), kichik sarlavha, ikkita harakatga chaqiriq va vizual langar sifatida bitta 3D obyekt - maketni yon paneldan ajratmasdan. Kontent bo'limlari yagona ritmga amal qiladi: qosh yorlig'i (bosh harflar, Moss 70) → Goga sarlavhasi → o'chirilgan asosiy matn, keyin xususiyat tavsifi (matn + kod/vizual karta) bilan ikki ustunli maket yoki kartalarning uch ustunli panjarasi. Bo'limlar orasidagi oluklar keng - 80 piksel. Sahifa chuqur bo'sh (#000000) va biroz ochroq fon (#181818) chiziqlar orasida almashinadi, bitta yorug'lik qismi (#def0dd) sahifaning o'rtasida vizual nafas olish sifatida paydo bo'ladi. Navigatsiya xira fonga ega bitta, mahkamlangan yuqori paneldan iborat - yon panel yoki mega-menyusiz. Pastki qism ixcham va qorong'i, o'chirilgan yashil havola ustunlari bilan. Matn zichligi qulay: har bir bo'limga yetarli joy beriladi va karta katakchalari uchta ustundan ko'p bo'lmagan miqdorda ishlatiladi.
Modalning vizual tili ikki rejimga bo'lingan: 3D yorqin mahsulot renderlari va qorong'u kod oynasi maketlari. Fokus nuqtasi - bu marketing gradienti (och yashildan zumradgacha) yordamida renderlangan bitta 3D kub, bo'sh joyni yashil nur bilan yorituvchi radial gradient halo ichida joylashgan - brendning o'ziga xos vizual uslubi. Ish yuklamasi kartalarida qorong'u fonda xuddi shu och yashil rangda renderlangan izometrik 3D piktogrammalar (simli ramka kubi, qattiq zinapoya, qatlamlar) mavjud. Kod va benchmark natijalari svetofor nuqtalari, fosforli palitrada monospace sintaksisi va xira yashil chegarasi bo'lgan terminal oynasi kartalari sifatida taqdim etiladi - ular haqiqiy buyruq satri interfeysining skrinshotlariga o'xshaydi. Mijoz logotiplari bitta, past kontrastli qatorda to'yinmagan yashil-kulrang yorliqlar sifatida ko'rsatiladi, bu vizual raqobatsiz ishonchni bildiradi. Umumiy zichlik past - aksariyat sahifalarda asosan matn mavjud va tasvirlar fotosuratlar panjaralari o'rniga alohida fokus nuqtalari sifatida taqdim etiladi. Fotosuratlar yo'q; butun vizual tizim renderlangan, geometrik va nurli.
Palitra
Brend
- Lime Pulse
#7fee64— Korporativ identifikatsiyaning asosiy elementlari logotip, harakatga asosiy chaqiriq (CTA), yorliqlarni to'ldirish, faol holatlar va rasmning asosiy rangidir.
Neytral
- Phosphor White
#ddffdc— Asosiy matn, sarlavha rangi, belgi konturi va to'ldirilgan tugma matni asosiy o'qiladigan sirtdir. - Void Black
#000000— Sahifa kanvasi, eng chuqur fon qatlami - Ground Iron
#181818— Asosiy tugmani to'ldirish, qorong'u joylarda karta yuzalari, foydalanuvchi interfeysining asosiy yuzasi. - Carbon Veil
#212525— Baland yuzalar, navigatsiya fonida, yerdan biroz yengilroq. - Circuit Border
#485346— Asosiy interaktiv ingichka chiziq bo'lgan kontur/arvoh harakat ramkasi xira yashil-kulrang tusda. - Phosphor Blue-Black
#1f2a33— Qorong'u chiziqlar orasidagi chiziqlarni ajratib turuvchi ikkilamchi ingichka belgilar.
Tipografiya
12 dan 64 pikselgacha · 8 qadam
- Goga — almashtirish: Inter Tight or Space Grotesk · konturlar 400, 500 · Sarlavha va kichik sarlavha shrifti – Barcha H1–H4 sarlavhalari va kartalari uchun ishlatiladi. Goga – tor teshiklari va biroz kvadrat shaklidagi terminallari boʻlgan maxsus geometrik sans-serif shrifti. Oʻrtacha ogʻirlik (500) karta darajasidagi sarlavhalarni ajratib koʻrsatish uchun ajratilgan; normal ogʻirlik (400) qahramon va boʻlim sarlavhalari uchun ishlatiladi. Modalning oʻziga xosligini belgilaydigan muqobil glif shakllariga kirish uchun uning "ss01" stilistik toʻplami yoqilgan boʻlishi kerak. Salbiy harflar oraligʻi asta-sekin 48 pikselda -0.007em dan 21 pikselda -0.017em gacha kamayadi.
- Inter Variable — almashtirish: Inter · konturlar 400, 500 · Foydalanuvchi interfeysi va matnning asosiy nusxasi – navigatsiya, tugmalar, matnning asosiy nusxasi, yorliqlar, altbilgi. Interaktiv elementlar va navigatsiya uchun sukut bo'yicha o'rtacha og'irlik (500) ishlatiladi; paragraflar uchun normal (400) ishlatiladi. Harflar oralig'i hatto kichik o'lchamlarda ham sezilarli darajada kamayadi (14 pikselda -0.026em, 16 pikselda -0.022em), bu interfeysga qisqartirilgan, terminal zichligini beradi. Muqobil tinish belgilari uchun 'cv11' belgi varianti kiritilishi kerak. 12 pikseldagi barcha katta harflar bilan yozilgan yorliqlar matnning asosiy nusxa zichligini muvozanatlash uchun +0.05em harflar oralig'idan foydalanadi.
Intervallar va shakl
| Maqsad | Ma'nosi |
|---|---|
| Zichlik | o'rtacha |
| Asosiy qadam | 20px |
| Tugma radiusi | 12px |
| Karta radiusi | 8px |
| Soyalar | soyalar o'rniga chegaralar yo'q |
| Bo'limlar orasida | 80px |
| Sahifa kengligi | 1280px |
Sun'iy intellekt veb-saytingizni Modal 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
- Slash — Yarim tunda zarhal daftarchalar bilan qoplangan ombor
- AgentQL — Kechasi terminal ustidagi shimoliy chiroqlar
- GitHub — Biolyuminestsent boshqaruv nuqtalariga ega kosmik boshqaruv paneli — qorong'u, atmosferali ish maydoni, bu yerda bitta yashil nur oldinga yo'lni ko'rsatadi.
- Doppler — Yarim tunda gumbazning binafsha rang yoritgichi. Deyarli qora tuval bitta lavanta signali va yashil tasdiq chiroqi bilan porlaydi, har bir sirt ushlash uchun etarlicha egri.
- Basedash — Mat shriftli yarim tunda ma'lumotlar terminali. Metriklar binafsha va yashil rangda porlaydigan, serif sarlavhalari shovqin ustida suzib yuradigan va oq tabletka shaklidagi tugmalar yumshoq qora yuzalar xonasidagi yagona yorqin obyektlar bo'lgan qorong'u rasadxona.
- Superwhisper — Shimoliy chiroqlar yarim tunda porlaydi
- Better Stack — Yarim tunda SRE konsoli
- Langbase — Yarim tungi Shimoliy chiroqlar konsoli
- Astro — Tumanlikdan bitta binafsha nur bilan chuqur kosmik missiyani boshqarish
- Wayfinder — Jonli illyustratsiya ustida zo'rg'a eshitiladigan sarlavhali qora kino ekrani. Interfeys boshqaruv paneli emas, balki yorqinlik slayderi sifatida ishlaydi.
- HashiCorp — Yarim tunda binafsha neon bilan jihozlangan boshqaruv xonasi qorong'u texnik sirt bo'lib, u yerda olti burchakli kub yagona rang namunasi bo'lib xizmat qiladi.
- Umbrel — Tungi server xonasida shinam kamin — qorong'u xonada bitta shaftoli rangidagi yorug'lik chindan ham muhim narsani ta'kidlaydi.