Huly
Cahaya Utara di Observatorium Tengah Malam - protagonisnya adalah seberkas cahaya vertikal berwarna ungu yang memudar menjadi warna koral, dan setiap bagian tenang di bawahnya meminjam cerita dua warna yang sama yang diceritakan dengan nada yang lebih lembut.
Huly membangkitkan suasana ruang kerja kosmik: kanvas hampir hitam dengan satu cahaya ungu-kuning yang menembus elemen utama, dan di bawahnya, grid yang lebih redup untuk meningkatkan produktivitas. Sistem ini beroperasi dalam rentang warna yang sempit—satu warna biru terang dan satu warna koral melakukan semua pekerjaan branding pada permukaan grafit berlapis, sehingga mode gelap tidak pernah terasa netral. Tipografi menggunakan gaya Inter untuk semua fungsi, dengan font khusus (Esbuild) yang dikhususkan untuk poin-poin penting, dengan jarak antar huruf 80–84px dan spasi huruf negatif yang agresif. Komponen berbentuk kapsul: radius 9999px pada kontrol, 12px pada kartu, bayangan minimal, dan garis gradien bercahaya sebagai dekorasi utama. Halaman bergantian antara area gelap halaman penuh dan bagian terang yang tenang, jadi setiap layar baru harus menentukan mode sebelum memilih warna.
Halaman beranda lebar penuh menampilkan sorotan vertikal aurora borealis dan judul yang rata kiri, bersama dengan tangkapan layar produk yang ditempatkan di kanan bawah. Di bawah halaman beranda terdapat area konten dengan lebar maksimum 1200px, dengan garis-garis gelap dan terang yang berselang-seling. Setiap bagian merupakan satu blok vertikal: sebuah header ditambah grid kartu 3 atau 4 kolom yang dipisahkan oleh jarak 96px. Bagian "MetaBrain" memecah grid dengan judul yang berada di tengah dan mosaik kartu dengan berbagai ukuran (kartu utama besar ditambah kartu pendukung yang lebih kecil). Halaman ini kaya akan konten, mengikuti standar SaaS, tetapi menggunakan garis-garis gelap dan terang yang berselang-seling untuk memberi ruang bagi setiap bagian. Navigasinya berupa bilah atas transparan tunggal yang memudar menjadi buram saat Anda menggulir.
Elemen utamanya adalah gradien aurora murni, tanpa foto. Semua ilustrasi adalah tangkapan layar aktual dari UI produk (Kanban dalam mode gelap, kotak masuk, kalender), dibingkai dalam bingkai kartu yang berfungsi sebagai bukti dan dekorasi. Tidak ada foto gaya hidup, tidak ada gambar stok, tidak ada render 3D. Satu-satunya elemen visual yang tidak terkait dengan UI adalah cahaya hangat berbentuk sinar matahari radial di dasar aurora, yang dirender sebagai gradien CSS. Ikon berupa ikon garis monokrom dalam warna #95979 atau putih, tidak pernah multiwarna. Sistem memperlakukan UI gelapnya sendiri sebagai elemen utama—produknya adalah foto-foto tersebut.
Palet
Merek
- Electric Iris
#5683da— Latar belakang utama, indikator navigasi aktif, dan aksen Aurora Borealis yang mencolok—warna biru-ungu yang cerah pada latar belakang hitam pekat—menciptakan kesan keterlibatan daripada aktivitas perusahaan. - Ember Pulse
#ff8964— Aksen sekunder, zona aurora borealis yang hangat, titik pemberitahuan, dan sorotan ilustrasi—warna kuning keemasan yang memecah keseriusan warna biru dan menambahkan kehangatan pada pancaran cahaya.
Netral
- Obsidian Canvas
#303236— Latar belakang halaman, permukaan yang dominan, berwarna hampir hitam dengan sedikit sentuhan kehangatan, lingkungan standar untuk semua konten. - Void
#090a0c— Lapisan permukaan terdalam untuk gradien pada layar utama, latar belakang modal, dan bingkai yang harus menyatu dengan kanvas. - Charcoal Card
#111111— Permukaan yang ditinggikan terbuat dari karton dan panel, diposisikan satu langkah di atas kanvas. - Slate Edge
#4a4b50— Batas dan pembatas yang halus pada permukaan gelap - Iron Veil
#6b6c6d— Latar belakang redup untuk tag, isian item daftar, dan isian yang dinonaktifkan. - Smoke
#95979e— Garis luar ikon, teks tambahan, dan kontrol yang tidak aktif adalah elemen kerja utama dalam warna abu-abu sedang.
Tipografi
dari 11 hingga 80px · 8 langkah
- Inter — penggantian: DM Sans · garis besar 300, 400, 500, 600, 700 · Semua teks fungsional dalam antarmuka pengguna—teks isi, navigasi, tombol, item daftar, label, dan judul kecil—digunakan dengan bobot font 500–600 untuk penekanan, 400 untuk teks isi, dan 300 secara hemat untuk metadata yang tidak mengganggu.
- Esbuild — penggantian: Sora · garis besar 400, 500, 600 · Hanya untuk tampilan: judul pembuka, judul bagian, dan judul artikel MetaBrain. Geometri yang padat dan jarak antar huruf yang rapat menciptakan kesan bahwa 84px lebih cocok untuk pekerjaan editorial daripada proyek SaaS. Jangan pernah menggunakan ukuran di bawah 28px.
Interval dan bentuk
| Tujuan | Arti |
|---|---|
| Kepadatan | luas |
| Langkah dasar | 12px |
| Radius tombol | 9999px |
| Radius kartu | 12px |
| Bayangan | bayangan lembut |
| Di antara bagian-bagiannya | 96px |
| Lebar halaman | 1200px |
AI akan membangun situs web Anda dengan gaya Huly dan mengisinya.
- Isi dengan produk dan postingan melalui tautan - Instagram, TikTok, Facebook.
- Pindahkan konten dari situs lama Anda—cukup tentukan alamatnya.
- Desain modern pada mesin terbaik: React ( Next.js) dengan rendering sisi server dan optimasi SEO langsung dari awal.
- Optimasi SEO otomatis sepenuhnya untuk hasil pencarian dan rekomendasi jaringan saraf.
Gaya serupa
- monday — Bengkel putih dengan stiker warna pastel
- Slack — Panggungnya berwarna ungu terong dengan lampu sorot putih. Nuansa ungu tua mendominasi area gelap, sementara kanvas putih pucat memungkinkan judul-judul besar dan avant-garde untuk terlihat lebih leluasa.
- Base44 — Buku catatan yang diterangi sinar matahari dengan spidol hijau limau
- Supahub — Cahaya siang yang lembut di punggung bukit berwarna ungu. Kanvas yang sebagian besar berwarna putih dan lapang, diterangi oleh satu matahari ungu terang, dengan bola-bola gradien dekoratif yang menumpahkan warna ke ruang negatif dan geometri bulat yang luas memberikan setiap permukaan kesan berat yang menyenangkan dan nyata.
- Raycast — Pusat Komando Tengah Malam, Neon Karang
- Dimension — sebuah area kerja yang diterangi cahaya senja dengan panel kaca buram.
- Wiza — Observatorium eksplorasi mineral saat senja, diselimuti kabut berwarna lavender.
- Paste — Sebuah lentera berwarna kuning keemasan di atas marmer putih—logo gradien hangat merek tersebut melayang di ruang putih yang luas, seperti satu-satunya jendela yang diterangi di gedung yang tertutup salju.
- Reworkd — Cahaya siang yang lembut pada diagram produk adalah satu-satunya warna yang menonjol, begitu pula tombol aksi dan judul gradien di atasnya.
- Reflect Notes — Ruang ungu berbintang adalah observatorium gelap tempat not-not melayang seperti rasi bintang dengan latar belakang kekosongan nila yang hampir hitam.
- Ameba — Ruang kendali di tengah malam – denyutan biru elektrik di dalam panel kaca buram.
- Todoist — Ruang kerja yang diterangi sinar matahari dengan buku harian kertas – meja berwarna krem hangat, catatan tinta, satu pena merah.