What Color Does Blue and Green Make?
Combining blue (#0000FF) with green (#008000) pulls hue toward teal—common for “trust + growth” palettes. Adjust sliders above, then map ratios below to tokens.
Color 1
#0000FF
Color 2
#008000
Mixed Result
HEX: #0055A9
RGB: 0, 85, 169
Closest name: Teal
Blue + Green = Teal
Want more mixes? Explore the full Color Mixing Simulator.
Quick answer
Blue + Green = Teal (#008080)
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
Both blue and green sit on the cool side of the wheel; mixing them deepens the hue and lowers perceived warmth versus blue plus yellow. In natural language, users often call these results “teal”, “peacock”, or “sea glass”. Pigment behavior depends on whether your green leans yellow (olive) or blue (phthalocyanine)—the presets here anchor on web teal (#008080) for digital handoff.
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.
| Mix | Name | Swatch | Hex | Copy |
|---|---|---|---|---|
| 80% blue + 20% green | Deep blue | #003399 | ||
| 60% blue + 40% green | Navy teal | #004D66 | ||
| 50% blue + 50% green | True teal | #008080 | ||
| 40% blue + 60% green | Sea teal | #006666 | ||
| 20% blue + 80% green | Deep sea green | #00804D |
Using this combination in UI and brand design
Teals work for health, climate, and finance dashboards when you need calmer alternatives to pure blue. Use darker rows for navigation and lighter rows for chart fills. Keep long-form text on white or gray, and run every teal-on-gray pair through the contrast checker after you branch scales in the palette generator.
Build harmonious ramps and harmonies from any swatch above in the palette generator, then validate text, links, and buttons with the contrast checker.