Cursor
Sebuah bengkel perkamen yang nyaman, diterangi oleh bara api yang menyala-nyala.
Cursor menggunakan tipografi yang hangat dan menyerupai kertas: kanvas yang lembut, teks hitam pekat, dan aksen oranye menyala tunggal yang mengaktifkan tautan dan pilihan, bukan mengisi tombol. Judul, yang diatur dalam CursorGothic dengan bobot 400, memiliki jarak antar huruf yang secara bertahap berkurang seiring bertambahnya ukuran—otoritas dicapai melalui pengekangan dan bobot huruf yang tipis, bukan melalui ketebalan. Permukaan tetap rata dan seperti kertas, dengan batas tipis dan bayangan abu-abu lembut dan hangat; sudut tetap tajam dengan bobot 4px di seluruh teks. EB Garamond digunakan secara selektif untuk subjudul dan prosa, sementara berkeleyMono menangani kode, tag, dan metadata, memberikan sistem kepribadian tipografi yang terasa lebih seperti majalah sastra daripada dasbor SaaS.
Lebar maksimum: 1300px terpusat, margin 24px. Navigasi atas: Header transparan setinggi 52px dengan logo dan tanda teks di sebelah kiri, 4 tautan navigasi terpusat, kelompok "Login / Kontak / Unduh" sejajar di sebelah kanan. Hero: Header sejajar kiri + blok ajakan bertindak ganda dengan teks yang membentang dari kiri atas, kemudian kartu mockup produk lebar penuh yang membentang di seluruh lebar halaman. Garis kepercayaan: Satu baris horizontal berisi 8 ubin logo dalam satu baris di sepanjang lebar bagian. Bagian fitur bergantian teks di sebelah kiri dan tangkapan layar di sebelah kanan dalam tata letak dua kolom, masing-masing 50/50, dengan ritme vertikal 64-96px di antara bagian-bagian tersebut. Semua tangkapan layar fitur adalah mockup jendela dengan gaya macOS yang identik. Footer: Kisi empat kolom tautan dengan tanda merek di sebelah kiri. Bagian-bagian tersebut dipisahkan oleh ruang bernapas yang cukup daripada pembatas - kanvas krem itu sendiri memberikan pemisahan.
Tangkapan layar produk menjadi pusat perhatian: maket jendela macOS besar yang menampilkan IDE Cursor beraksi: tab file, tampilan perbedaan, rencana agen, panel terminal, dan integrasi Slack/obrolan. Setiap maket jendela dibingkai dengan kartu #f2f1 dengan kontras lembut dan hangat. Foto lanskap yang redup (pegunungan/cakrawala gurun) membentang di luar bagian utama, menambahkan kehangatan tanpa bersaing dengan UI. Logo klien ( Stripe, OpenAI, Linear, Datadog, NVIDIA, Figma, Ramp, Adobe) disajikan sebagai huruf monokrom di dalam ubin Linen berbentuk pil. Tidak ada foto orang, ilustrasi, atau elemen grafis dekoratif abstrak—semua bobot visual difokuskan pada UI dan branding produk. Ikon berupa glif tipis dan monolinear yang diisi dengan #7a7974 Ash, tidak pernah berwarna.
Palet
Netral
- Ink
#26251e— Teks utama, latar belakang tombol aksi utama, teks navigasi - warna hangat, hampir hitam, tidak pernah murni #000 - Parchment
#f7f7f4— Latar belakang halaman, kanvas utama, adalah warna krem hangat yang melembutkan kontras dan menciptakan kesan pencetakan tinta, bukan pencetakan digital. - Bone
#f2f1ed— Permukaan kardus dan wadah yang ditinggikan, dengan warna satu tingkat lebih gelap dari kanvas, menciptakan efek "kertas di atas kertas" berlapis dan tanpa batas. - Linen
#e6e5e0— Warna netral terang sebagai pengisi untuk tombol pada permukaan gelap. - Stone
#cdcdc9— Garis tepi tipis, pembatas, partisi halus – garis 1px dalam warna hangat. - Mist
#a1a19f— Teks bantu tingkat ketiga, keterangan gambar - di antara teks yang diredam dan teks sekunder.
Tipografi
dari 12 hingga 72px · 6 langkah
- CursorGothic — penggantian: Inter · garis besar 400, 500 · Font utama untuk antarmuka pengguna, judul, navigasi, isi teks, dan desain produk. Judul dengan bobot 400 poin dan spasi antar huruf yang berkurang secara bertahap (-0,005em pada 22px → -0,03em pada 72px) adalah fitur khas font ini: judul tidak pernah dicetak tebal. Fungsi font ss08, ss09, dan tnum mengaktifkan alternatif gaya dan angka tabular.
- EB Garamond — penggantian: Iowan Old Style · garis besar 400, 500 · CursorGothic adalah jenis huruf serif editorial untuk subjudul individual, teks isi, dan data tabular, yang menambahkan sentuhan sastra pada antarmuka.
- berkeleyMono — penggantian: ui-monospace · garis besar 400, 500 · Monospace - untuk blok kode, cuplikan baris perintah, metadata, jalur file, dan label pengembang - sebuah bahasa teknis.
Interval dan bentuk
| Tujuan | Arti |
|---|---|
| Kepadatan | padat |
| Langkah dasar | 8px |
| Radius tombol | 4px |
| Radius kartu | 4px |
| Bayangan | tidak - batas, bukan bayangan |
| Di antara bagian-bagiannya | 64-96px |
| Lebar halaman | 1300px |
AI akan membangun situs web Anda dengan gaya Cursor 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
- Amplemarket — Tempat kerja yang bermandikan sinar matahari dan ditaburi konfeti.
- Getharvest — Sebuah meja kerja saat senja – kanvas berwarna krem hangat, kartu pos putih digantung di kanvas, dan nyala api oranye terang.
- Drive Capital — Poster perjalanan darat retro di atas kertas hangat.
- Wealthsimple — Gudang berlapis kasmir dengan pencahayaan galeri.
- Huddle — Kartu inventaris warna pastel di atas kertas krem.
- Fuser — Foto-foto Polaroid berserakan di dinding ruang kerja seorang desainer.
- Campsite — Meja kerja editor yang diterangi sinar matahari - kertas krem hangat dengan satu stempel oranye bertuliskan maksud tertentu.
- Redis Agency — Bengkel editorial, yang buka hingga larut malam, adalah tempat yang gelap gulita di mana semua pekerjaan branding dilakukan dengan menggunakan font serif dan sebuah lobak merah.
- AI Product Generation — Studio fotografi editorial di atas kertas putih - judul sebagai sampul, warna oranye untuk menyoroti bagian editorial.
- Getanchor — Nuansa terakota hangat di atas latar belakang krem yang pudar karena sinar matahari.
- Flatfile — Catatan data yang tenang di atas perkamen hangat.
- Inthememory — Gambar arsitektur di atas marmer putih dengan satu cahaya hangat. Ruang data editorial yang tenang di mana tinta biru kehijauan tua dan kontrol berbentuk pil melayang di atas permukaan putih bersih, hanya dipecah oleh percikan warna oranye.