Subframe
Gambar grafis di atas kertas perkamen hangat. Kertas desain, di mana setiap goresan adalah grafit atau penghapus, bukan cat—kedalaman dicapai melalui ketebalan garis dan serif yang jarang.
Subframe adalah ruang kerja desainer monokrom: kanvas hangat dan lembut, tinta hitam grafit, dan tanpa aksen warna sama sekali. Seluruh antarmuka dirasakan sebagai satu material—kertas, pensil, dan bayangan—dengan satu sentuhan tipografi yang berani: serif halus (Instrument Serif) yang dipadukan dengan sans-serif sistematis (Inter), memberikan bobot editorial pada judul. Permukaannya datar dan berbingkai, bukan timbul; kedalaman dicapai melalui pembatas tipis dalam #e5e7eb dan sorotan tersembunyi pada kontrol gelap, bukan bayangan. Kepadatannya cukup besar: ritme vertikal yang lebar (celah 48–64px antar bagian), tata letak terpusat dan lebar penuh, serta ruang kosong yang luas di sekitar teks. Satu-satunya warna adalah kontras antara hampir putih dan hampir hitam, menjadikan tombol gelap sebagai elemen paling mencolok di setiap halaman, dan deretan logo merek mitra dalam nada abu-abu sebagai satu-satunya elemen visual dekoratif.
Tata letak terpusat dan lebar penuh (1200px) dengan ritme vertikal yang lapang. Elemen utama adalah satu blok terpusat: kontrol gelap yang tersegmentasi di bagian atas, judul besar "Inter", subjudul satu baris, dan dua tombol yang berdekatan (terisi + transparan)—tanpa gambar samping, tanpa pemisah tata letak. Di bawah elemen utama terdapat garis logo abu-abu terpusat. Setiap bagian selanjutnya mengikuti pola yang sama: blok judul dan subjudul yang rata kiri, kemudian bingkai tampilan produk lebar penuh dengan ruang celah 48–64px di antara bagian-bagiannya. Navigasi minimal: bilah atas dengan tautan terpusat dan tindakan yang rata kanan, tanpa bilah samping, tanpa mega-menu. Halaman dibaca dari atas ke bawah sebagai serangkaian pernyataan terpusat, masing-masing diberi ruang yang cukup—tata letaknya terasa lebih seperti portofolio editorial daripada halaman produk yang ramai.
Desain visualnya minimalis dan fungsional. Sistem ini menggunakan dua mode visual: (1) tangkapan layar produk dan maket UI yang dibingkai dalam bingkai radius 24px—menampilkan komponen antarmuka sebenarnya (tabel, tombol, formulir) yang dirender dalam palet monokrom yang sama, membuat tangkapan layar tampak terintegrasi dengan mulus ke dalam halaman; (2) satu strip logo mitra skala abu-abu berfungsi sebagai bukti sosial, dirender datar, tanpa warna atau wadah. Tidak ada foto gaya hidup, gradien abstrak, atau render 3D. Satu-satunya elemen ilustratif adalah "ubin" produk gelap, berpusat pada latar belakang abu-abu hangat dengan ikon merek—ini dianggap sebagai demonstrasi produk, bukan dekorasi. Semua gambar menempati tata letak berbasis teks, di mana bobot visual ditanggung oleh teks.
Palet
Netral
- Page Canvas
#fafafa— Latar belakang halaman, kartu pos di atas kanvas, teks terang di permukaan gelap – warna putih hangat yang mendasari seluruh sistem monokrom. - Hairline Border
#e5e7eb— Pembatas, bingkai kartu, bingkai gambar, garis luar ikon - jenis garis luar yang paling sering digunakan dalam sistem, mendefinisikan struktur spasial. - Card Surface
#ededed— Latar belakang timbul untuk kartu, permukaan tambahan - terletak satu langkah di atas kanvas, menciptakan pengelompokan tanpa bayangan. - Divider Mid
#dadada— Pembatas nada tengah dan transisi antar bagian - Graphite
#242424— Warna netral kontras tinggi untuk tombol utama pada permukaan terang. - Ink Black
#171717— Teks isi, judul, garis luar ikon - sedikit lebih dingin daripada Graphite, digunakan untuk tipografi daripada permukaan.
Tipografi
dari 12 hingga 128px · 7 langkah
- Inter — penggantian: Inter (Google Fonts) · garis besar 500, 600, 700 · Antarmuka sistem sans-serif—navigasi, teks isi, tombol, subjudul, dan judul bagian. Ketebalan: 500 untuk teks isi dan kontrol, 600 untuk subjudul dan aksen navigasi, dan 700 untuk judul bagian. Spasi huruf negatif yang kuat memadatkan bentuk geometris pada ukuran apa pun, memberikan antarmuka tampilan yang ringkas dan teknis.
- Instrument Serif — penggantian: Playfair Display · garis besar 400 · Jenis huruf serif yang dirancang khusus untuk judul dan konten editorial. Bobot 400 dan spasi antar huruf -0,025em menciptakan tampilan elegan dan miring yang kontras dengan geometri industri Inter—teknik khasnya: satu kata atau frasa serif di dalam halaman sans-serif, berfungsi sebagai tanda baca visual dan bukan sebagai gaya judul.
- Fragment Mono — penggantian: JetBrains Mono · garis besar 400 · Accent mono digunakan untuk elemen mirip kode sebaris, label tag, dan keterangan teknis. Digunakan secara terbatas, aksen ini muncul dalam daftar fungsi dan anotasi sebaris di mana alat desain ingin menunjukkan "ini adalah keluaran mesin."
Interval dan bentuk
| Tujuan | Arti |
|---|---|
| Kepadatan | rata-rata |
| Langkah dasar | 8px |
| Radius tombol | 16px |
| Radius kartu | 24px |
| Bayangan | tidak - batas, bukan bayangan |
| Di antara bagian-bagiannya | 64px |
| Lebar halaman | 1200px |
AI akan membangun situs web Anda dengan gaya Subframe 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
- monopo saigon — Cahaya cair berkilauan di balik keheningan editorial—galeri editorial monokrom yang mengambang di atas cahaya yang meleleh.
- Hyer Aviation — Senja di kokpit di atas kertas perkamen. Langit fajar yang pucat bertemu dengan logo serif seukuran badan pesawat, dan satu aksen warna tanah liat hangat memecah kekangan monokrom.
- OFF+BRAND. — Bola berkilauan di atas kertas perkamen hangat
- Seed — organisme hidup di bawah kaca laboratorium
- Eindhoven Design District — Brutalisme editorial di atas kertas putih adalah manifesto desain kota, dieksekusi dengan huruf besar, fotografi minimal, dan pengekangan mutlak.
- Miranda — Tipografi klasik format lebar dengan latar belakang krem muda—sebuah editorial surat kabar untuk era digital.
- Monocle — Surat kabar berkualitas tinggi dengan format lebar di atas kertas berwarna krem. Editorial yang disusun dengan cermat, di mana setiap kolom layak mendapat tempatnya, dan hanya satu warna yang bermakna yang muncul di halaman.
- Agencja brandingowa — Galeri editorial dalam nuansa putih dengan tipografi yang dibuat dengan tinta hitam.
- Websmith Studio — Cahaya pagi di atas kertas krem.
- Aspelin Reitan — Arsip Arsitektur dengan Cahaya Lilin - Halaman ini tampak seperti portofolio ruang-ruang yang telah dibangun, dipajang di dinding krem hangat, dengan satu baris teks putih melayang di atas setiap gambar di seluruh lebar halaman.
- Public — Sebuah editorial monokrom di atas marmer dingin—hampir seperti kanvas monokrom, dengan font serif 300 poin dan satu aksen ungu yang melakukan semua pekerjaan warna.
- Motto — Sebuah monolit tipografi di atas kertas – sebuah suara tunggal dan percaya diri yang menyatakan dirinya di atas kertas seputih salju.