Lompat ke konten
Utilizy

Konverter & Pemilih Warna

HEX, RGB, HSL — lengkap dengan cek kontras

Berjalan di browser Anda

Masukan

Hasil

Hasil

#1FA89C
  • HEX#1FA89C
  • RGBrgb(31, 168, 156)
  • HSLhsl(175, 69%, 39%)
  • CMYKcmyk(82%, 0%, 7%, 34%)

Skala terang dan gelap (klik untuk melompat ke warna itu)

Kontras di atas putih
2.94Di bawah standar
Kontras di atas hitam
7.14AAA

WCAG: teks isi memerlukan 4,5:1 (AA), 7:1 untuk AAA. CMYK hanya indikatif — nilai ini mengabaikan profil warna.

Perkakas desain berbicara HEX, animasi CSS maunya HSL, dan kode canvas maunya kanal RGB. Pilih satu warna sekali dan dapatkan semua notasinya, berikut angka kontras yang menentukan apakah teks di atasnya masih terbaca.

Cara pakai

  1. 1 Pilih sebuah warna, atau tempelkan kode dalam format apa pun.
  2. 2 Semua notasi lain muncul sekaligus.
  3. 3 Gunakan skala terang dan gelap untuk menyusun palet yang konsisten.
  4. 4 Periksa rasio kontras sebelum memakainya sebagai latar teks.

Pertanyaan yang sering diajukan

Rasio kontras berapa yang saya perlukan?

WCAG AA mensyaratkan 4,5:1 untuk teks isi dan 3:1 untuk teks berukuran besar. AAA meminta 7:1. Di bawah 3:1 teks benar-benar sulit dibaca banyak orang, bukan sekadar kurang ideal.

Kenapa memakai HSL alih-alih HEX?

HSL memisahkan rona dari saturasi dan kecerahan, sehingga membuat warna 10% lebih terang cukup mengubah satu angka, bukan menebak-nebak di tiga kanal. Karena itulah sistem desain menyusun skala warnanya dengan HSL.

Apakah nilai CMYK bisa dipakai untuk cetak?

Hanya sebagai perkiraan kasar. Konversi sebenarnya bergantung pada kertas, tinta dan profil warna. Untuk apa pun yang akan naik cetak, ambil nilainya dari percetakan, bukan dari rumus.

Cocok dipakai bersama