Stripe
Buku akaun yang ditulis dengan dakwat indigo pada kaca berkabut
Stripe menggunakan bahasa yang hampir monokrom untuk instrumen kewangan: kanvas putih lembut dan sejuk dengan tajuk biru gelap, hampir tiada elemen krom hiasan, dan satu indigo terang (#533afd) yang boleh digunakan secara sah sebagai butang, pautan atau garis luar ikon. Tipografinya sangat nipis, dengan berat 300 mata—walaupun pada 56px—yang terasa terlalu ringkas dan bukannya korporat secara terang-terangan; jarak huruf berkurangan mendadak dengan peningkatan saiz. Butangnya kecil, segi empat sama (4px), dan menggunakan isian ungu atau garis luar ungu paling nipis. Sistem ini mengelakkan bayang-bayang sepenuhnya; kedalaman dicapai melalui perubahan rona latar belakang (putih → #f8fafd → #e5edf5 → rona ungu), dan bukannya melalui ketinggian. Keseluruhan antara muka bertindak seperti lejar perakaunan atau terminal: maklumat yang padat, garisan yang jelas, ruang yang luas antara bahagian dan warna hanya muncul apabila tindakan diperlukan.
Lebar maksimum ialah ~1320px untuk lajur kandungan berpusat pada kanvas putih. Wira ialah blok teks sejajar kiri pada saiz penuh (56px) dengan dua seruan bertindak di bawah, tiada imej wira—tipografi ADALAH wira. Bahagian disusun secara menegak dengan talang 96px yang sama dan pembahagi 1px #e5edf5; tiada jalur gelap/terang berselang-seli. Setiap bahagian mengikuti corak berulang: tajuk bahagian kecil dalam huruf besar semua (warna berasap, 12px), kemudian tajuk 32-48px, kemudian perenggan 22px, kemudian grid kad produk (3 lajur pada desktop) atau blok teks 2 lajur dengan seni visual. Logo klien muncul dalam jalur menegak sempit, sejajar kiri. Pengaki ialah satu jalur #f8fafd lebar dengan senarai pautan berbilang lajur. Ritma keseluruhan adalah perlahan, terukur dan kebanyakannya teks—ketumpatan maklumat adalah rendah, walaupun panjang tatal panjang.
Imejnya terkawal dan bergaya dokumentari. Foto halaman penuh hanya muncul dalam bahagian yang menampilkan kajian kes (cth., fotografi trafik udara untuk Hertz), yang diambil dari atas atau pada sudut dramatik, menggunakan warna semula jadi—tiada duoton atau pemprosesan warna. Tangkapan skrin antara muka pengguna produk digunakan dalam kad ciri, yang dipamerkan dengan sudut tajam dan sempadan yang jelas, tanpa bingkai peranti. Logo rakan kongsi dipaparkan dalam warna mereka sendiri, tanpa sebarang bekas. Tiada ilustrasi, pemaparan 3D atau elemen grafik abstrak hiasan. Ikon adalah seragam: pemberat baris 1, pemberat baris 2 pada latar belakang putih, dengan seni garis geometri (chevron, anak panah, tanda semak, simbol dokumen). Halaman ini terutamanya terdiri daripada teks dan ruang putih; imej menempati kurang daripada 3% daripada jumlah kawasan visual.
Palet
Jenama
- Indigo Ink
#533afd— Ungu digunakan untuk butang yang diisi, keadaan navigasi yang dipilih dan momen penukaran berpandukan fokus. - Indigo Hover
#7389ff— Ungu digunakan untuk menyerlahkan pautan, tag dan frasa pendek. Ia tidak boleh digunakan sebagai warna utama untuk seruan bertindak.
Neutral
- Midnight Ink
#061b31— Tajuk utama dan teks badan berwarna gelap, hampir hitam dengan warna biru sejuk, yang berfungsi sebagai asas untuk keseluruhan sistem fon. - Slate
#64748d— Teks kelabu menyerlahkan pautan, teg dan frasa pendek. - Steel
#50617a— Teks tambahan dan bahan sokongan diletakkan di antara ton batu tulis dan ungu lembut yang digunakan pada sublesen. - Smoke
#839bc8— Untuk tajuk hiasan yang besar dan teks iringan, warna ungu yang disenyapkan digunakan - tidak sekali-kali dalam perenggan isi. - Pure White
#ffffff— Kanvas halaman dan permukaan kad yang ditinggikan; latar belakang lalai yang menjadi asas pengukuran semua perkara lain. - Mist
#f8fafd— Latar belakang pengaki dan pembahagi bahagian ialah warna sejuk halus yang memisahkan kawasan tanpa sempadan yang kelihatan.
Tipografi
dari 12 hingga 56px · 9 langkah
- sohne-var — penggantian: Inter Tight (variable · garis besar 300, 400 · Satu-satunya fon yang digunakan dalam keseluruhan antara muka adalah untuk tajuk, teks isi, navigasi, butang dan label. Wajaran 300 diutamakan walaupun pada saiz skrin 56px, yang merupakan ciri tersendiri: tajuk berbisik dan bukannya menjerit, mewujudkan autoriti melalui pengekangan dan bukannya kelantangan. Wajaran 400 hanya muncul pada 14–16px untuk navigasi dan teks butang, di mana coretan tambahan diperlukan untuk keterbacaan pada saiz yang lebih kecil.
Selang dan bentuk
| Tujuan | Maksudnya |
|---|---|
| Ketumpatan | luas |
| Langkah asas | 8px |
| Jejari butang | 4px |
| Jejari kad | 4px |
| Bayang-bayang | tiada - sempadan dan bukannya bayang-bayang |
| Antara bahagian | 96px |
| Lebar halaman | 1320px |
AI akan membina laman web anda dalam gaya Stripe 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
- Ui — pelan klinikal pada kertas matte
- monopo saigon — Cahaya cair berwarna-warni di sebalik kesunyian editorial—galeri editorial monokrom yang terapung di atas cahaya cair
- Ventriloc — Sebuah balai cerap editorial data pada kertas suam - sebatang bara oren tunggal yang menonjolkan ketepatan monokrom
- Hyer Aviation — Senja di kokpit di atas kertas perkamen. Langit subuh yang pucat bertemu dengan logo serif bersaiz fiuslaj, dan satu aksen tanah liat yang hangat memecahkan kekangan monokrom.
- Family — Sebaran daripada kisah dongeng di atas kulit kertas krim
- OFF+BRAND. — Sfera berwarna-warni pada kertas kulit yang hangat
- Geniestudio — Buku nota siang yang lembut—jenis dengan margin yang lebar dan satu coretan pen yang tebal
- xAI — Makmal Krim Hangat dengan Pil Hitam
- Seed — organisma hidup di bawah kaca makmal
- Cosmos — Dinding galeri yang dilapisi linen dan digantung dengan Polaroid
- Cal — Kepraktisan monokrom, pendekatan manusia. Sistem yang mengutamakan kejelasan dan fungsi melalui palet hitam putih yang ketat, tetapi melembutkannya dengan tipografi yang mesra dan bentuk bulat.
- T1 Energy — Lukisan kemudahan pengeluaran pada kulit kertas yang hangat merupakan pemandangan monokrom yang tenang di mana skala perindustrian dan tipografi halus merangkumi keseluruhan jenama.