Color
Converter

Tool ini mendukung 6 format input dan output: HEX (termasuk shorthand #0df), RGB/RGBA dengan CSS string, HSL/HSLA dengan CSS string, HSV/HSB, CMYK (untuk kebutuhan cetak), CIE L*a*b* (perceptually uniform color space), dan CSS Named Color (cyan, tomato, dll). Semua format bisa dikonversi satu sama lain secara langsung — cukup ubah nilai di salah satu format, semua lainnya otomatis ikut berubah.

HEX adalah representasi heksadesimal warna, paling umum di web dan CSS. RGB mendefinisikan warna dari campuran Red, Green, Blue (0–255) — model warna layar digital. HSL menggunakan Hue (rona 0–360°), Saturation (0–100%), Lightness (0–100%) — lebih intuitif untuk membuat variasi warna. HSV/HSB mirip HSL tapi dengan Value/Brightness menggantikan Lightness. CMYK (Cyan, Magenta, Yellow, Key/Black) adalah model warna untuk media cetak — berbeda dari model layar.

CIE L*a*b* (disingkat LAB) adalah color space yang dirancang agar perbedaan numeriknya sesuai dengan persepsi mata manusia (perceptually uniform). L* adalah lightness (0–100), a* adalah sumbu hijau–merah, b* adalah sumbu biru–kuning. LAB digunakan dalam industri percetakan profesional, desain produk, dan quality control warna untuk mengukur perbedaan warna (Delta E) secara akurat.

Shades adalah variasi warna yang lebih gelap dari warna asli — dibuat dengan menambahkan hitam (menurunkan Lightness di HSL). Tints adalah variasi yang lebih terang — dibuat dengan menambahkan putih (menaikkan Lightness). Tool ini menampilkan 9 variasi dari sangat terang hingga sangat gelap. Berguna saat membangun design system atau memilih warna hover, disabled, dan active state di CSS.

HEX terdiri dari 3 pasang digit heksadesimal untuk R, G, B. Contoh #00d4ff: R=00(hex)=0, G=d4(hex)=212, B=ff(hex)=255, hasilnya rgb(0, 212, 255). Untuk HEX shorthand seperti #0df, setiap digit digandakan dulu: #0df menjadi #00ddff, hasilnya rgb(0, 221, 255). Atau gunakan Color Converter di atas untuk hasil instan tanpa hitung manual.

CSS Named Color adalah nama warna yang dikenali langsung oleh browser tanpa perlu kode HEX atau RGB — contoh: red, blue, cyan, tomato, coral, rebeccapurple. Ada 147 CSS named color standar termasuk transparent. Tool ini mendeteksi apakah warna yang kamu masukkan cocok dengan salah satu dari 45 nama CSS yang paling umum digunakan dan langsung menampilkannya.

Tool ini secara otomatis menghitung contrast ratio berdasarkan relative luminance warna latar menggunakan formula WCAG 2.1, lalu menampilkan badge putih atau hitam sesuai mana yang lebih readable. Secara umum: warna gelap (Lightness di bawah 50%) lebih mudah dibaca dengan teks putih, warna terang (Lightness di atas 50%) lebih mudah dibaca dengan teks hitam. Standar WCAG AA mensyaratkan minimal contrast ratio 4.5:1 untuk teks normal.