HEX to RGB Color Converter

Ano ang HEX Color Code?

Ang HEX color code ay isang anim na karakter na alphanumeric string na ginagamit sa web design at digital graphics upang katawanin ang isang partikular na kulay. Sinusunod ng format ang pattern na #RRGGBB, kung saan ang bawat dalawang karakter na pares ay nag-e-encode ng intensity ng isa sa tatlong additive primary colors — pula (RR), berde (GG), at asul (BB) — gamit ang hexadecimal notation (base 16). Ang bawat pares ay mula sa 00 (zero intensity) hanggang FF (maximum intensity, katumbas ng 255 sa decimal).

Ang mga HEX code ay nagmula sa pangangailangan na tukuyin ang mga kulay sa HTML at CSS nang hindi umaasa sa mga named color keywords. Bagama't sinusuportahan na ngayon ng CSS ang maraming format ng kulay kabilang ang rgb(), hsl(), at oklch(), ang HEX ay nananatiling pinakamalawak na ginagamit na notasyon sa front-end development, design handoff, at mga alituntunin sa branding. Halos bawat color picker sa mga tool tulad ng Figma, Sketch, Adobe Photoshop, at Canva ay nagpapakita ng HEX value bilang default.

Ang kabuuang bilang ng natatanging kulay na maaaring katawanin gamit ang anim-digit na HEX code ay 16,777,216 (256 × 256 × 256). Ito ay madalas na tinutukoy bilang "True Color" o "24-bit color," na tumutugma sa color depth ng karamihan sa mga modernong display. Ang bawat channel ay nakakakuha ng 8 bits (isang byte), at ang tatlong channel ay magkasamang gumagawa ng 24 bits ng color data.

Ang mga HEX code ay case-insensitive, kaya ang #ff8000 at #FF8000 ay tumutukoy sa parehong kulay. Ang ilang style guide ay mas gusto ang uppercase para sa pagiging madaling basahin, habang ang mga CSS minifier ay madalas na nagbibigay ng lowercase upang makatipid ng bytes — bagama't sa pagsasanay ang pagkakaiba ay walang gaanong kahalagan.

Paano Mag-convert ng HEX sa RGB Hakbang-hakbang

Ang pag-convert ng HEX color code sa katumbas na RGB ay simple. Ang proseso ay kinabibilangan ng paghahati ng anim na karakter na string sa tatlong pares at pag-convert ng bawat pares mula sa hexadecimal (base 16) patungong decimal (base 10). Narito ang hakbang-hakbang na paraan:

1. Alisin ang hash symbol. Kung ang HEX code ay nagsisimula sa #, alisin ito. Halimbawa, ang #1A2B3C ay nagiging 1A2B3C.
2. Hatiin sa tatlong pares. Hatiin ang natitirang string sa tatlong grupo ng dalawang karakter: 1A, 2B, 3C.
3. I-convert ang bawat pares sa decimal. Gamitin ang hexadecimal place-value system kung saan ang unang digit ay pinarami ng 16 at ang ikalawang digit ay idinaragdag:
   • Pula: 1A → (1 × 16) + 10 = 26
   • Berde: 2B → (2 × 16) + 11 = 43
   • Asul: 3C → (3 × 16) + 12 = 60
4. Isulat ang RGB value. Pagsamahin ang tatlong decimal value: rgb(26, 43, 60).

Ang mga hexadecimal digit at ang katumbas na decimal ay: 0=0, 1=1, 2=2, 3=3, 4=4, 5=5, 6=6, 7=7, 8=8, 9=9, A=10, B=11, C=12, D=13, E=14, F=15. Ang pagsasaulo ng A hanggang F ay ang tanging bahagi na naiiba mula sa karaniwang decimal arithmetic.

3-Digit kumpara 6-Digit na HEX Code

Sinusuportahan ng CSS ang isang maikling 3-digit na HEX format (#RGB) bilang kaginhawaan kapag ang bawat isa sa tatlong pares ay binubuo ng magkaparehong digit. Sa shorthand na ito, ang bawat iisang digit ay pinalawak sa pamamagitan ng pagdoble nito. Halimbawa:

• #F80 ay pinalawak sa #FF8800 → rgb(255, 136, 0)
• #FFF ay pinalawak sa #FFFFFF → rgb(255, 255, 255)
• #000 ay pinalawak sa #000000 → rgb(0, 0, 0)
• #09C ay pinalawak sa #0099CC → rgb(0, 153, 204)
• #A3F ay pinalawak sa #AA33FF → rgb(170, 51, 255)

Binabawasan ng 3-digit na notasyon ang bilang ng mga available na kulay mula sa 16.7 milyon hanggang 4,096 (16 × 16 × 16) lamang, kaya hindi nito maaaring katawanin ang bawat kulay. Karaniwang ginagamit ito para sa mga simple o kilalang kulay sa mga CSS file kung saan pinahahalagahan ang kaiklian.

Talahanayan ng Sanggunian ng HEX patungong RGB

Nasa ibaba ang isang talahanayan ng sanggunian ng mga karaniwang HEX na kulay at ang katumbas na RGB. Sinasaklaw ng talahanayang ito ang mga pinaka-madalas na ginamit na kulay sa web design, mga CSS named color, at mga sikat na brand palette.

Mga Sikat na Brand Color — HEX at RGB Values

Ang mga developer at designer ay madalas na nangangailangan ng eksaktong HEX at RGB values ng mga sikat na brand color para sa mga mockup, integration, at style guide. Narito ang isang mabilis na sanggunian para sa ilan sa mga pinaka-karaniwang hinihiling na brand color: