What Color Does Yellow and Red Make?

Mix pure yellow (#FFFF00) and pure red (#FF0000) and you move along the warm side of the wheel toward orange. This page lists yellow first for search intent—use the simulator above, then compare ratio presets below.

Color 1

#FFFF00

Color 2

#FF0000

Mixed Result

HEX: #ECA400

RGB: 236, 164, 0

Closest name: Orange

Yellow + Red = Orange

Want more mixes? Explore the full Color Mixing Simulator.

Quick answer

Yellow + Red = Orange (#FF8000)

Swatch shows the headline mix color—compare with the ratio table and adjust live in the simulator.

Why this mix looks the way it does

In subtractive paint (RYB) thinking, red and yellow are both primaries; combining them removes short-wavelength reflectance and pushes hue toward orange. In RGB displays, averaging saturated yellow and red still lands in the orange family, but pigment opacity, undertone, and layering change what you see on canvas. The table uses fixed hex steps centered on #FF8000 so designers can align language (“deep orange”, “amber”) with copy-paste values.

Five mix ratios (hex previews)

Ratios describe how much of each primary contributes to the blend; hex values are reference stops for design tokens and mood boards.

MixNameSwatchHexCopy
80% yellow + 20% redAmber#FFB300
60% yellow + 40% redGolden orange#FF9900
50% yellow + 50% redTrue orange#FF8000
40% yellow + 60% redVivid orange#FF6600
20% yellow + 80% redDeep orange#CC5500

Using this combination in UI and brand design

Use yellow–orange for optimism and red–orange for urgency; keep one dominant temperature per screen so CTAs do not fight each other. Pair saturated oranges with charcoal text on white, or with cream backgrounds for editorial warmth. After locking a hero gradient, run button and link colors through accessibility checks before shipping.

Build harmonious ramps and harmonies from any swatch above in the palette generator, then validate text, links, and buttons with the contrast checker.