digtools
🎨
color converter,

Color Converter & Palette

HEX, RGB, HSL, HSV, CMYK anında dönüştürün.Palet oluşturucu ve kontrast kontrolü içerir.

Gerçek Zamanlı Dönüşüm
5 format destekler
🎨
Renk Paletleri
Otomatik oluşturma
WCAG Uyumlu
Kontrast oranı kontrolü

Renk Seçici

217°
90%
60%
1.00

Renk Kodları

/* CSS Variables */
--color-primary: #3b82f6;
--color-primary-rgb: 59, 130, 246;
--color-primary-hsl: 217, 90%, 60%;

Renk Paleti


Kontrast Oranı

Beyaz Metin Aa

Ratio: -

AA AAA

Siyah Metin Aa

Ratio: -

AA AAA

Kaydedilen Renkler

Renkleri ⭐ kullanarak kaydedin (Maks 20)

about,

Dönüştürücü Hakkında

Renk Kodu Dönüştürücü ve Palet Oluşturucu, beş ana renk formatı arasında anında dönüştürme yapan ücretsiz bir çevrimiçi araçtır: HEX, RGB, HSL, HSV ve CMYK. Sezgisel bir renk seçiciye sahiptir ve seçiminize göre tamamlayıcı ve benzer renkler gibi renk paletlerini otomatik olarak oluşturur.

Ayrıca, web erişilebilirliği için önemli bir standart olan yerleşik bir WCAG kontrast oranı denetleyicisi içerir, böylece seçtiğiniz arka plan rengi için beyaz veya siyah metnin uygun olup olmadığını anında belirleyebilirsiniz. Oluşturulan kodlar tek tıklamayla kopyalanabilir ve ayrıca web tasarımcıları ve front-end geliştiricileri için geliştirme verimliliğini önemli ölçüde artıran CSS değişkenleri olarak dışa aktarılabilir.

how to,

Nasıl Kullanılır

ADIM 1

Renk Seçin veya Girin

Bir renk seçmek için renk seçicinin gradyan alanına tıklayın veya Ton ve Alfa kaydırıcılarını ayarlayın. Alternatif olarak, doğrudan HEX veya RGB alanlarına bir renk kodu girebilirsiniz.

ADIM 2

Dönüştürme Kodlarını Kopyalayın

Rengi herhangi bir yöntemle değiştirdiğinizde, tüm renk formatları (HEX, RGB, HSL, HSV, CMYK) gerçek zamanlı olarak güncellenir. Pano kaydetmek için her öğenin yanındaki "Kopyala" düğmesine tıklayın. CSS değişkenlerini de aynı anda kopyalayabilirsiniz.

ADIM 3

Palet ve Kontrastı Kontrol Edin

Tamamlayıcı ve monokromatik gibi renk varyasyonlarını görmek için alt kısımdaki "Renk Paleti" sekmesini değiştirin. "Kontrast Oranı" bölümünde, seçilen arka plan renginde beyaz/siyah metnin okunabilirliği otomatik olarak belirlenir.

glossary,

Renk Sözlüğü

HEX (Onaltılı Renk Kodu)
Web tasarımında en yaygın kullanılan renk belirtim formatı. Kırmızı (R), Yeşil (G) ve Mavi (B) yoğunluğunu onaltılık (00-FF) olarak belirterek "#RRGGBB" (veya 3 haneli "#RGB") olarak 6 basamaklı ifade edilir. Saydamlık eklenirken, "#RRGGBBAA" olarak 8 basamaklı yazılır ve CSS ve HTML'de geniş çapta desteklenir.
RGB / RGBA
Işığın ana renklerine (Kırmızı, Yeşil, Mavi) dayalı toplamalı bir renk modeli. Ekranların renk oluşturma prensibine dayanarak, her renk 0'dan 255'e kadar bir değerle temsil edilir. CSS'de "rgb(255, 0, 0)" şeklinde yazılır ve "rgba" ile sonuna 0.0 ile 1.0 arasında bir alfa değeri (saydamlık) eklenebilir.
HSL
Rengi üç özellikle temsil eden bir model: Ton (Hue), Doygunluk (Saturation) ve Parlaklık (Lightness). "Renk tonunu değiştirme" veya "daha koyu yapma" gibi sezgisel olarak ayarlamak kolay olduğundan, CSS (hsl işlevi) ve dinamik tema değişiklikleri kullanarak tasarım sistemleri oluşturmak için son derece uygundur.
CMYK
Dört renk kullanan çıkarmalı bir renk modeli: Camgöbeği, Macenta, Sarı ve Anahtar (Siyah). Esas olarak baskı endüstrisinde kullanılan bir mürekkep formatıdır ve bir tarayıcıdaki CMYK değerleri yaklaşık teorik değerlerdir, bu nedenle gerçek baskı için profiller aracılığıyla ayarlamalar gereklidir.
Kontrast Oranı (WCAG)
Web Erişilebilirlik Yönergeleri tarafından tanımlanan, arka plan rengi ile metin rengi arasındaki bağıl parlaklığın oranı. Tüm kullanıcıların metni okuyabilmesini sağlamak için, normal metin için "4.5:1 (AA seviyesi)" veya daha yüksek, büyük metin için "3:1" veya daha yüksek bir oran önerilir.
faq,

Sık Sorulan Sorular

Q.Baskı için CMYK dönüşüm sonuçları doğru mu?
Tarayıcıda hesaplanan CMYK değerleri yaklaşık teorik değerlerdir. Gerçek basılı renkler, yazıcınızın ICC profiline ve mürekkep özelliklerine bağlı olarak değişebilir. Baskı için doğru CMYK verileri elde etmek için, Adobe Illustrator veya Photoshop gibi renk yönetimi yazılımlarını kullanarak dönüştürün ve doğrulayın.
Q.Araç alfa (saydamlık) dönüşümünü destekliyor mu?
Evet, destekliyor. Renk seçicideki "Alfa" kaydırıcısını ayarlayarak veya alfa değerini doğrudan koda girerek, HEX (#RRGGBBAA), RGBA ve HSLA kodları doğru bir şekilde üretilecektir. Bu, saydamlık gerektiren modern Web UI uygulamaları için idealdir.
Q."CSS Değişkenlerini Kopyala" özelliği nedir?
Bu özellik, seçilen rengi CSS özel özellikleri (CSS Değişkenleri) olarak çıkarır. RGB ve HSL için virgülle ayrılmış değerlerle birlikte --color-primary: #3b82f6; gibi biçimler oluşturarak Tailwind CSS yapılandırmalarını veya dinamik temaları kurmayı son derece kolaylaştırır.
Q.Girdiğim renk verileri bir sunucuya kaydediliyor mu?
Hayır. Bu araç tamamen istemci tarafında (tarayıcınızın içinde) çalışır. Renk kodlarınızın veya oluşturulan paletlerinizin hiçbiri harici sunuculara iletilmez veya kaydedilmez. "Favoriler" özelliği de renkleri yalnızca tarayıcınızın yerel depolama alanına kaydederek gizliliğinizi sağlar.
use cases,

Kullanım Senaryoları

🎨

Web Tasarımı ve Kodlama

Figma veya XD gibi tasarım araçlarında belirtilen HEX kodlarını geliştirme için toplu olarak RGB veya HSL formatlarına dönüştürün. CSS değişkenlerini kullanarak modern tema oluşturmayı kolaylaştırın.

📱

Erişilebilirlik İyileştirmesi

Kodlama sırasında site arka plan rengi ile metin rengi kombinasyonunun WCAG kontrast oranı standartlarını (AA/AAA) karşılayıp karşılamadığını anında kontrol ederek daha okunaklı bir UI elde edin.

📊

Sunum Renk Düzeni İncelemesi

Kurumsal marka renklerine göre tamamlayıcı veya benzer renkler gibi ilgili paletleri otomatik olarak oluşturun. Uyumlu sunumlar ve grafik tasarımların renk düzenlerini düşünmek için kullanışlıdır.

🔍

Baskı Verileri için Dönüşüm Kılavuzu

Web'de kullanılan renkleri CMYK değerlerine dönüştürerek, broşürler ve kartvizitler gibi basılı materyalleri dağıtırken yaklaşık değerler için bir referans olarak kullanın.

Geri Bildirim Gönder

Aracı geliştirmemize yardımcı olmak için lütfen düşüncelerinizi bize bildirin.

Sorumluluk Reddi

Bu sitede sunulan araçların tamamı ücretsiz kullanılabilir; ancak kendi sorumluluğunuzda kullanınız. Herhangi bir hesaplama sonucu, dönüşüm sonucu veya oluşturulan verinin doğruluğu, eksiksizliği ya da güvenliği konusunda hiçbir garanti vermiyoruz. Bu araçların kullanımından kaynaklanabilecek zarar veya sorunlar için işletmecinin herhangi bir sorumluluk kabul etmediğini lütfen bilin. Araçların çoğu dosyaları ve hesaplamaları tarayıcınızda yerel olarak işler; bu, girdiğiniz verilerin sunucularımıza gönderilmediği veya depolanmadığı anlamına gelir.