Hex Color Explorer — TechKnowSurge

About this interactive

What you're seeing: two panels running the same conversion in opposite directions. On the left, three overlapping circles of red, green and blue light, the combined #RRGGBB code for the color where all three meet, and three sliders that set each channel, showing its decimal value beside its two hex digits. On the right, a hex code shown alone with no color attached, a box for your prediction of each channel, and a reveal that shows the true values, the swatch and how far off you were. Why it matters: reading one pair of hex digits — first digit times sixteen, plus the second — is the single skill behind hex color codes, MAC addresses and IPv6 hextets, and the direction that matters on the job is the hard one, hex to decimal, not decimal to hex. How to use it: turn the lights up and down until the overlaps make sense and the arithmetic in the note under them reads as obvious, then move to the right-hand panel and always commit to all three numbers before revealing; press Next code for another, and hunt for the codes whose digits are letters, because A–F is where the conversion actually gets tested.

How to use this tool

A hex color code is six characters that are really three separate bytes — two hex digits for red, two for green, two for blue. This tool runs that conversion in both directions, one panel each.

Panel 01 — mix to hex code. The three circles are three lights: red, green and blue. Drag the R, G and B sliders to turn each one up or down. Where two circles overlap their light adds — red and green make yellow, green and blue make cyan, red and blue make magenta — and the middle, where all three meet, is the color your screen actually shows. Each channel is one byte, a number from 0 to 255, and beside its decimal value are the same number's two hex digits. The #RRGGBB code next to the circles names the color in the middle, and the note underneath spells out the arithmetic for the strongest channel: 194 = C2, because C is twelve sixteens (192) and 2 adds two more.

Panel 02 — hex code to RGB. A hex code appears with no color attached. Work out a decimal value for all three channels before you press Reveal. That order is the whole exercise: reading the answer teaches almost nothing, but committing to one first tells you exactly which conversions you can actually do. The reveal shows each channel's true value, your value, and the signed difference. Press Next code for another.

Do the hard direction as first digit × 16, then add the second. The codes with letters in them are the ones worth hunting for — A=10, B=11, C=12, D=13, E=14, F=15 — because that is where base 16 stops looking like base 10.

Nothing here is graded and the running tally is yours alone. The skill carries straight out of color: a MAC address is six bytes written as twelve hex digits, and each hextet of an IPv6 address is read the same way.

What you'll learn

Convert a two-digit hexadecimal value to its decimal equivalent from 0 to 255, and convert a decimal value back to two hex digits
Read a six-character hex color code as three independent one-byte fields rather than as one long number, the same grouping used by MAC addresses and IPv6 hextets
Predict the color red, green and blue light produce where they overlap, and explain why equal amounts of all three make a grey from black to white

Aligned to

CompTIA Tech+

1.1 Compare and contrast notational systems.

1.2 Compare and contrast fundamental data types and their characteristics.

2.7 Explain basic networking concepts.

Cisco CCST Networking

2.3 Identify IPv6 addresses and prefix formats.

Key terms

Hexadecimal: A base-16 number system using digits 0–9 and letters A–F; each hex digit maps to exactly 4 bits, making it a compact shorthand for representing binary data.
Byte: A group of 8 bits; the standard unit for representing a single character or small value in computing, and the building block for larger storage measurements such as kilobytes and gigabytes.
RGB: A color model that represents colors by combining red, green, and blue light at varying intensities to produce any visible color on a display.
Color Depth: The number of bits or bytes used to encode color information per pixel, determining how many distinct colors an image can display.
MAC Address: A 48-bit hardware address assigned to a network interface and written as six hexadecimal octets, such as 00:1A:2B:3C:4D:5E. It identifies a device uniquely on a local network segment, and switches forward frames by looking it up in their MAC address table.
Hextet: A group of four hexadecimal digits in an IPv6 address; eight hextets separated by colons form a complete 128-bit IPv6 address.

Topics

Hexadecimal Hex Number Systems Base 16 Data Representation Rgb Color Conversion Additive Color Light

About TechKnowSurge

TechKnowSurge builds IT and cybersecurity professionals through hands-on, concept-first training built around real understanding — not memorization. Free interactive tools, structured programs, and 25+ years of real-world experience, all in one place.

Explore free tools and programs →