#0077B6
#00B4D8
#90E0EF
#CAF0F8
#EFFAD2Beige
#D3F07EMaize
#7ABEFFBaby Blue
#324369Charcoal
Maize & Baby Blue Shore is a vivid complementary color palette tagged summer, cold, blue. Beige and Charcoal sit nearly opposite on the color wheel, so the pairing has real energy; keep one as the accent. These are bold, punchy colors that need generous white space around them. The overall temperature is cool.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Beige | #EFFAD2 | rgb(239, 250, 210) | hsl(76, 80%, 90%) | oklch(96.7% 0.053 120) | |
| Maize | #D3F07E | rgb(211, 240, 126) | hsl(75, 79%, 72%) | oklch(91.0% 0.144 121) | |
| Baby Blue | #7ABEFF | rgb(122, 190, 255) | hsl(209, 100%, 74%) | oklch(78.2% 0.116 248) | |
| Charcoal | #324369 | rgb(50, 67, 105) | hsl(221, 35%, 30%) | oklch(38.7% 0.069 265) |
Why it works and how to use it
With 4 chromatic colors, Baby Blue takes the lead while the rest support. Lightness runs from 30% to 90%. Well suited to websites, presentations and branding.
- Background: Beige (#EFFAD2) is the lightest color, so it belongs on large surfaces.
- Text: Charcoal (#324369) on #EFFAD2 gives 9:1, passing WCAG AAA.
- Primary: Baby Blue (#7ABEFF) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Maize (#D3F07E) for highlights, badges and hover states.
3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Beige on Charcoal at 9:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Maize & Baby Blue Shore
A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.
Primary action SecondaryCard title
Card title
Card title
Roles are assigned by lightness.
Color blindness simulation
#EFFAD2
#D3F07E
#7ABEFF
#324369
Color-blind check: under tritanopia, Beige and Maize become hard to tell apart, so do not rely on that pair alone to carry meaning.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#EFFAD2 on #324369 | Aa | 9:1 | AAA |
#D3F07E on #324369 | Aa | 7.72:1 | AAA |
#7ABEFF on #324369 | Aa | 4.96:1 | AA |
#EFFAD2 on #7ABEFF | Aa | 1.81:1 | Fail |
#D3F07E on #7ABEFF | Aa | 1.55:1 | Fail |
#EFFAD2 on #D3F07E | Aa | 1.17:1 | Fail |
Similar palettes 24 more in this mood
#5AA2D9
#8BB1FF
#00CED9
#5ED8FF
#00C184
#64D2FC
#A9D875
#3DEEEC
#7CEAE6
#35D7FF
#74BDFD
#788BF6
#90EBAA
#40B5B3
#4183B9
#F6F9EE
#54C3C7
#2DCCFF
#9BCAFF
#7AF0CE
#A4DCFF
#60D7D5
#00AF8D
#00A4BF
#00C187
#00C7C5
#94C173
#9DE4FF
#007D9B
#00B8BD
#90E3DD
#CAF1EF
#C3E9FF
#52E1FF
#66AFFF
#6E8AFF
#4F6BBD
#53AAEC
#9EDAFF
#D1EDFF
#5BA4CF
#A8D5F2
#F2E8D5
#4A4238
#497697
#6DADC0
#B0DAE2
#D8ECF1
#3596D7
#40D1F5
#AFF2FF
#F1FDFF
#B5E48C
#52B69A
#168AAD
#F6F9EE
#51AAEC
#9DDAFF
#DCE071
#1B1B1E
#589DFF
#03BA89
#88DCFF
#01F1F4
#FFB703
#FB8500
#219EBC
#8ECAE6
#00B0CA
#79D213
#00ED9D
#58FDEE
#FFF4CC
#FFE066
#4CC9F0
#1B4965
#00A6FB
#0582CA
#F5F0E1
#F4A261
#92A026
#39C137
#33CFA4
#2EDEE0
#3EF58F
#7DCD20
#00BFC0
#00A78A
#00ABAA
#59BCFF
#00D7FF
#00E5B5