Tasarım Araçları
Renk paleti üretin, WCAG kontrastını kontrol edin, PX'i REM'e çevirin ve CSS clamp() oluşturun.
Renk Paleti Oluşturucu
Uyumlu 5–8 renklik paletler üretin: rastgele, tamamlayıcı, analog, monokromatik veya üçlü.
Aracı açRastgele Renk Üretici
HEX, RGB ve HSL biçiminde rastgele renkler üretin; tek tek veya 50 adede kadar, pastel, canlı veya koyu.
Aracı açPX REM EM Dönüştürücü
Kök ve üst öğe yazı boyutlarınıza göre pikselleri rem ve em birimine (ve tersine) çevirin.
Aracı açWCAG Kontrast Kontrolü
Metin ve arka plan renklerinin kontrast oranını WCAG AA ve AAA'ya göre kontrol edin.
Aracı açCSS clamp() Oluşturucu
Ekran genişliğine göre en küçük ve en büyük boyut arasında akışkan şekilde ölçeklenen CSS clamp() değeri oluşturun.
Aracı açAltın Oran Hesaplayıcı
Bir uzunluğu altın orana (φ ≈ 1,618) göre bölün ve düzen ile tipografi için φ tabanlı ölçek oluşturun.
Aracı açRenk Skalası Oluşturucu (50–950)
Tek bir temel rengi CSS değişkenleri ve yapılandırma çıktısıyla Tailwind tarzı 50–950 ton skalasına dönüştürün.
Aracı açDokunma Alanı Boyutu Kontrolü
Buton veya bağlantı boyutunu WCAG 2.2, Apple HIG ve Material Design dokunma alanı önerilerine göre kontrol edin.
Aracı açUI ve web tasarımcıları için araçlar
Uyumlu renk paletleri oluşturun, tek bir marka renginden Tailwind tarzı 50–950 ton skalası türetin ve metin-arka plan renklerinin WCAG AA/AAA kontrast şartlarını karşılayıp karşılamadığını kontrol edin.
Duyarlı (responsive) tipografi
PX, REM ve EM birimleri arasında dönüşüm yapın; ekran genişliğine göre akışkan şekilde büyüyen yazı boyutları için CSS clamp() değerini otomatik hesaplayın.
Erişilebilirlik ve oran
Dokunma alanı kontrolü butonlarınızın mobilde rahat tıklanabilir boyutta olup olmadığını gösterir; altın oran hesaplayıcı düzen ve tipografi ölçekleri için uyumlu ölçüler üretir.