Superhuman
panel editorial jam emas
Superhuman merentasi persimpangan fotografi editorial dan UI perisian—kanvas yang hangat seperti kertas perkamen (tidak pernah putih tulen) membingkai elemen penjenamaan merah marun dan aksen ungu yang bertenaga. Tajuk utama, yang ditetapkan dalam fon 460, berbisik dan bukannya menjerit, membolehkan fotografi sinematik halaman penuh melakukan kerja yang berat, manakala kad UI produk lut sinar terapung seperti kaca di atas imejan. Palet kekal tenang dan editorial hampir sepanjang masa: permukaan krim, teks arang, sempadan kelabu suam yang halus dan jarak yang luas antara elemen, dengan warna dikhaskan untuk tanda baca jenama yang disengajakan—satu seruan bertindak merah marun, pautan ungu, butang tambahan ungu muda. Sistem ini sengaja mengelakkan bayang-bayang dan kecerunan yang kuat pada permukaan UI; Kedalaman dicapai melalui fotografi berlapis dan kabur latar belakang yang halus dalam tajuk, dan bukannya melalui kesan susun atur.
Elemen utama ialah gambar lebar penuh dengan tajuk utama berpusat (48-64px/460) dan satu ajakan bertindak yang diisi dengan imej wain, dengan kad UI produk lut sinar terapung yang dilapisi pada tepi kiri dan kanan. Di bawah elemen utama ialah jalur logo jalur putih (6 sel setiap baris, lebar maksimum terhad), kemudian bahagian tab dengan permukaan kad putih pada kanvas kertas. Jalur firus gelap memecahkan rentak kira-kira dua pertiga daripada keseluruhan halaman—lebar penuh, dua lajur (imej di sebelah kiri, teks di sebelah kanan)—mencipta satu-satunya kontras ton semasa anda menatal. Jalur atmosfera kecerunan menyusul. Jarak menegak antara bahagian ialah 64-96px. Lebar kandungan maksimum ialah ~1200px berpusat, dengan elemen utama dan jalur gelap merangkumi lebar penuh port pandangan. Navigasi ialah pengepala tetap tunggal dengan latar belakang kabur; tiada bar sisi, tiada menu mega. Pengaki ialah halaman burgundy lebar penuh dengan susun atur pautan berbilang lajur. Ritma keseluruhannya ialah: bingkai utama → kandungan putih/krim yang tenang → jalur gelap dengan imej utama → kecerunan atmosfera → pengaki burgundy, jalur terang dan gelap berselang-seli untuk mencipta tempo editorial.
Elemen visual utama ialah fotografi sinematik: potret lebar penuh berlatarbelakangkan langit terbuka berfungsi sebagai titik fokus, dengan jalur atmosfera kedua diletakkan di bahagian bawah halaman. Imej tersebut ditonasikan dengan hangat, diredamkan secara halus, dan dirakam dalam profil, mengingatkan pada saat keemasan, mewujudkan nuansa editorial daripada korporat. Jalur gelap dengan segi empat tepat geometri lut sinar dan tulisan tangan ditumpangkan di atas gambar seorang lelaki yang sedang berfikir—kolaj permukaan dan bukannya satu imej. Antara muka pengguna dibentangkan sebagai kad kaca terapung yang ditumpangkan terus pada gambar, dan bukannya sebagai tangkapan skrin yang berasingan. Tiada ilustrasi stok, tiada pemaparan 3D, dan tiada bentuk hiasan abstrak, kecuali jalur atmosfera kecerunan. Ikonnya ialah ikon garisan monokrom minimalis, ~16-20px lebar, dengan lebar tunggal yang sepadan dengan berat teks 460 titik.
Palet
Jenama
- Midnight Wine
#421d24— Butang tindakan utama, iklan sepanduk dan pengaki berwarna burgundy yang hangat dan hampir hitam yang terasa lebih seperti dakwat daripada merah, menepati palet warna tanpa terlalu menonjol. - Royal Violet
#714cb6— Ungu digunakan untuk menyerlahkan pautan, tag dan frasa pendek. Ia tidak boleh digunakan sebagai warna utama untuk seruan bertindak.
Neutral
- Lilac Mist
#d4c7ff— Isian permukaan sekunder, ikon cahaya dan latar belakang butang hantu semuanya menampilkan warna ungu kabur yang mengisyaratkan gaya jenama tanpa menarik perhatian yang tidak wajar kepada dirinya sendiri. - Deep Lagoon
#0c4243— Latar belakang gelap untuk jalur tersebut, yang digunakan sebagai elemen naratif utama, merupakan satu-satunya permukaan gelap dalam sistem, digabungkan dengan corak geometri yang bertindih. - Warm Parchment
#f2f0eb— Permukaan kerja halaman merupakan elemen dominan; warna krim hangat menggantikan putih sebagai asas, memberikan kehangatan editorial kepada seluruh sistem. - Soft Mist
#e3e3e2— Sempadan halus, garisan kad, garisan pembahagi—kelabu cerah yang hangat yang sebati dengan kertas kulit tetapi mendefinisikan tepinya dengan jelas. - Ink Charcoal
#292827— Teks isi, tajuk, garisan ikon - warna yang hangat, hampir hitam dengan warna coklat yang cukup untuk terasa seperti dakwat di atas kertas, tidak pernah sejuk #000 - Stone Gray
#666666— Salinan badan sekunder, teks sokongan, penerangan tersembunyi - satu teks kelabu sederhana, digunakan dengan berhati-hati supaya tidak pernah bersaing dengan teks utama.
Tipografi
dari 12 hingga 64px · 8 langkah
- Super Sans VF — penggantian: Inter (closest open equivalent for variable weight range) · garis besar 460, 500, 540, 600, 700 · Satu fon dalam keseluruhan sistem. Pembolehubah paksi merangkumi julat dari 460 (fon tandatangan, sedikit dipotong untuk semua teks tajuk besar) hingga 540 (teks isi yang ditekankan) dan 700 (kapsyen kecil dan tebal). VF yang direka khas menjadikan tajuk berwajaran 460 kelihatan lebih disengajakan daripada tidak teratur—pada 48-64px dengan jarak huruf yang ketat, kesan "sedikit dipotong" dianggap sebagai yakin dan bukannya nipis.
Selang dan bentuk
| Tujuan | Maksudnya |
|---|---|
| Ketumpatan | padat |
| Langkah asas | 8px |
| Jejari butang | 16px |
| Jejari kad | 16px |
| Bayang-bayang | tiada - sempadan dan bukannya bayang-bayang |
| Antara bahagian | 64-96px |
| Lebar halaman | 1200px |
AI akan membina laman web anda dalam gaya Superhuman dan mengisinya
- Isi dengan produk dan siaran melalui pautan - Instagram, TikTok, Facebook.
- Pindahkan kandungan dari tapak lama anda—cuma nyatakan alamatnya.
- Reka bentuk moden pada enjin terbaik: React ( Next.js) dengan pemaparan pelayan dan pengoptimuman SEO sedia ada.
- Pengoptimuman SEO automatik sepenuhnya untuk hasil carian dan cadangan rangkaian saraf.
Gaya yang serupa
- AI for Business — Bilik pameran editorial Brutalist dalam warna kelabu hangat
- Jeton — Editorial tentang fintech pada marmar hangat
- Airtable — Seminar yang selesa dengan bab-bab yang ditanda dalam pelbagai warna
- Osmo — Muzium Pemaju Konkrit Kelabu
- Linktr — Poster editorial disusun seperti gula-gula. Laman web ini direka bentuk dalam blok warna, dengan tajuk utama hijau terang yang diletakkan di dinding biru kobalt, dan elemen navigasi berbentuk pil putih terapung di atas padang burgundy.
- Outsource Consultants — Helaian seni bina format besar di atas kertas tulang. Estetika monografi, di mana satu tompokan indigo yang terang mengganggu grid yang hangat dan maksimalis secara tipografi.
- Streamtime — Papan Mood Kreatif Taktil - Meja Buku Skrap Pereka
- Switch-Lit — Grid editorial dicetak dengan dakwat pada kertas krim
- HubSpot — Warna kertas krim hangat dengan aksen oren tunggal. HubSpot menyerupai majalah pereka yang dicetak pada kertas tebal—tajuk utama serif, halaman krim hangat dan aksen oren berapi tunggal yang hanya menonjolkan perkara yang paling penting.
- Granola — Nota lapangan pada vellum suam—Granola berbunyi seperti buku nota Moleskine usang yang dibuka di atas meja yang disinari cahaya matahari: tajuk serif memberikan rasa kekukuhan, aksen hijau organik seperti dakwat berasaskan tumbuhan dan garisan halus di margin kad yang menyerupai nota tulisan tangan.
- Secure — Perbualan di kafe Eropah pada waktu siang yang lembut merupakan pendekatan panggilan video yang mesra dan bergaya, di mana tajuk utama berhuruf serif dibaca seperti artikel majalah yang bernas dan bukannya halaman produk teknologi.
- Mockups made easy — Studio reka bentuk editorial di atas kertas putih