Apa perbedaan antara RGB dan CMYK?

RGB digunakan untuk layar, CMYK untuk cetak. Layar membuat warna dengan memancarkan cahaya merah, hijau, dan biru (pencampuran aditif), sementara pencetak membuat warna dengan menumpuk tinta cyan, magenta, kuning, dan hitam di atas kertas (pencampuran subtraktif). RGB dapat menghasilkan warna yang lebih cerah dan lebih cerah daripada CMYK karena cahaya memiliki rentang warna yang lebih luas daripada tinta. Itulah sebabnya warna layar Anda sering terlihat pudar saat dicetak.

Mengapa warna saya terlihat berbeda saat dicetak?

Layar memancarkan cahaya, kertas memantulkannya—proses yang sangat berbeda. Selain itu, RGB menangani jutaan warna yang tidak dapat direproduksi oleh tinta CMYK. Kalibrasi layar, kualitas kertas, dan variasi tinta menambah variabilitas. Selalu periksa nilai CMYK sebelum mencetak, dan minta bukti fisik untuk pekerjaan pencocokan warna yang kritis.

Bagaimana cara mendapatkan kode hex dari warna yang saya lihat online?

Gunakan alat pengembang peramban Anda. Di Chrome atau Firefox, klik kanan elemen apa pun, pilih "Inspect," lalu klik kotak kecil warna di panel gaya. Ini membuka pemilih warna yang menunjukkan kode hex. Ekstensi peramban seperti ColorZilla membuatnya lebih cepat—mereka memungkinkan Anda mengklik di mana pun di halaman untuk mengambil nilai warnanya.

Apa arti simbol # dalam kode hex?

Ini hanya awalan yang memberi tahu peramban "ini adalah kode warna heksadesimal". Standar ini berasal dari spesifikasi HTML dan CSS awal. Enam karakter setelah # mewakili nilai RGB dalam basis-16: dua digit untuk merah, dua untuk hijau, dua untuk biru. Tanpa #, peramban tidak akan mengenalinya sebagai warna.

Mengapa kode hex 3 digit berfungsi?

Ini adalah cara singkat untuk saat setiap saluran warna berulang. #F00 menjadi #FF0000 (merah), #C9C menjadi #CC99CC (ungu muda). Cara singkat ini dibuat pada tahun 1990-an untuk mengurangi ukuran file ketika bandwidth mahal. Ini masih nyaman saat ini untuk warna sederhana.

Apakah konversi warna akurat?

Konversi RGB-ke-hex secara matematis tepat—mereka adalah nilai yang sama dalam basis angka yang berbeda. Konversi RGB-ke-CMYK adalah perkiraan karena Anda mengonversi antara ruang warna yang berbeda secara fundamental (cahaya vs tinta). Alat ini menggunakan standar profil warna ICC untuk konversi ini, yang merupakan pendekatan yang sama dengan perangkat lunak desain profesional.

Bagaimana cara membuat kombinasi warna yang dapat diakses?

Gunakan pemeriksa kontras seperti alat WebAIM setelah memilih warna di sini. Anda membutuhkan rasio 4,5:1 untuk teks normal, 3:1 untuk teks besar. Hindari kombinasi merah-hijau (tersulit bagi pengguna buta warna). Jika ragu, gunakan teks gelap pada latar belakang terang atau sebaliknya—perbedaan luminansi yang cukup adalah yang terpenting.

Bisakah saya memilih warna dari gambar?

Tidak langsung di alat ini. Gunakan ekstensi peramban seperti ColorZilla, atau tangkap layar gambar dan gunakan pemilih warna sistem operasi Anda (Digital Color Meter di macOS, PowerToys Color Picker di Windows). Setelah Anda memiliki nilai warna, masukkan di sini untuk mengonversi antar format.

Mengapa beberapa warna RGB tidak konversi dengan baik ke CMYK?

CMYK memiliki "gamut" (rentang warna yang dapat direproduksi) yang lebih sempit daripada RGB. Biru cerah, hijau cerah, dan jingga elektrik sering berada di luar apa yang dapat dibuat oleh tinta CMYK. Ketika ini terjadi, pencetak menggantikan kecocokan terdekat, yang biasanya terlihat kurang jenuh. Desainer cetak profesional sering memulai dengan warna aman CMYK untuk menghindari masalah ini.

Alat Pemilih Warna - Konversi Kode Warna RGB, Heks, CMYK & HSV

Apa yang Dapat Anda Lakukan dengan Color Picker Ini

Butuh nuansa warna sempurna untuk proyek Anda? Color picker ini memungkinkan Anda memilih, melihat pratinjau, dan mengonversi warna antara format RGB, Hex, CMYK, dan HSV secara instan. Baik Anda sedang membuat situs web, merancang logo, atau mempersiapkan file untuk cetak, Anda akan menemukan nilai warna tepat yang Anda butuhkan—tanpa tebak-tebakan, tanpa beralih antar alat.

Klik di mana saja pada spektrum warna untuk memilih nuansa, sesuaikan kecerahan dengan slider, atau masukkan nilai presisi secara langsung. Setiap format diperbarui secara real-time, dan Anda dapat menyalin kode warna apa pun hanya dengan satu klik.

Memahami Model Warna

Proyek berbeda membutuhkan format warna berbeda. Berikut penjelasan fungsi masing-masing dan kapan menggunakannya:

RGB (Merah, Hijau, Biru)

RGB bekerja dengan mencampur cahaya merah, hijau, dan biru—sama seperti cara layar menampilkan warna saat ini. Setiap komponen berkisar dari 0 hingga 255:

RGB(255, 0, 0) = merah murni
RGB(0, 255, 0) = hijau murni
RGB(0, 0, 255) = biru murni
RGB(255, 255, 255) = putih
RGB(0, 0, 0) = hitam

Kapan menggunakan RGB: Pekerjaan digital apa pun—situs web, aplikasi seluler, pengeditan video, atau grafik berbasis layar. Ini adalah bahasa asli tampilan, itulah mengapa alat seperti CSS mendukung fungsi rgb() dan rgba() secara langsung. Menurut spesifikasi Modul Warna CSS W3C, RGB adalah model warna dasar untuk standar web.

Heksadesimal (Hex)

Kode hex hanyalah nilai RGB yang ditulis dalam basis-16 bukan basis-10. Warna hex terlihat seperti #FF5733, di mana:

Simbol # menandakan bahwa ini adalah kode hex
Dua karakter pertama = merah (00-FF)
Dua karakter tengah = hijau (00-FF)
Dua karakter terakhir = biru (00-FF)
#FF0000 = merah, #00FF00 = hijau, #0000FF = biru

Anda kadang akan melihat singkatan 3 karakter seperti #F00 sebagai pengganti #FF0000—ini berfungsi ketika setiap saluran warna mengulang digit yang sama.

Kapan menggunakan Hex: Pengembangan web adalah kasus penggunaan utama. CSS selalu mendukung notasi hex, dan sebagian besar pengembang merasa lebih cepat mengetiknya daripada rgb(). Kesalahan umum: lupa menambahkan simbol # akan merusak gaya Anda secara diam-diam, karena peramban tidak akan mengenalinya sebagai warna yang valid.

CMYK (Cyan, Magenta, Kuning, Kunci/Hitam)

CMYK adalah model warna yang digunakan oleh pencetak. Tidak seperti RGB (yang menambahkan cahaya), CMYK menguranginya—mencampur tinta di atas kertas putih untuk membuat warna:

Setiap komponen berkisar dari 0% hingga 100%
CMYK(0, 100, 100, 0) = merah
CMYK(100, 0, 100, 0) = hijau
CMYK(0, 0, 0, 100) = tinta hitam murni
CMYK(0, 0, 0, 0) = tanpa tinta (kertas putih terlihat)

Kapan menggunakan CMYK: Merancang untuk cetak—kartu bisnis, brosur, majalah, kemasan. Inilah realitanya: banyak warna RGB yang cerah tidak dapat direproduksi dengan tinta CMYK. Biru elektrik cerah yang Anda lihat di layar? Akan terlihat pudar saat dicetak. Desainer profesional selalu melihat pratinjau konversi CMYK sebelum mengirim file ke pencetak untuk menghindari kejutan.

HSV (Hue, Saturasi, Nilai)

HSV membagi warna menjadi tiga komponen intuitif:

Hue: Keluarga warna mana (0-360°)—0° adalah merah, 120° adalah hijau, 240° adalah biru
Saturasi: Seberapa hidup atau kelabu (0-100%)—0% adalah skala kelabu, 100% adalah saturasi penuh
Nilai: Seberapa terang atau gelap (0-100%)—0% adalah hitam, 100% adalah kecerahan penuh

Mengapa HSV penting: Ini cocok dengan cara manusia secara alami berpikir tentang warna. Ingin biru yang lebih gelap? Turunkan nilainya. Ingin biru yang kurang intens? Turunkan saturasi. Ini membuat HSV ideal untuk pemilih warna interaktif seperti ini, di mana Anda memilih hue pada spektrum dan menyesuaikan kecerahan dengan slider.

Rumus Konversi Warna

Pemilih warna secara otomatis mengonversi antara model warna yang berbeda menggunakan rumus matematika ini:

Konversi RGB ke Heksadesimal

Untuk mengonversi RGB ke heksadesimal:

Konversi setiap komponen RGB (0-255) menjadi angka heksadesimal dua digit
Gabungkan tiga nilai heksadesimal dengan awalan #

$\text{Hex} = \text{\#} + \text{toHex}(R) + \text{toHex}(G) + \text{toHex}(B)$

Di mana toHex() mengonversi angka desimal ke representasi heksadesimalnya.

Konversi RGB ke CMYK

Konversi dari RGB ke CMYK melibatkan langkah-langkah berikut:

Normalisasi nilai RGB ke rentang 0-1
Hitung komponen kunci hitam (K)
Hitung C, M, dan Y berdasarkan K

$R' = R/255, G' = G/255, B' = B/255$ $K = 1 - \max(R', G', B')$ $C = \frac{(1-R'-K)}{(1-K)} \times 100\%$ $M = \frac{(1-G'-K)}{(1-K)} \times 100\%$ $Y = \frac{(1-B'-K)}{(1-K)} \times 100\%$

Konversi RGB ke HSV

Mengonversi RGB ke HSV:

$R' = R/255, G' = G/255, B' = B/255$ $C_{max} = \max(R', G', B')$ $C_{min} = \min(R', G', B')$ $\Delta = C_{max} - C_{min}$

Untuk Hue (H):

1// Konversi RGB ke Hex
2function rgbToHex(r, g, b) {
3  const toHex = (c) => {
4    const hex = Math.round(c).toString(16);
5    return hex.length === 1 ? '0' + hex : hex;
6  };
7  
8  return `#${toHex(r)}${toHex(g)}${toHex(b)}`;
9}
10
11// Konversi Hex ke RGB
12function hexToRgb(hex) {
13  // Hapus # jika ada
14  const cleanHex = hex.startsWith('#') ? hex.slice(1) : hex;
15  
16  // Tangani hex 3 digit dan 6 digit
17  const expandedHex = cleanHex.length === 3 
18    ? cleanHex.split('').map(char => char + char).join('')
19    : cleanHex;
20    
21  const r = parseInt(expandedHex.substring(0, 2), 16);
22  const g = parseInt(expandedHex.substring(2, 4), 16);
23  const b = parseInt(expandedHex.substring(4, 6), 16);
24  
25  return { r, g, b };
26}
27
28// Konversi RGB ke CMYK
29function rgbToCmyk(r, g, b) {
30  // Normalisasi nilai RGB
31  const normalizedR = r / 255;
32  const normalizedG = g / 255;
33  const normalizedB = b / 255;
34  
35  // Hitung K (hitam)
36  const k = 1 - Math.max(normalizedR, normalizedG, normalizedB);
37  
38  // Tangani hitam murni
39  if (k === 1) {
40    return { c: 0, m: 0, y: 0, k: 100 };
41  }
42  
43  // Hitung C, M, Y
44  const c = ((1 - normalizedR - k) / (1 - k)) * 100;
45  const m = ((1 - normalizedG - k) / (1 - k)) * 100;
46  const y = ((1 - normalizedB - k) / (1 - k)) * 100;
47  
48  return {
49    c: Math.round(c),
50    m: Math.round(m),
51    y: Math.round(y),
52    k: Math.round(k * 100)
53  };
54}
55
56// Contoh penggunaan
57const rgb = { r: 255, g: 0, b: 0 }; // Merah murni
58console.log(`Hex: ${rgbToHex(rgb.r, rgb.g, rgb.b)}`);
59console.log(`CMYK:`, rgbToCmyk(rgb.r, rgb.g, rgb.b));
60

1# Konversi RGB ke Hex
2def rgb_to_hex(r, g, b):
3    return f'#{r:02x}{g:02x}{b:02x}'
4
5# Konversi Hex ke RGB
6def hex_to_rgb(hex_color):
7    # Hapus # jika ada
8    hex_color = hex_color.lstrip('#')
9    
10    # Tangani hex 3 digit dan 6 digit
11    if len(hex_color) == 3:
12        hex_color = ''.join([c*2 for c in hex_color])
13    
14    return {
15        'r': int(hex_color[0:2], 16),
16        'g': int(hex_color[2:4], 16),
17        'b': int(hex_color[4:6], 16)
18    }
19
20# Konversi RGB ke CMYK
21def rgb_to_cmyk(r, g, b):
22    # Normalisasi nilai RGB
23    r_norm = r / 255
24    g_norm = g / 255
25    b_norm = b / 255
26    
27    # Hitung K (hitam)
28    k = 1 - max(r_norm, g_norm, b_norm)
29    
30    # Tangani hitam murni
31    if k == 1:
32        return {'c': 0, 'm': 0, 'y': 0, 'k': 100}
33    
34    # Hitung C, M, Y
35    c = ((1 - r_norm - k) / (1 - k)) * 100
36    m = ((1 - g_norm - k) / (1 - k)) * 100
37    y = ((1 - b_norm - k) / (1 - k)) * 100
38    
39    return {
40        'c': round(c),
41        'm': round(m),
42        'y': round(y),
43        'k': round(k * 100)
44    }
45
46# Contoh penggunaan
47rgb = {'r': 0, 'g': 128, 'b': 255}  # Biru langit
48hex_color = rgb_to_hex(rgb['r'], rgb['g'], rgb['b'])
49cmyk = rgb_to_cmyk(rgb['r'], rgb['g'], rgb['b'])
50
51print(f"Hex: {hex_color}")
52print(f"CMYK: C={cmyk['c']}%, M={cmyk['m']}%, Y={cmyk['y']}%, K={cmyk['k']}%")
53

1public class ColorConverter {
2    // Konversi RGB ke Hex
3    public static String rgbToHex(int r, int g, int b) {
4        return String.format("#%02x%02x%02x", r, g, b);
5    }
6    
7    // Konversi Hex ke RGB
8    public static int[] hexToRgb(String hexColor) {
9        // Hapus # jika ada
10        if (hexColor.startsWith("#")) {
11            hexColor = hexColor.substring(1);
12        }
13        
14        // Tangani hex 3 digit dan 6 digit
15        if (hexColor.length() == 3) {
16            String expandedHex = "";
17            for (char c : hexColor.toCharArray()) {
18                expandedHex += c + String.valueOf(c);
19            }
20            hexColor = expandedHex;
21        }
22        
23        int r = Integer.parseInt(hexColor.substring(0, 2), 16);
24        int g = Integer.parseInt(hexColor.substring(2, 4), 16);
25        int b = Integer.parseInt(hexColor.substring(4, 6), 16);
26        
27        return new int[]{r, g, b};
28    }
29    
30    // Konversi RGB ke CMYK
31    public static double[] rgbToCmyk(int r, int g, int b) {
32        // Normalisasi nilai RGB
33        double normalizedR = r / 255.0;
34        double normalizedG = g / 255.0;
35        double normalizedB = b / 255.0;
36        
37        // Hitung K (hitam)
38        double k = 1 - Math.max(Math.max(normalizedR, normalizedG), normalizedB);
39        
40        // Tangani hitam murni
41        if (k == 1) {
42            return new double[]{0, 0, 0, 100};
43        }
44        
45        // Hitung C, M, Y
46        double c = ((1 - normalizedR - k) / (1 - k)) * 100;
47        double m = ((1 - normalizedG - k) / (1 - k)) * 100;
48        double y = ((1 - normalizedB - k) / (1 - k)) * 100;
49        
50        return new double[]{
51            Math.round(c),
52            Math.round(m),
53            Math.round(y),
54            Math.round(k * 100)
55        };
56    }
57    
58    public static void main(String[] args) {
59        // Contoh penggunaan
60        int r = 75, g = 0, b = 130;  // Ungu
61        String hexColor = rgbToHex(r, g, b);
62        double[] cmyk = rgbToCmyk(r, g, b);
63        
64        System.out.println("Hex: " + hexColor);
65        System.out.printf("CMYK: C=%.0f%%, M=%.0f%%, Y=%.0f%%, K=%.0f%%\n", 
66                          cmyk[0], cmyk[1], cmyk[2], cmyk[3]);
67    }
68}
69

Referensi dan Bacaan Lebih Lanjut

Modul Warna CSS W3C Level 4 - Spesifikasi warna web resmi
Pedoman Kontras WCAG 2.1 - Standar aksesibilitas untuk kontras warna
Pemeriksa Kontras WebAIM - Uji rasio kontras warna
Standar Profil Warna ICC - Spesifikasi teknis untuk konversi warna
Dokumentasi Web MDN: Nilai Warna CSS - Panduan komprehensif untuk format warna web

Alat Pemilih Warna - Konversi Kode Warna RGB, Heks, CMYK & HSV

Pemilih Warna

RGB (0-255)

CMYK (0-100)

Pemilih Warna

Dokumentasi

Apa yang Dapat Anda Lakukan dengan Color Picker Ini

Memahami Model Warna

RGB (Merah, Hijau, Biru)

Heksadesimal (Hex)

CMYK (Cyan, Magenta, Kuning, Kunci/Hitam)

HSV (Hue, Saturasi, Nilai)

Rumus Konversi Warna

Konversi RGB ke Heksadesimal

Konversi RGB ke CMYK

Konversi RGB ke HSV

Referensi dan Bacaan Lebih Lanjut

Generator Palet Warna - Buat Skema Warna yang Harmonis

Generator Properti CSS - Gradien, Bayangan & Batas

Generator Kode QR Gratis - Buat Kode QR yang Dapat Dipindai Secara Instan

Konverter Basis Bilangan: Biner, Heks, Desimal & Oktal

Prediktor Warna Kelinci – Hitung Warna Bulu Anak Kelinci

Konverter Biner ke Desimal | Alat Daring Gratis

Konverter PX ke REM ke EM – Kalkulator Unit CSS Gratis

Dekoder Gambar Base64 | Dekode & Pratinjau Gambar Daring

Kalkulator Pengenceran Pemutih: Rasio Akurat untuk Pembersihan Aman

Konverter Piksel ke Inci - Kalkulator DPI Gratis (2025)

Kalkulator Panjang Bit dan Byte - Alat Ukuran Data Gratis

Pemformat Kode Gratis: Memperindah JavaScript, Python, HTML & Lainnya