Konversi Warna

Konversi HEX, RGB, HSL

HEX

#6366F1

RGB

99, 102, 241

HSL

239, 84%, 67%

Hasil akan dihitung secara otomatis saat input terisi

Kalkulator Konversi Warna - HEX, RGB, HSL, CMYK

Konversikan format warna antar HEX, RGB, HSL, HSV, dan CMYK. Termasuk color picker visual dan preview warna real-time.

Format Warna

HEX → RGB → HSL ↔ HSV

Keterangan:

  • HEX= Hexadecimal (#RRGGBB)(contoh: #FF5733)
  • RGB= Red, Green, Blue (0-255)(contoh: rgb(255, 87, 51))
  • HSL= Hue, Saturation, Lightness(contoh: hsl(11, 100%, 60%))
  • HSV= Hue, Saturation, Value(contoh: hsv(11, 80%, 100%))
  • CMYK= Cyan, Magenta, Yellow, Key(contoh: cmyk(0, 66, 80, 0))

Cara Menggunakan

  1. 1

    Pilih Format Input

    Pilih format warna asal: HEX, RGB, HSL, atau pilih dari color picker.

  2. 2

    Masukkan Nilai

    Input nilai warna sesuai format yang dipilih.

  3. 3

    Lihat Konversi

    Semua format warna ditampilkan dengan preview warna.

Contoh Perhitungan

HEX ke RGB

Soal:

Konversi #3498DB ke RGB

Penyelesaian:
  1. 1.R = 0x34 = 52
  2. 2.G = 0x98 = 152
  3. 3.B = 0xDB = 219
Hasil:rgb(52, 152, 219)

Warna biru terang yang populer di desain web.

RGB ke HSL

Soal:

Konversi rgb(255, 0, 0) ke HSL

Penyelesaian:
  1. 1.Merah murni: Hue = 0°
  2. 2.Saturasi maksimal: S = 100%
  3. 3.Lightness = 50% (warna penuh)
Hasil:hsl(0, 100%, 50%)

Merah murni memiliki hue 0° (atau 360°).

RGB ke CMYK

Soal:

Konversi rgb(255, 255, 0) ke CMYK

Penyelesaian:
  1. 1.K = 1 - max(R,G,B)/255 = 0
  2. 2.C = (1-R-K)/(1-K) = 0%
  3. 3.M = (1-G-K)/(1-K) = 0%
  4. 4.Y = (1-B-K)/(1-K) = 100%
Hasil:cmyk(0%, 0%, 100%, 0%)

Kuning adalah kombinasi merah dan hijau, tanpa biru.

Pertanyaan yang Sering Diajukan (FAQ)

Apa perbedaan RGB dan CMYK?
RGB adalah additive color (untuk layar/monitor, cahaya menambah warna). CMYK adalah subtractive color (untuk cetak, tinta menyerap cahaya). Warna RGB mungkin terlihat berbeda saat dicetak dalam CMYK.
Mengapa HSL berguna untuk desainer?
HSL lebih intuitif: Hue = warna (0-360°), Saturation = kejenuhan (0-100%), Lightness = terang/gelap (0-100%). Mudah untuk membuat variasi warna (terang/gelap) dengan hanya mengubah L.
Apa itu opacity/alpha channel?
Alpha mengontrol transparansi (0=transparan, 1=solid). RGBA dan HSLA mendukung ini. Contoh: rgba(255,0,0,0.5) = merah dengan 50% transparansi.
Bagaimana memilih palet warna yang harmonis?
Gunakan color wheel: Complementary (berlawanan), Analogous (berdekatan), Triadic (segitiga sama sisi). Tools seperti Adobe Color atau Coolors bisa membantu.

Kalkulator Terkait

Referensi