Konverter HEX dhateng RGB

Apa Iku Konversi HEX menyang RGB?

Kaca iki nampani kode warna HEX (kayata #4f46e5 utawa #abc) banjur langsung nuduhake angka RGB sing padha – telung angka 0 nganti 255 sing digunakake layar kanggo nampilake werna. Asil RGB ditampilake ing jejere format warna liyane (HSL, HSV, CMYK, LAB), supaya sampeyan bisa nyalin langsung menyang kode utawa piranti desain.

Sing ndadekake kaca iki beda yaiku cara ngonversi heksadesimal (basis-16) dadi desimal (basis-10) kanggo saben saluran RGB. Kode HEX iku sejatine cekakan sing padha karo telung saluran 8-bit sing digunakake RGB. Contone, #4f46e5 ora liya yaiku angka abang 79, ijo 70, lan biru 229. Mesin ora bisa maca HEX kanthi langsung – mula konversi iki pancen perlu nalika sampeyan butuh angka numerik kanggo manipulasi warna.

Kaca iki mung nangani kode HEX 6 digit utawa 3 digit. Kode 8 digit sing ngemot saluran alpha ora ditampa. Ater-ater # iku opsional; piranti iki bisa nampa kode nganggo utawa tanpa #. Kabeh konversi ditindakake ing browser sampeyan dhewe – ora ana data sing dikirim menyang server.

Cara Kerja Konversi: Saka Heksadesimal menyang Desimal

Konversi saka HEX menyang RGB iku matematika murni. Saben pasangan digit heksadesimal (00 nganti FF) diowahi dadi angka desimal 0–255 kanthi rumus:

nilai desimal = digit_kiri × 16 + digit_kanan

Contone, #4f46e5:

• Abang: 4f → 4×16 + 15 = 64 + 15 = 79
• Ijo: 46 → 4×16 + 6 = 64 + 6 = 70
• Biru: e5 → 14×16 + 5 = 224 + 5 = 229

Dadi RGB(79, 70, 229) – persis karo nilai sing ditampilake piranti.

Singkatan 3 Digit

Kode kaya #abc dianggep cekakan. Saben digit digandakake dadi loro digit:

• #abc → #aabbcc
• #f00 → #ff0000 (yaiku abang murni)

Mangkono, yen sampeyan ngetik #abc, piranti iki bakal nganggep #aabbcc sadurunge ngonversi. Iki padha karo cara CSS nangani shorthand HEX.

Tabel Konversi Werna Umum

Konversi iki eksak lan bisa dibalikake: yen RGB(79,70,229) dikonversi bali dadi HEX, asile tetep #4f46e5. Ora ana pembulatan amarga basis-16 lan basis-10 iku linear tanpa pecahan.

Aturan lan Watesan sing Kudu Dingerti

Piranti iki nduwwe aturan tartamtu supaya ora nyebabake kesalahan.

Format sing Ditampa

• 6 digit: #RRGGBB – contone #1E90FF utawa 1e90ff (huruf cilik utawa gedhe padha wae).
• 3 digit (shorthand): #RGB – contone #abc, #f00. (Akan digandakake dadi 6 digit.)
• Ater-ater # ora wajib; 4f46e5 uga bisa ditampa.

Format sing Ora Ditampa

• 8 digit (nganggo alpha): kaya #4f46e580 – kaca iki ora nangani saluran alpha.
• Angka desimal utawa format liyane kayata rgb(79,70,229) – kudu murni heksadesimal.
• Kode sing salah kaya #xyz (huruf z ora sah ing heksadesimal) utawa #12345 (kurang siji digit).

Yen format ora cocog, piranti bakal nampilake pesen kesalahan:

"Enter a hex color like #4f46e5 or #abc."

Pesen iki bakal katon nganti sampeyan mbenakake input.

Piranti Warna Pilih (Color Picker)

Sampeyan uga bisa nggunakake pilih warna sing kasedhiya ing kaca. Nalika milih werna saka picker, kode HEX kanthi otomatis diisi, banjur kabeh format warna liyane (RGB, HSL, HSV, CMYK, LAB) dianyari bebarengan. Iki migunani yen sampeyan ora ngapal kode HEX nanging bisa milih sacara visual.

Ora Ana Data sing Dikirim

Kabeh konversi ditindakake ing browser sampeyan. Ora ana input sing dikirim menyang server utawa disimpen. Iki penting kanggo privasi, utamane yen sampeyan nggarap warna saka desain rahasia.

Sapa Sing Butuh Piranti Iki?

Piranti iki dirancang kanggo sapa wae sing kerep ngolah warna adhedhasar layar.

• Front-end developer: Nalika nulis CSS, sampeyan bisa nggunakake color: #4f46e5. Nanging yen nulis JavaScript kanggo canvas utawa WebGL, sampeyan butuh angka RGB terpisah. Piranti iki ngasilake telung angka sing siap digunakake ing array utawa objek.
• Desainer grafis: Menerima spesifikasi warna ing HEX saka klien, banjur kudu nglebokake ing Adobe Photoshop utawa Figma sing nganggo slider RGB. Konversi manual bisa nyebabake kesalahan; piranti iki menehi asil pas.
• Pengembang game: Werna ing engine game asring diwakili minangka vektor (R,G,B). Nalika ngimpor palet saka CSS, konversi HEX menyang RGB dadi langkah penting.
• Siswa utawa peneliti warna: Sinau babagan model warna aditif, ngerti kepriye pasangan heksadesimal afiliasi karo kecerahan saben saluran. Contone, #808080 yaiku werna abu-abu 50% amarga 128/255 ≈ 0.5.

Bedane HEX lan RGB ing CSS lan Praktik

Ing CSS, sampeyan bisa nulis werna nganggo #ff6600 utawa rgb(255,102,0). Loro-lorone diinterpretasikake padha dening browser. Nanging ana prabédan praktis:

• HEX luwih cekak (6 karakter tinimbang 11+), gampang diketik lan dieling-eling kanggo warna umum kaya #fff (putih) utawa #000 (ireng).
• RGB luwih intuitif kanggo ngowahi kanthi matematis. Contone, kanggo nggawe werna luwih peteng, sampeyan bisa nyuda saben angka kanthi jumlah sing padha. Ing HEX, sampeyan kudu ngerti heksadesimal.
• rgba() (kanthi alpha) ora duwe padanan HEX langsung (yen nganggo 8 digit, nanging ora didhukung kabeh browser lawas). Nanging kaca iki ora nangani alpha, mula yen perlu alpha, sampeyan kudu nggunakake fungsi rgba() manual.

Piranti iki mbantu nalika sampeyan duwe HEX saka desain lan kudu ngowahi menyang RGB kanggo skrip. Ing CSS modern, sampeyan bisa uga nggunakake color-mix() utawa hsl(), nanging RGB tetep dadi jantung model warna aditif.

Hubungane karo Teori Werna lan Aksesibilitas

Angka RGB 0–255 iku dhasar kanggo ngitung kecerahan relatif warna – metrik sing dipigunakaké ing standar aksesibilitas WCAG (Web Content Accessibility Guidelines). Luminansi relatif diitung saka saluran RGB sing wis dinormalisasi (0–1) lan ditimbang:

L = 0.2126 × R_lin + 0.7152 × G_lin + 0.0722 × B_lin

Nanging saben saluran kudu dibenerake (gamma) luwih dhisik. Piranti iki ora nindakake iku, nanging output RGB minangka titik wiwitan.

Contone, werna #4f46e5 nduwwe angka RGB (79,70,229). Kanthi ngerti nilai kasebut, sampeyan bisa ngira-ira yen biru dominan banget. Kanggo entuk werna komplementer (kira-kira), sampeyan bisa ngowahi saben saluran dadi 255 - nilai asli: (176,185,26) – sing ing HEX dadi #b0b91a.

Kanggo aksesibilitas, rasio kontras antarane latar mburi lan teks bisa diitung nggunakake luminansi. Piranti iki ora nampilake kontras, nanging angka RGB sing diwenehake langsung bisa dipasang menyang kalkulator kontras.

FAQ – Pitakonan sing Sering Ditakoke

1. Apa bedane kode HEX 3 digit karo 6 digit?

Kode 3 digit (kayata #abc) minangka cekakan. Saben digit digandakake dadi loro digit: #abc padha karo #aabbcc. Iki ditrapake kanggo werna kanthi nilai saluran sing padha (contone, #f00 = abang murni amarga digit f digandakake dadi ff). Nanging ora kabeh werna bisa ditulis ing 3 digit – mung sing saben pasangan duwe digit sing padha (kayata #336699 bisa dadi #369).

2. Kenapa kaca iki ora nangani alpha (HEX 8 digit)?

Kaca iki mung ngonversi HEX menyang RGB tanpa alpha. Alpha minangka saluran kapisah (transparansi). Kanggo nangani alpha, sampeyan butuh fungsi sing ngasilake rgba() utawa hsla(). Yen sampeyan duwe kode 8 digit kaya #4f46e580, 80 minangka alpha (128 ing desimal). Piranti iki ora ngekstrak alpha – mung 6 digit pertama sing dianggep. Mula, yen sampeyan masang kode 8 digit, bakal dianggep salah format.

3. Apa konversi iki bisa dibalikake (reversible)?

Ya. Yen sampeyan njupuk RGB (79,70,229) banjur diowahi bali menyang HEX, asile tetep #4f46e5. Amarga konversi basis-16 menyang basis-10 iku bijektif (siji-siji) tanpa kelangan informasi. Iki penting kanggo kahanan nalika sampeyan kudu ngonfirmasi yen warna ora owah.

4. Yèn salah format, apa sing katon?

Piranti bakal nampilake pesen: "Enter a hex color like #4f46e5 or #abc." Ing kahanan iki, kabeh kolom warna liyane ora dianyari nganti sampeyan mbenakake input.

5. Apa data sing daketik dikirim menyang server?

Ora. Kabeh konversi ditindakake ing browser nggunakake JavaScript. Ora ana panjalukan jaringan sing ditindakake. Mulane sampeyan bisa nggunakake piranti iki kanthi aman sanajan ana warna rahasia saka proyek.

6. Apa aku bisa nggunakake kode HEX nganggo huruf kapital?

Bisa. #4F46E5, #4f46e5, lan #4F46e5 kabeh dianggep padha. Heksadesimal ora sensitif huruf gedhe/cilik.