Warm vs Cool Colors: How Color Temperature Works

Color temperature is one of the quickest ways to describe a color and one of the most useful ways to control a design. Warm colors, such as reds, oranges and yellows, tend to feel active and close. Cool colors, such as blues, greens and violets, tend to feel calm and distant. Our Color Theory: A Complete Beginner's Guide introduces the idea in a few lines. This guide goes further: where the line between warm and cool really sits, why it moves, and how to use temperature on purpose.

Which colors are warm and which are cool

Split the color wheel in two and you get a rough map. The warm half runs from red through orange to yellow. The cool half runs from green through cyan and blue to violet. On a digital wheel, where hue is an angle, warm hues sit roughly between 0 and 60 degrees and cool hues roughly between 150 and 270 degrees.

The hues between the two halves are the interesting ones. Yellow-green and magenta sit on the borders, and they can read either way depending on what surrounds them. A yellow-green next to a blue looks warm, while the same color next to an orange looks cool.

Why the line moves

Temperature is relative. Every hue can lean warmer or cooler, so it is more accurate to say a color is warmer or cooler than another than to file it in a fixed box.

Cool reds and warm blues

Red is the classic warm color, yet a red that leans toward pink and violet feels cooler than one that leans toward orange. Compare #EA580C, an orange-red at hsl(21, 90%, 48%), with #E11D48, a crimson at hsl(347, 77%, 50%). Both are red, but the crimson sits on the blue side of red and reads as noticeably cooler. The same works in reverse: a blue that leans toward green feels warmer than a blue that leans toward violet.

Warm grays and cool grays

Neutrals have temperature too. A perfectly neutral gray has no hue, but most grays used in design carry a hint of one. A gray with a little yellow, orange or red in it reads as warm and soft, like stone or linen. A gray with a little blue reads as cool and crisp, like slate or steel. The amount is tiny: the warm gray #78716C has only 5% saturation at a hue of 25 degrees, while the cool gray #64748B has 16% saturation at 215 degrees.

How temperature creates depth

Warm colors tend to appear to come forward, and cool colors tend to appear to recede. Painters have used this for centuries. In a landscape, distant hills look bluer, paler and less saturated because of the air between you and them, an effect known as atmospheric or aerial perspective. Painting the background cooler and the foreground warmer imitates it and creates a sense of distance on a flat surface.

The same idea works in interfaces. Cool, quiet colors make good backgrounds and large surfaces because they stay in the background. A warm accent placed on top, such as an orange button or a coral badge, appears to sit in front of everything else. Saturation and lightness play a part too: a warm color that is muted and pale recedes more than a vivid cool one, so temperature is one lever among several, not a rule that overrides the rest.

Temperature and mood

Warm palettes can feel energetic, friendly and inviting. Cool palettes can feel calm, clean and professional. These are tendencies people learn from experience, such as fire and sunlight on one side and water, sky and shade on the other, so they vary with culture and context. Our guide to color psychology covers those associations in more detail.

• A food or hospitality brand often leans warm, because warm colors can suggest appetite, comfort and welcome.
• Finance, health and productivity products often lean cool, because cool colors can suggest calm, trust and order.
• A warm palette pushed to full saturation can feel loud or urgent, which suits a sale banner more than a reading app.
• A cool palette with no warmth at all can feel cold or clinical, which a single warm accent fixes quickly.

Warm and cool in a room

In interiors, temperature changes how big and how cozy a space feels. Warm wall colors can make a large room feel more intimate, and painting the far wall of a long room in a warm color can make it appear closer. Cool, light wall colors can make a small room feel more open, because they seem to recede.

Light matters as much as paint. Bulbs are rated in kelvin: lower numbers, around 2700K, give a yellowish warm white, while higher numbers, around 5000K and above, give a bluish cool white. Warm light pushes every color in the room warmer and cool light pushes it cooler, so always judge paint samples under the light the room will actually use.

Mixing warm and cool on purpose

Most good palettes are not purely warm or purely cool. They pick one temperature to lead and use the other in a small amount for contrast. That creates focus without chaos.

1. Pick a dominant temperature that matches the mood you want, and use it for backgrounds and large surfaces.
2. Match your neutrals to it: warm grays with a warm palette, cool grays with a cool one.
3. Add the opposite temperature in a small dose, such as one button, an icon or a highlight, where you want the eye to go.
4. Check that the accent works through lightness as well as hue, so it still stands out for people who see color differently.

Open any of these in the generator to adjust them, or in the visualizer to see how the balance of warm and cool plays out on a website, a poster or a room.

Common mistakes

• Mixing warm and cool neutrals in one interface, so the grays look slightly dirty next to each other.
• Using equal amounts of warm and cool, so neither leads and the layout feels split in two.
• Treating temperature as fixed, and forgetting that a crimson or a greenish blue changes temperature with its neighbors.
• Relying on temperature alone to signal importance; a warm accent still needs enough lightness contrast to stand out.
• Choosing paint under one kind of light and living with it under another.

Try it yourself

Drag a color around the Color Wheel Explorer and watch it cross from the warm half to the cool half. Then pick a harmony rule and notice how many of its colors land on each side. A complementary pair almost always puts one color on each side, which is a big part of why it feels so lively.