Konversi HEX ke RGB Hexadecimal ↔ Red Green Blue Gratis Daring Aman
Ketik sebuah nilai dalam HEX dan bacalah langsung dalam RGB. Hitungannya terjadi di peramban Anda, tidak ada yang dikirim ke mana pun, dan apa yang menentukan hasilnya tertulis di bawah, bukan diandaikan.
Tidak ada unggahan
Dari mana notasi ini berasal
Heksadesimal dan RGB adalah hal yang sama, ditulis dua kali. Warna layar adalah tiga bilangan — seberapa banyak cahaya merah, hijau, dan biru yang dipancarkan — masing-masing 0 sampai 255, yaitu satu bita; heksadesimal sekadar menulis bita itu dalam basis enam belas, sehingga #FF8800 dan rgb(255, 136, 0) adalah perintah yang sama kepada piksel yang sama. HSL diciptakan karena keduanya tak terbaca oleh manusia: ia memberi rona sebagai sudut pada roda warna, dengan kejenuhan dan kecerahan sebagai persentase, sehingga perancang dapat menerangkan sesuatu tanpa menghitung ulang tiga angka. CMYK milik dunia yang sama sekali lain — tinta, bukan cahaya. Ia bersifat kurangan, dibangun dari empat pelat cetak, dan tak dapat mencapai setiap warna yang sanggup dibuat layar, sebab layar memancarkan cahaya sedangkan kertas hanya memantulkannya.
Di mana Anda menemuinya
Heksadesimal adalah yang Anda ketikkan ke dalam lembar gaya dan yang diserahkan alat rancang kepada Anda. RGB muncul di mana pun sebuah warna memerlukan hitungan: gradasi, kebeningan, kode yang menghitung sebuah naungan. HSL dipakai saat menyetel palet dengan tangan, sebab perubahan yang diinginkan biasanya perubahan salah satu dari tiga angkanya. CMYK adalah yang diminta percetakan, dan mengubah ke dalamnya adalah saat sebuah rancangan berhenti menjadi cahaya dan menjadi tinta.
Pertanyaan yang sering diajukan
Mengapa hasil CMYK saya berbeda dari yang diberikan percetakan?
Karena tak ada satu konversi yang benar. Hitungan di halaman ini adalah yang sederhana dan tak bergantung peranti — jawaban yang tepat bila Anda butuh titik tolak atau padanan kasar. Percetakan mengubahnya lewat profil warna yang memperhitungkan tinta, kertas, dan mesin tertentu; warna RGB yang sama akan memberi nilai CMYK berbeda pada kertas berkilap dibanding kertas tanpa lapisan. Untuk apa pun yang harus sama persis, mintalah profil kepada percetakan alih-alih memercayai sebuah rumus.
Mengapa sebagian warna layar tak bisa dicetak?
Karena keduanya tak menjangkau warna yang sama. Layar membuat warna dengan menambahkan cahaya dan sanggup menghasilkan sian atau hijau yang pekat dan menyala, yang tak dapat ditandingi tinta; kertas membuat warna dengan menyerap cahaya, dan paling terang yang dapat dicapainya hanyalah putih halaman. Himpunan warna yang dapat dijangkau masing-masing disebut gamut, dan di tempat keduanya tak bertindih, konversi harus memilih warna terdekat yang tersedia. Itulah sebabnya warna cerah di layar kerap tampak sedikit kusam saat dicetak.
Apakah hasilnya tepat?
Bila kedua satuan saling didefinisikan dengan bilangan bulat, ya — halaman menyatakannya di atas angka, dan pembulatan hanya ada pada berapa digit yang ditampilkan. Bila rasionya tidak berujung sebagai desimal, halaman menampilkan dua belas angka penting dan menyebut hubungannya hampiran, bukan berpura-pura sebaliknya.
Apakah yang saya ketik meninggalkan perangkat saya?
Tidak. Perhitungan berjalan di peramban Anda; tidak ada yang diunggah, dan memang tidak ada server untuk menerimanya. Sekali dimuat, halaman tetap bekerja meski jaringan dimatikan.
Mengapa Anda konversi HEX ke RGB
Alat desain memberi Anda warna sebagai #5A4632. Stylesheet, skrip kanvas, pustaka bagan, atau program grafis memintanya sebagai rgb(90, 70, 50). Itu warna yang sama, dan pekerjaan berpindah dari satu ejaan ke ejaan lain sering muncul: panduan merek mencantumkan kode hex dan kode Anda membutuhkan angka untuk menghitung nuansa yang lebih terang, klien mengirim warna dari logo dan Anda harus mengisi rgba() dengan transparansi, pustaka hanya menerima tiga nilai terpisah. Konversi HEX ke RGB adalah tugas kecil, dan konverter yang andal menyelamatkan Anda dari berhitung basis enam belas di kepala lalu keliru.
Konversinya eksak, yang tidak benar untuk setiap konversi warna. Hex dan rgb() adalah dua ejaan untuk tiga angka yang sama, jumlah cahaya merah, hijau, dan biru yang harus dipancarkan layar, masing-masing dari 0 sampai 255. Tidak ada yang diperkirakan, dan perjalanan bolak-balik mengembalikan apa yang dimulainya. Halaman ini melakukannya di browser Anda, dan tidak ada yang diunggah. Di bawah Anda akan menemukan bagaimana digit hex dipetakan ke tiga angka, bagaimana transparansi dibawa, apa yang dilakukan bentuk singkat, batas sRGB, dan situasi di mana pengembang dan desainer perlu konversi HEX ke RGB.
Cara kerja konversi
Tiga pasang digit menjadi tiga angka
Warna hex adalah tanda pagar diikuti enam digit heksadesimal, yang dibaca berpasangan: pasangan pertama merah, kedua hijau, ketiga biru. Setiap pasangan adalah angka dalam basis enam belas antara 00 dan FF, yaitu 0 sampai 255 dalam sistem desimal yang Anda pakai setiap hari. Jadi #5A4632 terbagi menjadi 5A, 46, dan 32. 5A adalah 5 × 16 + 10 = 90, 46 adalah 4 × 16 + 6 = 70, dan 32 adalah 3 × 16 + 2 = 50. Warnanya adalah rgb(90, 70, 50), yaitu contoh yang dimulai halaman ini.
Mengapa digit berjalan dari 0 sampai F
Basis enam belas membutuhkan enam belas simbol, jadi setelah 9 datang huruf A sampai F, yang melambangkan 10 sampai 15. Sepasang digit semacam itu memberi 16 × 16 = 256 nilai, persis yang dapat dimuat satu byte. Warna layar adalah tiga byte, dan hex hanyalah cara ringkas menuliskannya: enam karakter alih-alih tiga angka dengan koma dan kurung.
Huruf besar dan kecil
#5a4632 dan #5A4632 adalah warna yang sama. CSS menerima keduanya, begitu pula konverter ini. Pilih satu konvensi untuk proyek dan patuhi, karena campuran huruf besar-kecil mempersulit pencarian di stylesheet.
Apa yang dipertahankan konversi dan apa yang tidak bisa
Ia mempertahankan warna, secara eksak
Hex dan rgb() adalah dua ejaan untuk tiga angka yang sama, 0 sampai 255 untuk merah, hijau, dan biru, jadi tidak ada yang diperkirakan dan perjalanan bolak-balik mengembalikan apa yang dimulainya. Konversi HEX ke RGB dan kembali, dan Anda punya kode yang sama dengan yang Anda mulai, dengan kemungkinan pengecualian huruf kapital.
Ia membawa transparansi
Nilai keempat untuk transparansi juga dibawa: #RRGGBBAA menjadi rgba(), dan kembali. Pasangan terakhir adalah kanal alfa, dari 00, sepenuhnya transparan, sampai FF, sepenuhnya buram. Jadi #5A463280 adalah rgba(90, 70, 50, 0,5), karena 80 dalam hex adalah 128, dan 128 dari 255 sekitar satu per dua. Delapan digit diterima oleh semua browser terkini.
Ia tidak dapat menggambarkan warna di luar sRGB
Kedua ejaan menggambarkan sRGB, ruang warna yang dipakai layar selama tiga puluh tahun. Keduanya tidak dapat menggambarkan warna di luarnya, yang menjadi alasan notasi CSS yang lebih baru, lab(), oklch(), dan color(), ada. Layar modern dapat menampilkan warna yang lebih jenuh daripada yang dimuat sRGB, dan desainer yang memilih warna semacam itu di alat gamut lebar akan melihatnya terpotong ke sRGB ketika ditulis sebagai hex.
Bentuk singkat diperluas, bukan dipertahankan
Bentuk singkat diperluas, bukan dipertahankan: #abc kembali sebagai #AABBCC, yaitu warna yang sama yang ditulis dengan cara panjang. Setiap digit digandakan. Itu berarti Anda dapat menempel kode tiga digit dan mendapat angka yang benar, tetapi Anda tidak dapat memulihkan ejaan singkat dari yang panjang hanya dengan melihatnya, hanya dengan memeriksa bahwa setiap pasangan berulang.
Warna umum dan angkanya
Beberapa untuk diingat
Putih adalah #FFFFFF, yaitu rgb(255, 255, 255): ketiga cahaya pada daya penuh. Hitam adalah #000000, rgb(0, 0, 0): tanpa cahaya sama sekali. Merah murni adalah #FF0000, hijau #00FF00, dan biru #0000FF. Abu-abu sedang adalah kode mana pun dengan tiga pasang yang sama, seperti #808080, yaitu rgb(128, 128, 128). Pasangan yang sama selalu berarti abu-abu, karena jumlah cahaya yang sama dari ketiganya tidak memberi rona.
Membaca kode sekilas
Setelah Anda tahu polanya, Anda dapat memperkirakan warna dari digit hex-nya. Kode yang dimulai dengan pasangan pertama yang tinggi kemerahan, pasangan tengah yang tinggi kehijauan, pasangan terakhir yang tinggi kebiruan. #FF8800 adalah banyak merah, sedikit hijau, dan tanpa biru, yaitu oranye. Anda tidak perlu alat untuk itu, tetapi Anda memerlukannya untuk angka yang eksak.
Cara konversi HEX ke RGB di sini
Ketik atau tempel kode hex
Masukkan warna di kolom pertama, dengan atau tanpa tanda pagar. Bentuk tiga, enam, dan delapan digit diterima.
Baca nilai rgb
Jawaban muncul seketika di kolom lain, dalam bentuk rgb(90, 70, 50), atau rgba() jika kodenya membawa transparansi. Halaman menampilkan kalimat #5A4632 = rgb(90, 70, 50) agar Anda dapat memeriksa sekilas.
Salin ke kode Anda
Tempel hasilnya ke stylesheet, skrip, atau alat yang memintanya. Jika Anda membutuhkan ketiga angka secara terpisah, angka itu ada di dalam kurung.
Dari mana notasi ini berasal
Hex dan RGB adalah hal yang sama yang ditulis dua kali
Warna layar adalah tiga angka, berapa banyak cahaya merah, hijau, dan biru yang dipancarkan, masing-masing dari 0 sampai 255, yaitu satu byte. Hex hanya menulis byte itu dalam basis enam belas, jadi #FF8800 dan rgb(255, 136, 0) adalah perintah yang sama untuk piksel yang sama.
HSL dan CMYK
HSL diciptakan karena tidak satu pun dari keduanya terbaca oleh manusia: ia memberi rona sebagai sudut mengelilingi roda warna, dengan kejenuhan dan kecerahan sebagai persentase, sehingga desainer dapat membuat sesuatu lebih terang tanpa menghitung ulang tiga angka. CMYK milik dunia yang sama sekali berbeda, tinta alih-alih cahaya. Ia subtraktif, dibangun dari empat pelat cetak, dan tidak dapat mencapai setiap warna yang dapat dicapai layar, karena layar memancarkan cahaya sedangkan kertas hanya memantulkannya. Untuk itu, lihat HEX ke HSL dan HEX ke CMYK.
Di mana Anda menemuinya
Di stylesheet
Hex adalah yang Anda ketik ke stylesheet dan yang diberikan alat desain kepada Anda. RGB muncul di mana pun warna membutuhkan aritmetika: gradasi, transparansi, kode yang menghitung nuansa. Mengetahui kedua ejaan, dan mampu berpindah di antaranya, adalah bagian dari pekerjaan front-end sehari-hari.
Di skrip dan gambar kanvas
Kode menggambar sering menginginkan ketiga angka secara terpisah, untuk memadukan dua warna, menggelapkan satu dengan jumlah tetap, atau menguji apakah piksel cocok dengan target. Mengonversi HEX ke RGB memberi Anda angkanya langsung.
Di alat grafis dan gambar
Penyunting gambar biasanya menampilkan warna sebagai tiga angka atau kode hex, dan membiarkan Anda mengetik salah satunya. Berpindah di antara keduanya memungkinkan Anda mereproduksi warna dari halaman web di program yang menginginkan angka.
Di dokumentasi dan panduan merek
Panduan merek mungkin mencantumkan warna dalam hex untuk web, dalam RGB untuk layar, dan dalam CMYK untuk cetak. Membuat dua yang pertama sepakat adalah soal satu konversi, dan itu jenis pemeriksaan yang menangkap salah ketik sebelum dicetak pada seribu selebaran.
Pemakaian praktis bentuk RGB
Transparansi tanpa warna kedua
Dengan rgba(90, 70, 50, 0,5) Anda mendapat warna pada separuh kekuatan, sehingga yang ada di belakangnya terlihat tembus. Itu cara standar untuk membuat hamparan, bayangan, dan latar belakang bertint dari warna merek tanpa menciptakan yang baru.
Menghitung nuansa lebih terang dan lebih gelap
Untuk membuat keadaan hover sedikit lebih gelap, skrip dapat mengurangi jumlah tetap dari setiap ketiga angka. Melakukan hal yang sama pada string hex canggung; pada rgb itu aritmetika sederhana. Jika Anda membutuhkan penyesuaian berbasis rona, konversi HEX ke HSL sebagai gantinya.
Pemeriksaan kontras
Alat aksesibilitas menghitung kontras antara dua warna dari nilai merah, hijau, dan birunya. Memiliki angkanya memungkinkan Anda melakukan perhitungan sendiri, atau menempelkannya ke pemeriksa, untuk memastikan teks pada latar belakang terbaca.
Jebakan saat konversi HEX ke RGB
Melupakan pasangan alfa
Kode delapan digit memiliki transparansi pada dua digit terakhir. Jika Anda membuangnya, Anda kehilangannya. Periksa panjang kode sebelum Anda memutuskan bahwa hasilnya adalah warnanya.
Mencampuradukkan urutan
Hex adalah merah, hijau, biru. Beberapa format, dan beberapa API grafis lama, memakai biru, hijau, merah. Jika warna keluar salah di program tertentu, periksa urutan kanalnya.
Menyalin dari tangkapan layar
Warna yang dibaca dari tangkapan layar adalah warna setelah manajemen warna layar dan kompresi apa pun. Ia mungkin sedikit berbeda dari warna di berkas sumber. Pakai berkas desain bila Anda bisa.
Menganggap layar sepakat
Dua layar menampilkan kode yang sama dengan sedikit berbeda. Angkanya eksak; yang Anda lihat bergantung pada layar dan profilnya.
Pertanyaan yang diajukan orang sebelum mengonversi
Apa #FF0000 dalam RGB?
rgb(255, 0, 0), merah murni.
Apa #FFFFFF dalam RGB?
rgb(255, 255, 255), putih.
Bisakah saya mengonversi kode tiga digit?
Ya. Setiap digit digandakan: #09C menjadi #0099CC, yaitu rgb(0, 153, 204).
Apakah konversinya eksak?
Ya. Itu dua ejaan untuk tiga angka yang sama.
Apakah warna saya diunggah?
Tidak. Aritmetikanya berjalan di browser Anda dan tidak ada yang dikirim ke mana pun.
Bagaimana cara kembali?
Dengan RGB ke HEX, yang menulis ketiga angka sebagai kode hex.
Memilih dengan bijak saat konversi HEX ke RGB
Ketahui apa yang Anda butuhkan berikutnya
Jika Anda membutuhkan transparansi, rgba() adalah bentuk yang wajar. Jika Anda perlu menyesuaikan kecerahan atau rona, HSL lebih mudah. Jika warna akan dicetak, CMYK adalah langkah berikutnya, dengan peringatan yang dibawa konversi itu. Lihat RGB ke CMYK.
Simpan hex sebagai induknya
Untuk warna dalam palet merek, simpan kode hex sebagai acuan. Ia pendek, tidak ambigu, dan dipahami di mana-mana. Turunkan bentuk lain darinya saat Anda membutuhkannya.
Pakai properti kustom
Dalam CSS, definisikan warna sekali, seperti --brand: #5A4632, dan rujuk dengan nama. Jika Anda membutuhkan angka untuk rgba(), definisikan juga --brand-rgb: 90 70 50. Konversi lalu dilakukan satu kali saja.
CSS modern dan bentuk RGB
Sintaks dipisahkan spasi
CSS terkini menerima rgb() dengan spasi dan garis miring untuk transparansi, seperti pada rgb(90 70 50 / 50%). Angkanya sama dengan bentuk koma, jadi hasil konversi berfungsi di keduanya. Browser lama dan beberapa alat mengharapkan koma, jadi bentuk koma tetap pilihan aman ketika Anda tidak tahu di mana warna akan dipakai.
Persentase dan pecahan
RGB juga dapat ditulis dengan persentase, seperti rgb(35% 27% 20%), di mana 100 persen adalah 255. Halaman memberi bilangan bulat karena itulah yang disimpan hex dan yang diharapkan sebagian besar alat. Jika Anda membutuhkan persentase, bagi setiap angka dengan 255 dan kalikan dengan 100.
Properti kustom untuk tiga angka
Trik yang lazim adalah menyimpan hanya ketiga angka dalam properti kustom, --brand-rgb: 90 70 50, dan memakainya sebagai rgb(var(--brand-rgb) / 0.5). Ia memungkinkan satu definisi melayani pemakaian solid dan tembus. Ketika Anda konversi HEX ke RGB untuk tujuan ini, salin hanya angkanya dari jawaban.
Bekerja dengan warna dalam praktik
Periksa terhadap panduan merek
Jika panduan merek memberi hex dan rgb untuk warna yang sama, konversikan satu dan bandingkan dengan yang lain. Ketidakcocokan biasanya berarti salah ketik di panduan, dan menemukannya sebelum dipakai di setiap halaman layak semenit yang dibutuhkan.
Simpan palet sebagai daftar pendek
Sebagian besar situs memakai lima sampai delapan warna. Tulis dalam catatan dalam kedua bentuk. Setiap kali Anda perlu konversi HEX ke RGB untuk komponen baru, Anda dapat mencarinya alih-alih menghitung lagi, dan palet tetap konsisten.
Beri nama warna menurut peran
Nama seperti utama, permukaan, dan peringatan bertahan dari desain ulang lebih baik daripada nama seperti hijau atau cokelat. Konversi memberi Anda angkanya; nama menyatakan untuk apa angka itu.
Konverter terkait
Keluarga alat yang sama mencakup konversi tetangganya. Untuk kembali, pakai RGB ke HEX. Untuk warna yang digambarkan dengan rona, HEX ke HSL dan HSL ke HEX tersedia, dan untuk cetak, HEX ke CMYK, CMYK ke HEX, dan CMYK ke RGB. Untuk ukuran dalam stylesheet yang sama, px ke rem dan px ke em melakukan untuk panjang apa yang dilakukan halaman ini untuk warna.
Contoh yang dikerjakan
Katakanlah warna merek Anda #1E7A5C dan Anda menginginkan versi tembus untuk latar belakang kartu. Anda mengetik kodenya dan membaca rgb(30, 122, 92). Di stylesheet Anda menulis background: rgba(30, 122, 92, 0,12), tint hijau yang sama yang sangat terang, dan batas rgba(30, 122, 92, 0,4). Kartu duduk nyaman pada halaman putih maupun abu-abu, karena transparansi membiarkan halaman tembus. Ketika warna merek kemudian diubah, Anda mengganti ketiga angka dalam satu properti kustom dan setiap tint mengikuti.
Daftar periksa singkat
Sebelum mengonversi
Periksa panjang kode: tiga, enam, atau delapan digit. Putuskan apakah Anda membutuhkan transparansi.
Saat mengonversi
Tempel kode, baca nilai rgb, dan salin dengan kurungnya, atau hanya ketiga angka.
Setelah mengonversi
Uji warna dalam konteks, pada latar belakang yang sebenarnya, dan periksa kontras teks apa pun yang berada di atasnya.
Kesalahan umum
Membuang pasangan transparansi
Delapan digit berarti alfa. Pertahankan atau konversikan ke rgba().
Mencampuradukkan urutan kanal
Hex dimulai dari merah. Beberapa alat mengharapkan biru lebih dulu.
Memperlakukan layar sebagai kebenaran
Angkanya eksak. Tampilannya bergantung pada layar.
Warna Anda tetap di perangkat Anda
Perhitungan terjadi secara lokal. Nilai Anda dipakai oleh browser Anda sendiri dan tidak ada yang dikirim ke mana pun. Tidak ada yang perlu dihapus sesudahnya dan tidak ada akun yang perlu dibuat. Itulah cara sederhana untuk konversi HEX ke RGB.
Ringkasan
Untuk konversi HEX ke RGB di sini, ketik atau tempel kode hex dan baca nilai rgb seketika. Konversi mempertahankan warna secara eksak: hex dan rgb() adalah dua ejaan untuk tiga angka yang sama, 0 sampai 255 untuk merah, hijau, dan biru, jadi tidak ada yang diperkirakan dan perjalanan bolak-balik mengembalikan apa yang dimulainya. Nilai keempat untuk transparansi juga dibawa, karena #RRGGBBAA menjadi rgba(), dan kembali. Kedua ejaan menggambarkan sRGB, jadi tidak dapat menggambarkan warna di luarnya, dan bentuk singkat diperluas, bukan dipertahankan: #abc kembali sebagai #AABBCC. Tidak ada yang diunggah.