Cool combinationsNatural calm
Blue and Green Color Combination
Blue and green are analogous, so the pair reads as one blue-green family — easy to look at for a long time and almost impossible to make clash.
Hex codes #0000FF and #008000 — a natural calm pair with a 1.67:1 contrast ratio between the two colors.
Values for this combination
- RGB
- rgb(0, 0, 255)
- HSL
- hsl(240, 100%, 50%)
- Hex
- #0000FF
- RGB
- rgb(0, 128, 0)
- HSL
- hsl(120, 100%, 25%)
- Hex
- #008000
Contrast between Blue and Green
Contrast ratio 1.67:1. This only decides whether one color of the pair can carry text on the other — the colors themselves always work side by side.
Green text on a Blue surface, at 1.67:1.
Blue text on a Green surface, at 1.67:1.
Where this pair works
- Health apps
- Sustainability brands
- Data dashboards
Give Blue (#0000FF) roughly 60% of the surface, Green (#008000) about 30%, and leave the last 10% for the neutral below. That split is what keeps a two-color combination from turning into a fight.
A five-color set from this pair
Blue and Green as a working palette: a pale tint of the lighter color for backgrounds, both colors as they are, a deep shade of the darker color for text and a neutral for everything in between.
- Pale tint#e1e1fabackgrounds and large surfaces · closest to Lavender
- Primary#0000FFthe dominant color · closest to Blue
- Secondary#008000the accent color · closest to Green
- Deep shade#004d00text, borders and icons · closest to DarkGreen
- Neutral#f4f4f6dividers and quiet surfaces · closest to WhiteSmoke
Explore Blue and Green on their own
Blue
More color combinations
Blue and Purple
#0000FF · #800080Creative confidenceOpen combinationBrown and Blue
#A52A2A · #0000FFUnexpected balanceOpen combinationTeal and Gray
#008080 · #808080Modern technicalOpen combinationNavy and SkyBlue
#000080 · #87CEEBTrusted rangeOpen combinationMidnightBlue and Cyan
#191970 · #00FFFFDeep techOpen combinationDenim and White
#1560BD · #FFFFFFEveryday denimOpen combinationBlue and Green are a natural calm pair: blue and green are analogous, so the pair reads as one blue-green family — easy to look at for a long time and almost impossible to make clash.
Frequently asked questions
Yes — this pair is used for health apps, sustainability brands, data dashboards. The two colors measure 1.67:1 against each other, which means the two should sit side by side as surfaces rather than as text and background.
Good to know
- Every value on this page is calculated from #0000FF and #008000 — nothing is hardcoded.
- Build a longer palette out of Blue or Green in the palette generator, or test your own text pair in the contrast checker.
Put this combination to work
Turn Blue and Green into a full palette, a gradient or a set of shades — or check the pair against WCAG.
