Coastal Serenity Color Palette
This palette radiates a serene yet vibrant coastal vibe, blending soft whites with refreshing blues and a striking green, evoking a tranquil seaside escape infused with modern sophistication.
Practical uses and creative applications
The Coastal Serenity Color Palette is a harmonious blend of soft neutrals and vibrant oceanic hues that evoke a sense of tranquility and freshness. Featuring delicate shades like #F9F9F7, a soothing off-white, alongside deeper blues and greens such as #4C90EE and #1F5263, this palette is ideal for branding and web design aimed at conveying calmness and reliability.
Designers looking to create a serene online presence or a memorable brand identity will find these colors particularly effective in connecting with an audience that values relaxation and sophistication. Perfect for packaging and interiors, the Coastal Serenity palette can transform any space into a peaceful retreat.
The inclusion of #24D172 adds a lively touch, making it suitable for products aimed at wellness, home decor, or outdoor lifestyles. Creatives in the hospitality or lifestyle sectors can use this palette to craft environments that invite comfort and leisure, appealing to clientele seeking a coastal escape.
Whether for a beachside café, a spa, or an online store, this color scheme effortlessly encapsulates the essence of serene seaside living.
Tailwind color scales
Browse Tailwind CSS color scales. Copy OKLCH, HEX, or HSL with one click. Preview colors in real UI examples and check contrast for accessibility.
dsfds
| 50 | oklch(0.932 0.009 106.58) | #e9e9e2 | hsl(60, 14%, 90%) |
|
|
| 100 | oklch(0.941 0.008 106.55) | #ecece6 | hsl(60, 14%, 91%) |
|
|
| 200 | oklch(0.951 0.007 106.53) | #efefea | hsl(60, 14%, 93%) |
|
|
| 300 | oklch(0.963 0.005 106.50) | #f3f3ef | hsl(60, 14%, 95%) |
|
|
| 400 | oklch(0.972 0.004 106.47) | #f6f6f3 | hsl(60, 14%, 96%) |
|
|
| 500 | oklch(0.982 0.003 106.45) | #f9f9f7 | hsl(60, 14%, 97%) |
|
|
| 600 | oklch(0.863 0.020 106.82) | #d3d3c4 | hsl(60, 15%, 80%) |
|
|
| 700 | oklch(0.740 0.039 107.31) | #adad91 | hsl(60, 15%, 62%) |
|
|
| 800 | oklch(0.601 0.048 107.75) | #838362 | hsl(60, 14%, 45%) |
|
|
| 900 | oklch(0.425 0.032 107.67) | #50503c | hsl(60, 14%, 27%) |
|
|
| 950 | oklch(0.228 0.013 107.39) | #1d1d16 | hsl(60, 14%, 10%) |
|
dsfds
| 50 | oklch(0.907 0.039 256.59) | #d0e2fb | hsl(215, 84%, 90%) |
|
|
| 100 | oklch(0.856 0.061 256.10) | #b6d2f8 | hsl(215, 83%, 84%) |
|
|
| 200 | oklch(0.803 0.086 256.77) | #9bc1f6 | hsl(215, 83%, 79%) |
|
|
| 300 | oklch(0.752 0.109 256.52) | #81b1f3 | hsl(215, 83%, 73%) |
|
|
| 400 | oklch(0.701 0.134 256.95) | #66a0f1 | hsl(215, 83%, 67%) |
|
|
| 500 | oklch(0.654 0.157 257.03) | #4c90ee | hsl(215, 83%, 62%) |
|
|
| 600 | oklch(0.573 0.197 258.42) | #1c72e9 | hsl(215, 82%, 51%) |
|
|
| 700 | oklch(0.490 0.171 258.47) | #125bbf | hsl(215, 83%, 41%) |
|
|
| 800 | oklch(0.400 0.136 258.37) | #0e448f | hsl(215, 82%, 31%) |
|
|
| 900 | oklch(0.305 0.098 258.03) | #092d5f | hsl(215, 83%, 20%) |
|
|
| 950 | oklch(0.201 0.056 256.21) | #04162f | hsl(215, 84%, 10%) |
|
dsfds
| 50 | oklch(0.917 0.020 250.39) | #dae5f1 | hsl(211, 45%, 90%) |
|
|
| 100 | oklch(0.797 0.051 250.32) | #a5c0dd | hsl(211, 45%, 76%) |
|
|
| 200 | oklch(0.674 0.084 251.85) | #709ac9 | hsl(212, 45%, 61%) |
|
|
| 300 | oklch(0.553 0.105 252.56) | #4275ae | hsl(212, 45%, 47%) |
|
|
| 400 | oklch(0.430 0.077 251.77) | #2e5279 | hsl(211, 45%, 33%) |
|
|
| 500 | oklch(0.295 0.048 251.86) | #1a2e44 | hsl(211, 45%, 18%) |
|
|
| 600 | oklch(0.280 0.044 252.03) | #182a3e | hsl(212, 44%, 17%) |
|
|
| 700 | oklch(0.263 0.041 250.92) | #152638 | hsl(211, 45%, 15%) |
|
|
| 800 | oklch(0.243 0.036 252.56) | #132131 | hsl(212, 44%, 13%) |
|
|
| 900 | oklch(0.226 0.033 251.18) | #101d2b | hsl(211, 46%, 12%) |
|
|
| 950 | oklch(0.209 0.029 251.39) | #0e1925 | hsl(211, 45%, 10%) |
|
dsfds
| 50 | oklch(0.930 0.023 220.73) | #d8ecf3 | hsl(196, 53%, 90%) |
|
|
| 100 | oklch(0.842 0.052 219.77) | #a6d4e3 | hsl(195, 52%, 77%) |
|
|
| 200 | oklch(0.756 0.079 220.36) | #74bcd3 | hsl(195, 52%, 64%) |
|
|
| 300 | oklch(0.672 0.102 224.01) | #42a3c4 | hsl(195, 52%, 51%) |
|
|
| 400 | oklch(0.550 0.083 223.04) | #2f7c95 | hsl(195, 52%, 38%) |
|
|
| 500 | oklch(0.412 0.061 223.28) | #1f5263 | hsl(195, 52%, 25%) |
|
|
| 600 | oklch(0.377 0.055 223.17) | #1b4857 | hsl(195, 53%, 22%) |
|
|
| 700 | oklch(0.342 0.049 223.03) | #173e4b | hsl(195, 53%, 19%) |
|
|
| 800 | oklch(0.306 0.042 223.38) | #14343f | hsl(195, 52%, 16%) |
|
|
| 900 | oklch(0.269 0.036 223.29) | #102a33 | hsl(195, 52%, 13%) |
|
|
| 950 | oklch(0.230 0.029 223.20) | #0c2027 | hsl(196, 53%, 10%) |
|
dsfds
| 50 | oklch(0.947 0.047 161.79) | #d3f8e4 | hsl(148, 73%, 90%) |
|
|
| 100 | oklch(0.904 0.083 160.31) | #aff1cd | hsl(147, 70%, 82%) |
|
|
| 200 | oklch(0.866 0.119 158.68) | #8aebb6 | hsl(147, 71%, 73%) |
|
|
| 300 | oklch(0.832 0.151 156.61) | #66e59f | hsl(147, 71%, 65%) |
|
|
| 400 | oklch(0.800 0.178 154.48) | #41de88 | hsl(147, 70%, 56%) |
|
|
| 500 | oklch(0.758 0.189 152.46) | #24d172 | hsl(147, 71%, 48%) |
|
|
| 600 | oklch(0.667 0.165 152.65) | #1eb060 | hsl(147, 71%, 40%) |
|
|
| 700 | oklch(0.573 0.140 152.84) | #198f4e | hsl(147, 70%, 33%) |
|
|
| 800 | oklch(0.475 0.114 153.21) | #136e3c | hsl(147, 71%, 25%) |
|
|
| 900 | oklch(0.372 0.086 153.86) | #0d4d2a | hsl(147, 71%, 18%) |
|
|
| 950 | oklch(0.261 0.056 155.36) | #072c18 | hsl(148, 73%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.
