Ui
mat kağıda klinik plan
shadcn/ui, tek renkli bir tasarım sistemi oluşturmak için bir atölye çalışmasıdır: temiz beyaz bir tuval, yumuşak sıcak gri yüzeyler ve en ince sınırlara yerleştirilmiş geniş yarıçaplı kartlar. Arayüz neredeyse tamamen renksizdir—siyah metin, beyaz yüzeyler, gri ikincil tonlar—ve yalnızca hata durumları için ayrılmış tek, dikkat çekici bir kırmızı renkten oluşur. Tipografi, Geist'in ekranlarda dar harf yüksekliğiyle geometrik tarafsızlığına dayanır ve tüketici ürününden ziyade geliştirici altyapısına benzeyen sakin, kod benzeri bir his yaratır.
Minimal görseller—sistem neredeyse tamamen kullanıcı arayüzünden oluşuyor. Hiçbir önemli fotoğraf, illüstrasyon veya dekoratif grafik yok. Ürün demoları, hem dokümantasyon hem de görsel içerik görevi gören bir ızgarada bileşen maketleri (kartlar, giriş alanları, düğmeler) olarak sunuluyor. Simgeler, işlevsel ipuçları olarak seyrek kullanılan, 1,5–2 piksel kalınlığında ince geometrik çizgilerdir (muhtemelen Lucide'den ödünç alınmıştır) ve #0a0a0a veya #737373 renklerindedir. Görsel dil, kullanıcı arayüzü bileşenlerinin kendisidir—sayfa, her görünür öğenin görünür bir tasarım öğesi olduğu canlı bir stil kılavuzu gibi işlev görür.
Palet
Doğal
- Canvas
#f5f5f5— Sayfa arka planı, soluk yüzey dolgusu, ek düğmeler. - Paper
#ffffff— Kart yüzeyleri, açılır arka planlar, ana düğme dolguları - Surface Alt
#fafafa— Kenar çubuğu arka planı, göze batmayan kart seçeneği, giriş alanının bekleme durumu. - Ink
#0a0a0a— Ana metin, başlıklar, düğme etiketleri, simge çerçeveleri. - Ink Soft
#171717— Düğme arka plan resimleri, dolgu ve açık yüzeylerde ek metin. - Mid Gray
#737373— Ana metin, yer tutucu metin, yardımcı etiketler ve simgelerin dolgu renkleri bekleme modundayken soluklaştırılmıştır.
Tipografi
12 ila 48 piksel arası · 8 adım
- Geist — yenisiyle değiştirme: Inter · ana hatlar 400, 500, 600 · Tüm arayüz metinleri; gövde metni 14px/400 satır kalınlığına, başlıklar 24–48px/600 satır kalınlığına ve düğmeler 13–14px/500 satır kalınlığına sahiptir. Geist'in geometrik harf biçimleri ve tekdüze satır kalınlığı, geliştirici araçları için nötr bir his yaratır; 48px harf aralığı ve -0.05em harf aralığı ile 600 satır kalınlığı, düzenlenmiş gibi değil, düşünülmüş gibi görünen net ve kendinden emin başlıklar sağlar.
Aralıklar ve biçim
| Amaç | Anlam |
|---|---|
| Yoğunluk | yoğun |
| Temel adım | 8px |
| Düğme yarıçapı | 18px |
| Kart yarıçapı | 24px |
| Gölgeler | hayır - gölgeler yerine kenarlıklar |
| Bölümler arasında | 48-80px |
| Sayfa genişliği | 1280px |
Yapay zeka, web sitenizi Ui tarzında oluşturacak ve içeriğini dolduracak.
- Ürünlerinizi ve gönderilerinizi aşağıdaki bağlantılar aracılığıyla paylaşın: Instagram, TikTok, Facebook.
- Eski sitenizdeki içeriği aktarın; sadece adresi belirtmeniz yeterli.
- En iyi motor üzerinde modern tasarım: Sunucu tarafı işleme ve SEO optimizasyonu özellikleriyle birlikte React ( Next.js).
- Arama sonuçları için tamamen otomatik SEO optimizasyonu ve sinir ağı tabanlı öneriler.
Benzer stiller
- Ventriloc — Sıcak kağıt üzerindeki verilerin editoryal gözlem evi - tek bir turuncu kor, tek renkli hassasiyeti vurguluyor.
- Geniestudio — Yumuşak gün ışığı tonlarında bir defter—geniş kenar boşlukları ve tek kalın kalem darbesiyle aydınlanan türden.
- xAI — Sıcak Krem Laboratuvarı Siyah Hap ile
- Cal — Tek renkli pratiklik, insancıl bir yaklaşım. Sıkı bir siyah-beyaz palet aracılığıyla netliği ve işlevselliği önceliklendiren, ancak bunu samimi tipografi ve yuvarlak şekillerle yumuşatan bir sistem.
- Scale — Müze kalitesinde yüksek kaliteli bir fotoğraf laboratuvarı ile teknik bir projenin birleşimi
- Contractbook — Deniz mavisi bir gökyüzünün altında krem rengi kağıttan yapılmış sözleşmeler
- AutoSend — Tek bir mor ışıkla aydınlatılmış, taştan yapılmış, samimi bir stüdyo; burada serif yazı tipleri ve parlak indigo renkli eylem çağrıları, sessiz, neredeyse beyaz bir mekânda bir arada bulunuyor.
- Air — "Camdan Gece Gökyüzü" heykeli
- SpatialChat — beyaz parşömen üzerinde mor nabız
- Squarespace — Sinematik Tek Renkli Galeri
- Giga — Buzlu obsidyen üzerinde gece ufku
- Supabase — Gece yarısı fosforlu yeşil bir noktaya sahip bir kod düzenleyici—kömür tozu denizinde tek bir kromatik nabız atışı