Make colors warmer or cooler and compare them on different backgrounds.
All color tools
Enter a valid HEX color.
Adjustment settings
Mixes in a warm amber or cool blue influence. Lightness and saturation can change too.
OriginalUnchanged
OriginalCool-leaningIts hue is closer to the blue reference than the amber reference.
AdjustedCool-leaningIts hue is closer to the blue reference than the amber reference.
See how surroundings change the color
Warm surroundings
Cool surroundings
Both center swatches are identical. Their surroundings can change how they appear.
CoolerWarmer
Explore warm and cool colors for design. This tool adjusts screen colors; it does not measure lighting temperature in kelvins.
Explore warm and cool color relationships
- Choose a starting color, check its warm/cool character, and slide toward a warmer or cooler variation.
- Open Adjustment settings to choose amber/blue blending or a hue shift. Expand the surroundings comparison to see the adjusted color on two backgrounds.
- Copy the adjusted shade, share the comparison, or edit the nine variations in Palette Generator.
- Download the original/adjusted pair or all nine variations as an image, SVG or CSS.
Warm/cool character compares the hue with amber and blue reference directions; near-neutral colors have little colorfulness. The identical center swatch can still feel different against peach and pale blue. This studio explores relative warmth in design; it does not measure Kelvin or perform camera white-balance calibration.
