RGB Color Mixer
Mix any color by adjusting red, green, and blue channels. Copy the HEX, RGB, or HSL value for use in your designs.
Testing guide
How to use the RGB color mixer
Three sliders, one for each color channel, from 0 to 255. This is exactly how your display builds every color it can show, so mixing by channel is a direct way to understand the relationship between RGB values, hex codes and what actually appears on screen.
Best for
- Building a specific color channel by channel and copying the hex, RGB or HSL value.
- Learning how additive color mixing works, which is the opposite of mixing paint.
- Checking that each channel on your display responds evenly across its full range.
How to run the test
- 1Start with all three channels at 0, which produces black since no light is emitted.
- 2Raise one channel at a time to see that primary in isolation.
- 3Combine two channels to produce the secondary colors: red plus green gives yellow, red plus blue gives magenta, green plus blue gives cyan.
- 4Copy the hex, RGB or HSL output for use elsewhere.
How to read the result
All three channels at equal values always produces a neutral gray; any color cast at equal values means the display white balance is off.
All three at 255 produces white, and all three at 0 produces black, which is why this is called additive mixing.
If one channel looks disproportionately bright or dim at the same numeric value, the display channel balance is uneven.
Related tools and guides
Frequently asked questions
How does RGB color mixing work?
Displays use additive mixing: they emit light rather than reflect it, so adding more of each channel makes the result brighter. All three at maximum gives white, all three at zero gives black. This is the opposite of paint, where mixing everything gives a muddy dark color.
How do I convert RGB to hex?
Each channel value from 0 to 255 becomes a two-digit hexadecimal number, and the three are concatenated. For example 99, 102, 241 becomes 6366F1. The mixer shows both formats at once so you do not have to convert manually.
What are the secondary colors in RGB?
Combining any two primaries at full intensity gives a secondary: red and green make yellow, red and blue make magenta, and green and blue make cyan. These are the same colors used as primaries in subtractive printing, which is why CMYK and RGB are related.
Why does equal RGB not look perfectly gray on my monitor?
Equal values should produce neutral gray. If the result looks warm, cool, or tinted, the display white point or channel balance is off. Check the color temperature setting and compare against the White Balance Test.
What is the difference between RGB and HSL?
They describe the same colors in different terms. RGB matches how the hardware emits light, one value per channel. HSL matches how people describe color, using hue, saturation and lightness. This tool shows both for the same mixed color.
Testing guide
How to use the RGB color mixer
Three sliders, one for each color channel, from 0 to 255. This is exactly how your display builds every color it can show, so mixing by channel is a direct way to understand the relationship between RGB values, hex codes and what actually appears on screen.
Best for
- Building a specific color channel by channel and copying the hex, RGB or HSL value.
- Learning how additive color mixing works, which is the opposite of mixing paint.
- Checking that each channel on your display responds evenly across its full range.
How to run the test
- 1Start with all three channels at 0, which produces black since no light is emitted.
- 2Raise one channel at a time to see that primary in isolation.
- 3Combine two channels to produce the secondary colors: red plus green gives yellow, red plus blue gives magenta, green plus blue gives cyan.
- 4Copy the hex, RGB or HSL output for use elsewhere.
How to read the result
All three channels at equal values always produces a neutral gray; any color cast at equal values means the display white balance is off.
All three at 255 produces white, and all three at 0 produces black, which is why this is called additive mixing.
If one channel looks disproportionately bright or dim at the same numeric value, the display channel balance is uneven.
Related tools and guides
Frequently asked questions
How does RGB color mixing work?
Displays use additive mixing: they emit light rather than reflect it, so adding more of each channel makes the result brighter. All three at maximum gives white, all three at zero gives black. This is the opposite of paint, where mixing everything gives a muddy dark color.
How do I convert RGB to hex?
Each channel value from 0 to 255 becomes a two-digit hexadecimal number, and the three are concatenated. For example 99, 102, 241 becomes 6366F1. The mixer shows both formats at once so you do not have to convert manually.
What are the secondary colors in RGB?
Combining any two primaries at full intensity gives a secondary: red and green make yellow, red and blue make magenta, and green and blue make cyan. These are the same colors used as primaries in subtractive printing, which is why CMYK and RGB are related.
Why does equal RGB not look perfectly gray on my monitor?
Equal values should produce neutral gray. If the result looks warm, cool, or tinted, the display white point or channel balance is off. Check the color temperature setting and compare against the White Balance Test.
What is the difference between RGB and HSL?
They describe the same colors in different terms. RGB matches how the hardware emits light, one value per channel. HSL matches how people describe color, using hue, saturation and lightness. This tool shows both for the same mixed color.