Geliştirici aracı tasarım sistemleri
Geliştirici aracı ve altyapı web sitelerinden çıkarılmış tasarım sistemleri: hosting, veritabanları, API'ler, IDE'ler ve DevOps ürünleri. Birçoğu koyu yüzeylere, monospace vurgulara ve birinci sınıf bileşen gibi tasarlanmış kod bloklarına dayanır; tipografileri sıkı ve tekniktir.
Bu kategoride 3 DESIGN.md örneği var. Kaynaklar: Neon, Railway ve Supabase. Her sitenin herkese açık sayfalarından çıkarıldı, resmi marka yönergeleri değildir. Bu formatı ilk kez mi duyuyorsun? DESIGN.md'nin ne olduğunu oku.
Neon
Neon'un tasarım sistemi, koyu temayı öncelikleyen bir geliştirici markası olarak, neredeyse siyah bir zemin (#000000, #18191b) üzerine kuruludur. Ana vurgu rengi canlı neon yeşil (#00e599), destekleyici renk ise orta tonlu yeşildir (#34d59a). Tipografi sisteminde arayüz ve gövde metinleri için Inter, kod ve veri gösterimleri için GeistMono kullanılır; her ikisinde de harf aralığı sıkı tutulmuştur. Boşluklar 4 piksellik temel ızgaraya göre belirlenir. Köşe yuvarlaklığı her yerde minimum düzeyde, 4 pikseldir. Yükseklik hissi gölgelerle değil, kenarlık kontrastıyla yaratılır; tek bir ortam gölgesi ise seyrek kullanılır. Hero bölümünde, veritabanı ve altyapı odaklı marka kimliğini pekiştiren, tam genişlikte animasyonlu bir veri görselleştirme arka planı yer alır.
Railway
Railway'in tasarım sistemi, derin, neredeyse siyah lacivert yüzeylere (#13111c, #0b0b0f) dayanan, karanlık temalı öncelikli bir geliştirici platformu arayüzüdür. Yüksek kontrastlı kırık beyaz metin (#f7f7f8) ve belirgin bir mor marka vurgusu (#853bce / #553f83) kullanır. Kahraman bölümünde editoryal bir ağırlık için IBM Plex Serif kullanılır; tüm arayüz metinleri Inter ile yazılır, kod alanlarında ise JetBrains Mono ve SF Mono tercih edilir. Yükseklik hissi gölge yerine, rgba(255,255,255,0.2) 1.5px inset beyaz parıltılı kenarlıklarla sağlanır; bu da arayüze cam panel estetiği kazandırır. Boşluk sistemi 4px temellidir ve 8/12/16/24/32 ritmiyle sıkı bir düzen izler. Köşe yuvarlaklıkları dar tutulur: baskın olan 4px'tir, kartlar ve kahraman kapsayıcılarında ise seçici olarak 8px ve 16px kullanılır.
Supabase
Supabase, koyu öncelikli bir tasarım sistemi kullanır; temel olarak neredeyse siyaha yakın derin bir arka plan (oklch ~0.19) ve canlı bir yeşil marka vurgusu (#3ecf8e / #3fcf8e) üzerine kuruludur. Düzen, duyarlı bir özellik kartı ızgarası etrafında yapılandırılmıştır; başlıklarda Manrope, gövde ve arayüz metinlerinde Inter kullanılır. Source Code Pro ise tüm sabit genişlikli yazı ve kod alanlarını karşılar. Renk sistemi, anlamsal adlandırılmış oklch özel özelliklerine dayanır. Kartlarda 12px köşe yuvarlaklığı ve ince kenarlık kullanılırken, düğmelerde 6–8px yuvarlaklık tercih edilir; genel yoğunluk orta düzeydedir ve 8px temel boşluk ızgarası esas alınır.
İhtiyacın olan siteyi göremiyor musun?
Herhangi bir URL yapıştır, her web sitesinden DESIGN.md al. Renkler, tipografi, boşluklar ve token'lar, AI iş akışına hazır.