Telegram, WhatsApp+380637610482
Valery Danyuk
Valery DanyukpembangunMembangunkan alatan AI untuk perniagaan. Berkualiti tinggi. Mampu milik.Hantar mesej di Telegram
Ui — pratonton tapak dalam gaya ini

Ui

pelan klinikal pada kertas matte

shadcn/ui ialah bengkel untuk mencipta sistem reka bentuk monokrom: kanvas putih bersih, permukaan kelabu suam yang lembut dan kad berjejari besar yang diletakkan pada sempadan yang paling halus. Antara mukanya hampir keseluruhannya akromatik—teks hitam, permukaan putih, ton sekunder kelabu—dengan satu warna merah yang mengganggu yang dikhaskan untuk keadaan ralat dan tiada yang lain. Tipografi bergantung pada peneutralan geometri Geist dengan ketinggian huruf yang ketat pada skrin, mewujudkan rasa tenang seperti kod yang lebih terasa seperti infrastruktur pembangun daripada produk pengguna.

Imej minimum—sistem ini hampir keseluruhannya terdiri daripada antara muka pengguna. Tiada foto utama, ilustrasi atau grafik hiasan. Demo produk dibentangkan sebagai mockup komponen (kad, medan input, butang) dalam grid, yang berfungsi sebagai dokumentasi dan kandungan visual. Ikon ialah garisan geometri nipis (kemungkinan dipinjam daripada Lucide) setebal 1.5–2px dalam #0a0a0a atau #737373, digunakan dengan berhati-hati sebagai isyarat berfungsi. Bahasa visual ialah komponen UI itu sendiri—halaman berfungsi sebagai panduan gaya hidup, di mana setiap elemen yang kelihatan ialah elemen reka bentuk yang kelihatan.

Palet

Neutral

  • Canvas #f5f5f5 — Latar belakang halaman, isian permukaan yang disenyapkan, butang tambahan.
  • Paper #ffffff — Permukaan kad, latar belakang timbul, isian butang utama
  • Surface Alt #fafafa — Latar belakang bar sisi, pilihan kad yang tidak mengganggu, keadaan medan input terbiar.
  • Ink #0a0a0a — Teks utama, tajuk, label butang, garis besar ikon.
  • Ink Soft #171717 — Imej latar belakang butang dengan isian, teks tambahan pada permukaan yang cerah.
  • Mid Gray #737373 — Teks utama, teks ruang letak, label tambahan dan isian ikon semasa rehat semuanya disenyapkan.

Tipografi

dari 12 hingga 48px · 8 langkah

  • Geist — penggantian: Inter · garis besar 400, 500, 600 · Semua teks antara muka—teks isi dengan pemberat baris 14px/400, tajuk dengan pemberat baris 24–48px/600 dan butang dengan pemberat baris 13–14px/500. Bentuk huruf geometrik Geist dan pemberat baris seragam mewujudkan nuansa neutral untuk alatan pembangun; pemberat baris 600 dengan jarak huruf 48px dan jarak huruf -0.05em memastikan tajuk yang jelas dan yakin yang kelihatan bernas dan bukannya disunting.

Selang dan bentuk

TujuanMaksudnya
Ketumpatanpadat
Langkah asas8px
Jejari butang18px
Jejari kad24px
Bayang-bayangtiada - sempadan dan bukannya bayang-bayang
Antara bahagian48-80px
Lebar halaman1280px

AI akan membina laman web anda dalam gaya Ui 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

  • Ventriloc — Sebuah balai cerap editorial data pada kertas suam - sebatang bara oren tunggal yang menonjolkan ketepatan monokrom
  • Geniestudio — Buku nota siang yang lembut—jenis dengan margin yang lebar dan satu coretan pen yang tebal
  • xAI — Makmal Krim Hangat dengan Pil Hitam
  • 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.
  • Scale — Makmal foto berkualiti tinggi seperti muzium yang digabungkan dengan projek teknikal
  • Contractbook — kontrak kertas krim di bawah langit ultramarin
  • AutoSend — Sebuah studio batu yang selesa dengan satu lampu ungu—di mana tajuk utama serif dan seruan bertindak indigo terang wujud bersama dalam satu ruang yang tenang, hampir putih.
  • Air — arca "Langit Tengah Malam Melalui Kaca"
  • SpatialChat — denyutan ungu pada kertas perkamen putih
  • Squarespace — Galeri Monokrom Sinematik
  • Giga — Ufuk tengah malam di atas obsidian berkabut
  • Supabase — Editor kod pada tengah malam dengan titik hijau berpendar—satu denyutan kromatik di lautan debu arang batu