Serene Coastal Color Palette
This refreshing palette of sky blues and vibrant greens exudes a serene coastal vibe, blending tranquil waters with lush, sunlit foliage for a lively yet calming atmosphere.
Practical uses and creative applications
The Serene Coastal Color Palette evokes the tranquility of ocean waves and sunlit shores, making it an ideal choice for brands and projects that aim to convey a sense of calm and freshness. With its soft blues (#A3E9F5, #1AA7D6) paired with earthy greens (#3DB97F, #8CD65C) and a deep oceanic hue (#1B4B8A), this palette is perfect for web design, packaging, and branding in industries such as wellness, travel, and eco-friendly products.
Designers looking to create a soothing aesthetic will find that these colors harmonize beautifully to enhance user experience and foster a welcoming atmosphere. For interior design, the Serene Coastal Color Palette brings a breath of fresh air to spaces, making it ideal for beach homes, spas, and relaxation areas.
The combination of soft and vibrant tones creates an inviting environment that promotes tranquility and rejuvenation. This palette is particularly appealing to creatives and designers who want to evoke feelings of serenity and connectedness to nature in their work.
Whether you're designing a logo, rebranding a business, or refreshing a living space, this color scheme will inspire and delight, ensuring your project stands out while maintaining a serene ambiance.
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.
| 50 | oklch(0.944 0.037 209.09) | #d1f4fa | hsl(189, 80%, 90%) |
|
|
| 100 | oklch(0.934 0.044 208.76) | #c8f2f9 | hsl(189, 80%, 88%) |
|
|
| 200 | oklch(0.924 0.051 208.54) | #bff0f8 | hsl(188, 80%, 86%) |
|
|
| 300 | oklch(0.911 0.058 209.70) | #b5edf7 | hsl(189, 80%, 84%) |
|
|
| 400 | oklch(0.901 0.065 209.47) | #acebf6 | hsl(189, 80%, 82%) |
|
|
| 500 | oklch(0.892 0.071 209.30) | #a3e9f5 | hsl(189, 80%, 80%) |
|
|
| 600 | oklch(0.828 0.110 210.13) | #63daee | hsl(189, 80%, 66%) |
|
|
| 700 | oklch(0.773 0.130 213.45) | #22cae7 | hsl(189, 80%, 52%) |
|
|
| 800 | oklch(0.626 0.107 213.84) | #1398af | hsl(189, 80%, 38%) |
|
|
| 900 | oklch(0.450 0.075 212.65) | #0c606e | hsl(189, 80%, 24%) |
|
|
| 950 | oklch(0.256 0.040 211.41) | #05282e | hsl(189, 80%, 10%) |
|
| 50 | oklch(0.934 0.033 220.55) | #d2eff9 | hsl(195, 76%, 90%) |
|
|
| 100 | oklch(0.881 0.063 220.78) | #aae2f5 | hsl(195, 79%, 81%) |
|
|
| 200 | oklch(0.830 0.088 221.07) | #83d5f0 | hsl(195, 78%, 73%) |
|
|
| 300 | oklch(0.783 0.110 222.26) | #5cc8eb | hsl(195, 78%, 64%) |
|
|
| 400 | oklch(0.738 0.126 225.27) | #35bae6 | hsl(195, 78%, 55%) |
|
|
| 500 | oklch(0.681 0.128 227.80) | #1aa7d6 | hsl(195, 78%, 47%) |
|
|
| 600 | oklch(0.601 0.111 227.12) | #168db4 | hsl(195, 78%, 40%) |
|
|
| 700 | oklch(0.517 0.096 227.95) | #127293 | hsl(195, 78%, 32%) |
|
|
| 800 | oklch(0.431 0.078 226.98) | #0e5871 | hsl(195, 78%, 25%) |
|
|
| 900 | oklch(0.340 0.059 225.34) | #0a3e4f | hsl(195, 78%, 17%) |
|
|
| 950 | oklch(0.240 0.039 224.71) | #06232d | hsl(195, 76%, 10%) |
|
| 50 | oklch(0.911 0.032 255.59) | #d4e3f7 | hsl(214, 69%, 90%) |
|
|
| 100 | oklch(0.808 0.069 255.36) | #a3c3ed | hsl(214, 67%, 78%) |
|
|
| 200 | oklch(0.707 0.108 255.47) | #72a3e3 | hsl(214, 67%, 67%) |
|
|
| 300 | oklch(0.609 0.149 256.28) | #4183da | hsl(214, 67%, 55%) |
|
|
| 400 | oklch(0.516 0.149 256.76) | #2566bb | hsl(214, 67%, 44%) |
|
|
| 500 | oklch(0.416 0.117 256.68) | #1b4b8a | hsl(214, 67%, 32%) |
|
|
| 600 | oklch(0.377 0.103 256.28) | #174177 | hsl(214, 68%, 28%) |
|
|
| 700 | oklch(0.335 0.090 256.96) | #143664 | hsl(215, 67%, 24%) |
|
|
| 800 | oklch(0.294 0.076 256.46) | #102c51 | hsl(214, 67%, 19%) |
|
|
| 900 | oklch(0.251 0.060 255.64) | #0c223e | hsl(214, 68%, 15%) |
|
|
| 950 | oklch(0.204 0.045 256.12) | #08172b | hsl(214, 69%, 10%) |
|
| 50 | oklch(0.940 0.031 165.29) | #d9f2e6 | hsl(151, 49%, 90%) |
|
|
| 100 | oklch(0.892 0.057 164.95) | #b9e8d2 | hsl(152, 51%, 82%) |
|
|
| 200 | oklch(0.843 0.082 163.69) | #99ddbd | hsl(152, 50%, 73%) |
|
|
| 300 | oklch(0.799 0.106 162.47) | #79d3a9 | hsl(152, 51%, 65%) |
|
|
| 400 | oklch(0.754 0.128 160.63) | #59c894 | hsl(152, 50%, 57%) |
|
|
| 500 | oklch(0.703 0.139 158.94) | #3db97f | hsl(152, 50%, 48%) |
|
|
| 600 | oklch(0.620 0.122 159.09) | #339c6b | hsl(152, 51%, 41%) |
|
|
| 700 | oklch(0.532 0.102 159.51) | #2a7e57 | hsl(152, 50%, 33%) |
|
|
| 800 | oklch(0.443 0.083 159.90) | #206143 | hsl(152, 50%, 25%) |
|
|
| 900 | oklch(0.348 0.064 159.46) | #16442e | hsl(151, 51%, 18%) |
|
|
| 950 | oklch(0.244 0.039 160.63) | #0d261a | hsl(151, 49%, 10%) |
|
| 50 | oklch(0.948 0.046 133.19) | #e2f5d6 | hsl(97, 61%, 90%) |
|
|
| 100 | oklch(0.918 0.072 133.41) | #d1efbe | hsl(97, 60%, 84%) |
|
|
| 200 | oklch(0.886 0.098 133.17) | #c0e8a5 | hsl(96, 59%, 78%) |
|
|
| 300 | oklch(0.857 0.124 133.62) | #afe28d | hsl(96, 59%, 72%) |
|
|
| 400 | oklch(0.829 0.150 134.24) | #9ddc74 | hsl(96, 60%, 66%) |
|
|
| 500 | oklch(0.802 0.173 134.78) | #8cd65c | hsl(96, 60%, 60%) |
|
|
| 600 | oklch(0.759 0.203 136.05) | #6fcc33 | hsl(96, 60%, 50%) |
|
|
| 700 | oklch(0.643 0.170 135.91) | #59a329 | hsl(96, 60%, 40%) |
|
|
| 800 | oklch(0.522 0.135 135.68) | #437a1f | hsl(96, 59%, 30%) |
|
|
| 900 | oklch(0.397 0.099 135.48) | #2d5215 | hsl(96, 59%, 20%) |
|
|
| 950 | oklch(0.256 0.058 135.15) | #16290a | hsl(97, 61%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection
