Authkit
Katedral Kaca Buram di Tengah Malam
AuthKit menciptakan estetika presentasi produk di malam hari: kanvas hampir hitam dengan permukaan kaca buram, kisi-kisi garis yang hampir tak terlihat, dan teks bercahaya yang tampak diterangi oleh lapisan kaca. Jenis huruf hampir seluruhnya putih dengan latar belakang gelap, dengan satu aksen ungu terang sebagai satu-satunya elemen fungsional—setiap permukaan interaktif memiliki garis tipis lembut berwarna biru-putih dingin, bukan bingkai yang kaku. Komponen disusun pada lapisan transparan, dilapisi di atas cahaya sekitar, dan kartu-kartu tersebut tampak seperti lempengan kaca yang diterangi dari bawah, bukan panel kertas. Jarak antar elemen besar dan berirama; elemen utamanya adalah satu logo bercahaya yang membentang di seluruh lebar halaman, dikelilingi oleh kartu kaca yang mengambang, bukan tata letak layar terpisah tradisional.
Kanvas gelap lebar penuh dengan wadah konten yang terpusat, lebar maksimal 1200px. Elemen utama adalah logo tunggal yang terpusat dan bercahaya ("AuthKit" dalam font gradien) di bawah teks kecil berbentuk alis, di belakang/di bawahnya terdapat tiga kartu kaca mengambang dengan formulir login yang menyebar (kartu kiri miring ke kiri, kartu tengah diperbesar, kartu kanan miring ke kanan). Tombol pengalih tema terang/gelap terpusat di bawah elemen utama. Baris fitur adalah garis waktu horizontal berisi 6 ikon dengan garis penghubung tipis di antara ikon melingkar. Ritme bagian: setiap bagian dimulai dengan teks berbentuk alis yang terpusat dan dibingkai oleh garis horizontal yang memudar, diikuti oleh judul besar yang terpusat (44-48px), diikuti oleh satu baris teks isi yang redup (16-18px), lebar maksimal ~640px. Bagian Kustomisasi menampilkan maket jendela peramban dengan kartu login yang terletak di tengah, dikelilingi oleh panel pemeriksa UI mengambang (palet warna, penggeser radius, pemilih ikon logo, kolom teks tombol, kolom latar belakang halaman) yang diposisikan di sudut-sudut kanvas, seperti ruang kerja alat desain.
Desain visual didominasi oleh maket formulir login, yang dibuat dengan gaya "morfologi kaca" (kolom input email/kata sandi, tombol login media sosial, entri kode tanpa kata sandi), disajikan sebagai kartu transparan yang mengambang di atas kanvas gelap. Ikon fitur berupa glif linier monokrom dalam #d1e4fa di dalam ubin bulat matte. Kisi-kisi halus (garis 1px dalam rgba(186,215,247,0.06)) menutupi seluruh halaman, menciptakan suasana, sementara sorotan gradien kerucut berkilauan di bagian atas elemen utama. Tidak ada foto, tidak ada gambar gaya hidup, tidak ada tangkapan layar produk—produk itu sendiri adalah elemen visual: kolom login yang disusun seperti prototipe kaca di studio gelap.
Palet
Merek
- Void Violet
#663af3— Warna utama untuk tombol ajakan bertindak (CTA) adalah satu-satunya warna aksen yang digunakan secara eksklusif untuk tombol "Lanjutkan/Kirim" dalam formulir login; warna ungu yang cerah dengan latar belakang hampir hitam menciptakan kesan urgensi tanpa mengganggu skema warna monokromatik.
Netral
- Midnight Canvas
#05060f— Latar belakang halaman, permukaan terdalam kartu, isian lencana—dasar yang hampir hitam tempat segala sesuatu lainnya mengambang. - Steel Plate
#2f343e— Permukaan yang ditinggikan, tombol aksi semu/sekunder, lapisan panel belakang yang tersembunyi. - Fog Veil
#9da7ba— Teks utama, yaitu teks pada kartu, dapat dibaca, tetapi posisinya kurang menonjol dibandingkan dengan judul-judulnya. - Moon Mist
#c7d3ea— Teks utama, label tambahan, teks bantu yang diredam - Frost Glow
#d1e4fa— Warna isian utama untuk teks isi dan tautan, teks ikon, dan isian ikon adalah warna latar depan bercahaya default. - Ice Highlight
#d8ecf8— Teks terang pada permukaan gelap, label terbalik, dan judul dengan kontras tinggi. Jangan gunakan sebagai warna utama untuk ajakan bertindak; gradien judul—transisi halus dari biru muda ke biru lembut dari atas ke bawah—digunakan pada logo AuthKit dan judul-judul utama.
Tipografi
dari 12 hingga 48px · 8 langkah
- Untitled Sans — penggantian: Inter · garis besar 400, 500, 600, 700 · Teks utama, antarmuka pengguna, tombol, kolom input, ikon, judul kecil - font universal untuk semua fungsi.
- aeonikPro — penggantian: Space Grotesk · garis besar 400, 500 · Dengan hanya menampilkan judul—merek AuthKit, judul bagian, dan teks isi—ukuran font 500 poin dengan lebar 44-48px memberikan tampilan merek yang lebar dan bersahaja, bukan aksen yang mencolok.
- dotDigital — penggantian: JetBrains Mono · garis besar 400 · Teks huruf kapital semua ("Memperkenalkan," "Desain yang Dapat Diperluas," "Bersinar Terang") - teks huruf kapital semua dengan spasi 0,10em berfungsi sebagai pemisah halus antara teks isi dan judul.
Interval dan bentuk
| Tujuan | Arti |
|---|---|
| Kepadatan | luas |
| Langkah dasar | 16px |
| Radius tombol | 999px |
| Radius kartu | 16px |
| Bayangan | tidak - batas, bukan bayangan |
| Di antara bagian-bagiannya | 120px |
| Lebar halaman | 1200px |
AI akan membangun situs web Anda dengan gaya Authkit 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
- Resend — beludru hitam dengan warna neon ungu
- Gsap — Papan tulis animasi di sebuah studio desain. Dinding yang hampir hitam, kapur berwarna krem hangat, dan lima spidol berwarna—satu untuk setiap disiplin animasi.
- Slash — Ruang penyimpanan tengah malam dengan buku besar berlapis emas
- Raycast — Pusat Komando Tengah Malam, Neon Karang
- Dimension — sebuah area kerja yang diterangi cahaya senja dengan panel kaca buram.
- Modal — Terminal berpendar di ruang server yang gelap - satu-satunya sumber cahaya adalah warna hijau terang.
- Reflect Notes — Ruang ungu berbintang adalah observatorium gelap tempat not-not melayang seperti rasi bintang dengan latar belakang kekosongan nila yang hampir hitam.
- LaunchDarkly — Ruang Kontrol Neon adalah kokpit gelap tempat lampu ungu berdenyut menembus panel hitam pekat.
- Ameba — Ruang kendali di tengah malam – denyutan biru elektrik di dalam panel kaca buram.
- AgentQL — Cahaya aurora borealis di atas terminal pada malam hari.
- Neon — Ruang server setelah gelap. Kegelapan total, di mana satu-satunya cahaya berasal dari data dan interaksi pengguna.
- N8n — Workflow Engine at Midnight – sensasi kanvas otomatisasi waktu nyata di ruang server yang gelap, diterangi oleh indikator status dan aliran data.