🎨 Konverter Warna

Tempelkan warna dalam format apa saja – #3B82F6, rgb(), hsl(), atau nama warna bahasa Inggris seperti teal – lalu dapatkan semua format lainnya, skor kontras aksesibilitas, dan palet tint serta shade.

Jawaban singkat: #3B82F6 sama dengan rgb(59, 130, 246), hsl(217, 91%, 60%), dan cmyk(76%, 47%, 0%, 4%); rasio kontrasnya 3,68:1 di atas putih (AA hanya untuk teks besar) dan 5,71:1 di atas hitam (AA).

Belum ada penilaian · Diperbarui 17 Oktober 2026 · Gratis · Tanpa daftar

Warna

#3B82F6

rgb(59, 130, 246)

Teks putih 3,68:1Teks hitam 5,71:1

HEX	#3B82F6
RGB	rgb(59, 130, 246)
HSL	hsl(217, 91%, 60%)
HSV / HSB	hsv(217, 76%, 96%)
CMYK	cmyk(76%, 47%, 0%, 4%)

Kontras dengan putih: 3,68:1 · AA hanya untuk teks besar
Kontras dengan hitam: 5,71:1 · AA
Warna teks terbaik: Hitam

Gradasi terang/tint (dicampur putih)

Terang	Warna	RGB	HSL
Dasar	#3B82F6	rgb(59, 130, 246)	hsl(217, 91%, 60%)
10%	#4F8FF7	rgb(79, 143, 247)	hsl(217, 91%, 64%)
20%	#629BF8	rgb(98, 155, 248)	hsl(217, 91%, 68%)
30%	#76A8F9	rgb(118, 168, 249)	hsl(217, 92%, 72%)
40%	#89B4FA	rgb(137, 180, 250)	hsl(217, 92%, 76%)
50%	#9DC1FB	rgb(157, 193, 251)	hsl(217, 92%, 80%)
60%	#B1CDFB	rgb(177, 205, 251)	hsl(217, 90%, 84%)
70%	#C4DAFC	rgb(196, 218, 252)	hsl(216, 90%, 88%)
80%	#D8E6FD	rgb(216, 230, 253)	hsl(217, 90%, 92%)
90%	#EBF3FE	rgb(235, 243, 254)	hsl(215, 90%, 96%)

Gradasi gelap/shade (dicampur hitam)

Gelap	Warna	RGB	HSL
Dasar	#3B82F6	rgb(59, 130, 246)	hsl(217, 91%, 60%)
10%	#3575DD	rgb(53, 117, 221)	hsl(217, 71%, 54%)
20%	#2F68C5	rgb(47, 104, 197)	hsl(217, 61%, 48%)
30%	#295BAC	rgb(41, 91, 172)	hsl(217, 62%, 42%)
40%	#234E94	rgb(35, 78, 148)	hsl(217, 62%, 36%)
50%	#1E417B	rgb(30, 65, 123)	hsl(217, 61%, 30%)
60%	#183462	rgb(24, 52, 98)	hsl(217, 61%, 24%)
70%	#12274A	rgb(18, 39, 74)	hsl(218, 61%, 18%)
80%	#0C1A31	rgb(12, 26, 49)	hsl(217, 61%, 12%)
90%	#060D19	rgb(6, 13, 25)	hsl(218, 61%, 6%)

Syarat kontras WCAG

Level	Teks biasa	Teks besar (18 pt ke atas atau 14 pt tebal)	Di atas putih	Di atas hitam
AA	4,5:1	3:1	Hanya teks besar	Lolos
AAA	7:1	4,5:1	Tidak lolos	Hanya teks besar

</> Pasang kalkulator ini di situs web Anda – gratis, tanpa daftar, tanpa iklan

Salin kode ini ke halaman web, artikel blog, atau CMS mana pun (WordPress, Wix, Squarespace, Webflow…). Kalkulator selalu diperbarui secara otomatis, berfungsi di ponsel, dan memilih mata uang pengunjung Anda.

<iframe src="https://calcbright.com/embed/color-converter" title="Color Converter by CalcBright" width="100%" height="620" style="border:0;max-width:760px" loading="lazy"></iframe>
<p style="font:13px/1.4 sans-serif;margin:4px 0 0"><a href="https://calcbright.com/color-converter" rel="nofollow">Color Converter</a> by <a href="https://calcbright.com">CalcBright</a></p>
<script>addEventListener('message',function(e){if(e.origin==='https://calcbright.com'&&e.data&&e.data.cbHeight){document.querySelectorAll('iframe[src^="https://calcbright.com/embed/"]').forEach(function(f){if(f.contentWindow===e.source)f.style.height=e.data.cbHeight+'px'})}})</script>

Pratinjau

Cara memakai konverter warna

Tempelkan warna dalam format yang umum – #3B82F6, #38F, rgb(59, 130, 246), hsl(217, 91%, 60%), hsv(217, 76%, 96%), cmyk(76%, 47%, 0%, 4%), atau nama warna dasar dalam bahasa Inggris seperti teal. Anda akan mendapat semua format lainnya, contoh warna, skor kontras, serta palet tint dan shade.

Rumus konversi

HEX → RGB: setiap pasang digit heksadesimal adalah satu kanal, 00–FF = 0–255

CMYK: K = 1 − maks(R′, G′, B′) · C = (1 − R′ − K) ÷ (1 − K), begitu pula M dan Y (R′ = R ÷ 255)

HSL: L = (maks + min) ÷ 2 · S = (maks − min) ÷ (1 − |2L − 1|) · H dari kanal yang dominan

Kontras = (L1 + 0,05) ÷ (L2 + 0,05), memakai luminans relatif WCAG

Contoh perhitungan

#3B82F6 dipecah menjadi 3B, 82, dan F6 = rgb(59, 130, 246). Biru adalah kanal terbesar (0,965), sehingga K = 3,5% dan C = (1 − 0,231 − 0,035) ÷ 0,965 = 76%, menghasilkan cmyk(76%, 47%, 0%, 4%). Dalam HSL warnanya hsl(217, 91%, 60%). Luminans relatifnya 0,236, jadi kontrasnya 3,68:1 terhadap putih dan 5,71:1 terhadap hitam – gunakan teks hitam di atasnya untuk huruf berukuran kecil.

Warna yang umum

Warna	HEX	RGB	HSL
Merah	#FF0000	255, 0, 0	0°, 100%, 50%
Hijau	#008000	0, 128, 0	120°, 100%, 25%
Biru	#0000FF	0, 0, 255	240°, 100%, 50%
Oranye	#FFA500	255, 165, 0	39°, 100%, 50%
Hijau kebiruan (teal)	#008080	0, 128, 128	180°, 100%, 25%
Abu-abu	#808080	128, 128, 128	0°, 0%, 50%

Tips

Nilai CMYK di sini adalah konversi sederhana yang tidak bergantung pada perangkat – untuk cetak profesional, konversikan dengan profil ICC percetakan Anda.
Periksa kontras setiap pasangan teks dan latar dalam desain Anda, bukan hanya warna mereknya.

Pertanyaan umum

Bagaimana cara mengubah HEX ke RGB?

Pisahkan enam digit heksadesimal menjadi tiga pasang, lalu ubah setiap pasang dari basis 16 ke desimal. #3B82F6 → 3B = 59, 82 = 130, F6 = 246, jadi rgb(59, 130, 246).

Apa beda RGB dan CMYK?

RGB mencampur cahaya merah, hijau, dan biru untuk layar; CMYK mencampur tinta sian, magenta, kuning, dan hitam untuk cetak. Warna layar yang sangat terang atau pekat belum tentu bisa direproduksi saat dicetak.

Apa beda HSL dan HSV?

Keduanya menyatakan rona (hue) sebagai sudut 0–360° ditambah saturasi. Lightness pada HSL bergerak dari hitam, melewati warna murni, hingga putih, sedangkan value pada HSV (disebut juga brightness pada HSB) bergerak dari hitam ke warna murni.

Berapa rasio kontras yang dibutuhkan agar teks aksesibel?

Level AA pada WCAG 2 mensyaratkan 4,5:1 untuk teks biasa dan 3:1 untuk teks besar (18 pt, atau 14 pt tebal). Level AAA mensyaratkan 7:1 dan 4,5:1.

Apa itu tint dan shade?

Tint adalah warna yang dicampur putih sehingga lebih terang; shade adalah warna yang dicampur hitam sehingga lebih gelap. Keduanya cara cepat menyusun palet yang serasi dari satu warna merek.

Beri penilaian untuk Konverter Warna

Hanya rata-rata penilaian yang ditampilkan. Laporan kesalahan langsung masuk ke kotak surat kami agar dapat kami periksa dan perbaiki. Selengkapnya: Metodologi dan kebijakan privasi.