Huly
Yarim tun rasadxonasidagi shimoliy yogʻdular – bosh qahramon binafsha rangning marjonga aylanib borayotgan vertikal nuri boʻlib, uning ostidagi har bir sokin qism bir xil ikki rangli hikoyani yanada pastroq ohangda hikoya qiladi.
Huly kosmik ish maydonining muhitini eslatadi: asosiy elementni kesib o'tuvchi bitta binafsha-kehribar rangli yorug'lik bilan deyarli qora kanvas va uning ostida unumdorlikni oshirish uchun yanada yumshoqroq panjara mavjud. Tizim tor rang diapazonida ishlaydi - bitta yorqin ko'k va bitta marjon qatlamli grafit sirtlariga qarshi barcha brending ishlarini bajaradi, shuning uchun qorong'u rejim hech qachon neytral ko'rinmaydi. Tipografiya barcha funktsional narsalar uchun Inter-style bo'lib, asosiy fikrlar uchun ajratilgan maxsus shrift (Esbuild) bilan, 80–84 piksel balandlikda va agressiv salbiy harflar oralig'i bilan. Komponentlar kapsula shaklida: boshqaruv elementlarida 9999 piksel radius, kartalarda 12 piksel, minimal soya va asosiy bezak sifatida porlab turgan gradient chiziqlar. Sahifa to'liq sahifali qorong'u joylar va tinch yorug'lik qismlari o'rtasida almashinib turadi, shuning uchun har qanday yangi ekran ranglarni tanlashdan oldin rejimni tanlashi kerak.
To'liq kenglikdagi bosh sahifada shimoliy yog'dularning vertikal nuri va chapga tekislangan sarlavha, shuningdek, pastki o'ng tomonda joylashgan mahsulot skrinshoti mavjud. Bosh sahifa ostida maksimal kenglikdagi, 1200 pikselli, qorong'u va och rangli chiziqlar almashinib turadigan kontent maydoni joylashgan. Har bir bo'lim bitta vertikal blokdan iborat: sarlavha va 96 pikselli bo'shliqlar bilan ajratilgan 3 yoki 4 ustunli kartalar panjarasi. "MetaBrain" bo'limi panjarani markazlashtirilgan sarlavha va turli o'lchamdagi kartalar mozaikasi (katta asosiy karta va kichikroq qo'llab-quvvatlovchi kartalar) bilan ajratadi. Sahifa SaaS standartlariga muvofiq tarkibga boy, lekin har bir bo'limga nafas olish uchun joy berish uchun qorong'u va och rangli chiziqlardan almashinib foydalanadi. Navigatsiya - bu aylantirilganda xiralashib ketadigan bitta shaffof yuqori panel.
Asosiy element - bu fotosuratlarsiz sof avrora gradiyenti. Barcha illyustratsiyalar mahsulotning foydalanuvchi interfeysining haqiqiy skrinshotlari (qorong'u rejimdagi Kanban, pochta qutisi, taqvim) bo'lib, ular ham dalil, ham bezak sifatida xizmat qiladigan karta ramkalariga joylashtirilgan. Turmush tarzi fotosuratlari, stok rasmlari, 3D renderlar yo'q. Foydalanuvchi interfeysiga aloqador bo'lmagan yagona vizual element - bu avroraning tagidagi CSS gradiyenti sifatida ko'rsatilgan iliq, nurli quyosh nuri. Belgilar #95979 yoki oq rangdagi monoxrom chiziqli piktogrammalar bo'lib, hech qachon ko'p rangli emas. Tizim o'zining qorong'u foydalanuvchi interfeysini asosiy element sifatida ko'rib chiqadi - mahsulot fotosuratlardir.
Palitra
Brend
- Electric Iris
#5683da— Asosiy fon, faol navigatsiya indikatori va ajoyib Shimoliy chiroqlar aksenti — qora fonda yorqin binafsha-ko'k rang — korporativ faoliyatdan ko'ra ko'proq ishtirok taassurotini yaratadi. - Ember Pulse
#ff8964— Ikkilamchi urg'u, iliq shimoliy chiroqlar zonasi, bildirishnoma nuqtasi va illyustratsiyaning yorqinligi — ko'k rangning hushyorligini buzadigan va nurga iliqlik qo'shadigan kehribar rang.
Neytral
- Obsidian Canvas
#303236— Sahifa foni, dominant sirt, deyarli qora rangda bo'lib, ozgina iliqlik hissi bilan ajralib turadi, bu barcha kontent uchun standart muhitdir. - Void
#090a0c— Asosiy ekrandagi gradientlar, modal fonlar va tuvalga mos kelishi kerak bo'lgan ramkalar uchun eng chuqur sirt qatlami. - Charcoal Card
#111111— Karton va panellardan yasalgan ko'tarilgan yuzalar, tuvaldan bir qadam yuqorida joylashgan. - Slate Edge
#4a4b50— Qorong'u yuzalardagi nozik chegaralar va ajratgichlar - Iron Veil
#6b6c6d— Teglar, ro'yxat elementlarini to'ldirish va o'chirib qo'yilgan to'ldirishlar uchun xira fon. - Smoke
#95979e— Belgilar konturlari, qo'shimcha matn va nofaol boshqaruv elementlari o'rta kulrang rangdagi asosiy ishchi element hisoblanadi.
Tipografiya
11 dan 80 pikselgacha · 8 qadam
- Inter — almashtirish: DM Sans · konturlar 300, 400, 500, 600, 700 · Foydalanuvchi interfeysidagi barcha funktsional matnlar — asosiy matn, navigatsiya, tugmalar, roʻyxat elementlari, yorliqlar va kichik sarlavhalar — taʼkidlash uchun 500–600 shrift qalinligi, asosiy matn uchun 400 va sezilmaydigan metamaʼlumotlar uchun kamdan-kam hollarda 300 shrift qalinligida ishlatiladi.
- Esbuild — almashtirish: Sora · konturlar 400, 500, 600 · Faqat ko'rsatish: splash sarlavhalari, bo'lim sarlavhalari va MetaBrain maqola sarlavhalari. Qisqartirilgan geometriya va tor harflar oralig'i SaaS loyihalariga qaraganda 84px tahririyat ishlari uchun ko'proq mos keladi degan taassurot qoldiradi. Hech qachon 28px dan past o'lchamlardan foydalanmang.
Intervallar va shakl
| Maqsad | Ma'nosi |
|---|---|
| Zichlik | keng |
| Asosiy qadam | 12px |
| Tugma radiusi | 9999px |
| Karta radiusi | 12px |
| Soyalar | yumshoq soyalar |
| Bo'limlar orasida | 96px |
| Sahifa kengligi | 1200px |
Sun'iy intellekt veb-saytingizni Huly 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
- monday — Pastel stikerlar bilan oq ustaxona
- Slack — Sahna baqlajon rangida, oq yorug'lik chiroqlari bilan bezatilgan. Qorong'u joylarda to'q olxo'ri rangi hukmronlik qiladi, oq rangdagi tuval esa katta, avangard asarlarga erkin nafas olish imkonini beradi.
- Base44 — Quyosh nuri tushgan, ohak markerli daftar
- Supahub — Binafsha rangli tizma ustidagi mayin kunduzgi yorug'lik. Asosan oq, havodor tuval, yorqin binafsha rangli quyosh bilan yoritilgan, dekorativ gradient sharlar salbiy makonga rang sochadi va keng yumaloq geometriya har bir yuzaga yoqimli, sezilarli og'irlik bag'ishlaydi.
- Raycast — Yarim tunda qo'mondonlik markazi, Coral Neon
- Dimension — muzlatilgan shisha panellar bilan qoplangan qorong'u yoritilgan ish joyi
- Wiza — Lavanda tumaniga burkangan, shom paytidagi minerallarni qidirish rasadxonasi.
- Paste — Oq marmar ustidagi kehribar chiroq — brendning iliq gradient logotipi ulkan oq makonda, qor bilan qoplangan binoning yagona yoritilgan derazasi kabi osilgan.
- Reworkd — Mahsulot diagrammasidagi yumshoq kunduzgi yorug'lik o'zi uchun gapiradigan yagona rang, bu harakat tugmasi va uning ustidagi gradient sarlavhasi.
- Reflect Notes — Yulduzli binafsha fazo - bu deyarli qora indigo bo'shlig'i fonida notalar yulduz turkumlari kabi suzib yuradigan qorong'u rasadxona.
- Ameba — Yarim tunda boshqaruv xonasi – muzlatilgan shisha panellar ichidagi elektr ko'k puls
- Todoist — Quyosh nuri tushgan ish maydoni, qog'oz kundalik – iliq krem rangli stol, siyoh yozuvlari, bitta qizil ruchka