#B5E48C
#52B69A
#168AAD
#F6F9EE
#90EBAASeafoam
#40B5B3Cadet
#4183B9Steel Blue
#F6F9EESmoke
Seafoam & Steel Blue Path is a split color palette tagged summer, cold, green. A split scheme: Seafoam plays against Steel Blue across roughly 70° of hue. Saturation is moderate, which keeps it flexible for both interfaces and print. The overall temperature is cool.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Seafoam | #90EBAA | rgb(144, 235, 170) | hsl(137, 69%, 74%) | oklch(86.6% 0.126 152) | |
| Cadet | #40B5B3 | rgb(64, 181, 179) | hsl(179, 48%, 48%) | oklch(70.8% 0.103 193) | |
| Steel Blue | #4183B9 | rgb(65, 131, 185) | hsl(207, 48%, 49%) | oklch(59.1% 0.107 246) | |
| Smoke | #F6F9EE | rgb(246, 249, 238) | hsl(76, 48%, 95%) | oklch(97.7% 0.015 119) |
Why it works and how to use it
It works because the lightness range is wide (48% to 95%), which gives clear hierarchy between background, content and accents. Try it for websites, presentations and branding.
- Background: Smoke (#F6F9EE) is the lightest color, so it belongs on large surfaces.
- Text: Steel Blue (#4183B9) on #F6F9EE gives 3.81:1, enough for large headings only.
- Primary: Seafoam (#90EBAA) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Cadet (#40B5B3) for highlights, badges and hover states.
No pair inside the palette reaches 4.5:1, so add black or white for body text.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Seafoam & Steel Blue Path
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
#90EBAA
#40B5B3
#4183B9
#F6F9EE
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#4183B9 on #F6F9EE | Aa | 3.81:1 | AA large only |
#90EBAA on #4183B9 | Aa | 2.83:1 | Fail |
#40B5B3 on #F6F9EE | Aa | 2.32:1 | Fail |
#90EBAA on #40B5B3 | Aa | 1.73:1 | Fail |
#40B5B3 on #4183B9 | Aa | 1.64:1 | Fail |
#90EBAA on #F6F9EE | Aa | 1.34:1 | Fail |
Similar palettes 24 more in this mood
#00C184
#64D2FC
#A9D875
#3DEEEC
#0077B6
#00B4D8
#90E0EF
#CAF0F8
#00B0CA
#79D213
#00ED9D
#58FDEE
#5AA2D9
#8BB1FF
#00CED9
#5ED8FF
#7CEAE6
#35D7FF
#74BDFD
#788BF6
#A4DCFF
#60D7D5
#00AF8D
#00A4BF
#00C187
#00C7C5
#94C173
#9DE4FF
#007D9B
#00B8BD
#90E3DD
#CAF1EF
#92A026
#39C137
#33CFA4
#2EDEE0
#3EF58F
#7DCD20
#00BFC0
#00A78A
#736F00
#008F72
#938F00
#E3F6EF
#3596D7
#40D1F5
#AFF2FF
#F1FDFF
#DED871
#75B37B
#008F94
#F6F9EE
#589DFF
#03BA89
#88DCFF
#01F1F4
#C3DDAE
#7DAD9D
#568598
#F7F8F2
#FFB703
#FB8500
#219EBC
#8ECAE6
#54C3C7
#2DCCFF
#9BCAFF
#7AF0CE
#00A6FB
#0582CA
#F5F0E1
#F4A261
#00ABAA
#59BCFF
#00D7FF
#00E5B5
#F1EDEA
#C2AA9C
#3278FF
#241E1B
#C3E9FF
#52E1FF
#66AFFF
#6E8AFF
#4F6BBD
#53AAEC
#9EDAFF
#D1EDFF
#00AECD
#20B7FF
#42E1C0
#71EFF0