Coastal Calm Color Palette
This palette exudes a vibrant, serene energy with deep navy and teal tones offset by refreshing greens, evoking a coastal calmness infused with a touch of lively optimism.
Practical uses and creative applications
The Coastal Calm Color Palette evokes the serene beauty of ocean landscapes, making it an ideal choice for designers looking to create tranquil and refreshing spaces. With deep blues like #0c0636 and #095169, paired with vibrant aquas (#059b9a) and soothing greens (#53ba83 and #9fd86b), this palette is perfect for branding projects that aim to convey a sense of peace and reliability.
Whether you're designing a logo for a wellness brand or crafting an inviting website for a coastal retreat, these colors harmonize beautifully to create a cohesive and calming aesthetic. This versatile color palette is especially well-suited for web design, packaging, and interior decor.
Brands targeting audiences who appreciate nature and sustainabilitysuch as eco-friendly products, beach resorts, or health and wellness serviceswill find that the Coastal Calm Color Palette enhances their visual identity. Designers and creatives can use these colors to build environments that promote relaxation, making them perfect for spas, yoga studios, and coastal-themed restaurants.
By incorporating this palette into your projects, you can evoke the tranquil essence of the sea and inspire a sense of calm and connection with nature.
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.878 0.056 290.78) | #d6d1fa | hsl(247, 80%, 90%) |
|
|
100 | oklch(0.687 0.151 287.39) | #9689f2 | hsl(247, 80%, 74%) |
|
|
200 | oklch(0.514 0.239 279.72) | #5741ea | hsl(248, 80%, 59%) |
|
|
300 | oklch(0.401 0.242 272.32) | #2c16c6 | hsl(248, 80%, 43%) |
|
|
400 | oklch(0.294 0.170 273.84) | #1c0e7e | hsl(248, 80%, 27%) |
|
|
500 | oklch(0.177 0.088 278.59) | #0c0636 | hsl(248, 80%, 12%) |
|
|
600 | oklch(0.175 0.085 279.30) | #0c0634 | hsl(248, 79%, 11%) |
|
|
700 | oklch(0.173 0.084 278.45) | #0b0633 | hsl(247, 79%, 11%) |
|
|
800 | oklch(0.168 0.083 279.74) | #0b0531 | hsl(248, 81%, 11%) |
|
|
900 | oklch(0.166 0.081 280.15) | #0b0530 | hsl(248, 81%, 10%) |
|
|
950 | oklch(0.163 0.078 279.65) | #0a052e | hsl(247, 80%, 10%) |
|
dsfds
50 | oklch(0.935 0.037 220.52) | #d0f0fb | hsl(195, 84%, 90%) |
|
|
100 | oklch(0.854 0.083 221.61) | #90dcf6 | hsl(195, 85%, 76%) |
|
|
200 | oklch(0.782 0.119 223.84) | #51c8f0 | hsl(195, 84%, 63%) |
|
|
300 | oklch(0.717 0.138 228.84) | #14b3e8 | hsl(195, 84%, 49%) |
|
|
400 | oklch(0.568 0.108 228.63) | #0e82a9 | hsl(195, 85%, 36%) |
|
|
500 | oklch(0.407 0.075 227.33) | #095169 | hsl(195, 84%, 22%) |
|
|
600 | oklch(0.375 0.069 226.62) | #08485d | hsl(195, 84%, 20%) |
|
|
700 | oklch(0.344 0.063 227.07) | #073f52 | hsl(195, 84%, 17%) |
|
|
800 | oklch(0.311 0.056 226.11) | #063646 | hsl(195, 84%, 15%) |
|
|
900 | oklch(0.278 0.049 226.62) | #052d3b | hsl(196, 84%, 13%) |
|
|
950 | oklch(0.243 0.042 225.13) | #04242f | hsl(195, 84%, 10%) |
|
dsfds
50 | oklch(0.962 0.048 196.38) | #cefdfd | hsl(180, 92%, 90%) |
|
|
100 | oklch(0.928 0.097 194.81) | #94fcfb | hsl(179, 95%, 78%) |
|
|
200 | oklch(0.903 0.131 194.48) | #5afaf9 | hsl(180, 94%, 67%) |
|
|
300 | oklch(0.887 0.148 193.75) | #20f8f6 | hsl(179, 94%, 55%) |
|
|
400 | oklch(0.790 0.134 194.17) | #07d5d4 | hsl(180, 94%, 43%) |
|
|
500 | oklch(0.624 0.106 193.97) | #059b9a | hsl(180, 94%, 31%) |
|
|
600 | oklch(0.561 0.095 193.85) | #048685 | hsl(180, 94%, 27%) |
|
|
700 | oklch(0.497 0.084 193.70) | #047170 | hsl(179, 93%, 23%) |
|
|
800 | oklch(0.430 0.073 193.49) | #035c5b | hsl(179, 94%, 19%) |
|
|
900 | oklch(0.360 0.061 193.17) | #024746 | hsl(179, 95%, 14%) |
|
|
950 | oklch(0.284 0.047 194.83) | #023131 | hsl(180, 92%, 10%) |
|
dsfds
50 | oklch(0.937 0.027 163.18) | #dbf0e5 | hsl(149, 41%, 90%) |
|
|
100 | oklch(0.891 0.050 161.70) | #bfe6d1 | hsl(148, 44%, 83%) |
|
|
200 | oklch(0.845 0.070 161.44) | #a4dbbe | hsl(148, 43%, 75%) |
|
|
300 | oklch(0.800 0.090 160.09) | #89d0aa | hsl(148, 43%, 68%) |
|
|
400 | oklch(0.756 0.108 159.21) | #6ec597 | hsl(148, 43%, 60%) |
|
|
500 | oklch(0.713 0.126 157.50) | #53ba83 | hsl(148, 43%, 53%) |
|
|
600 | oklch(0.638 0.120 156.64) | #41a16d | hsl(148, 42%, 44%) |
|
|
700 | oklch(0.546 0.102 156.89) | #348258 | hsl(148, 43%, 36%) |
|
|
800 | oklch(0.451 0.081 157.01) | #286343 | hsl(147, 42%, 27%) |
|
|
900 | oklch(0.350 0.061 157.61) | #1b442e | hsl(148, 43%, 19%) |
|
|
950 | oklch(0.239 0.035 159.34) | #0f2419 | hsl(149, 41%, 10%) |
|
dsfds
50 | oklch(0.948 0.041 129.62) | #e5f4d7 | hsl(91, 57%, 90%) |
|
|
100 | oklch(0.923 0.066 130.10) | #d7efc1 | hsl(91, 59%, 85%) |
|
|
200 | oklch(0.896 0.087 130.51) | #c9e9ac | hsl(91, 58%, 79%) |
|
|
300 | oklch(0.869 0.110 130.70) | #bbe396 | hsl(91, 58%, 74%) |
|
|
400 | oklch(0.845 0.132 131.38) | #adde81 | hsl(92, 58%, 69%) |
|
|
500 | oklch(0.819 0.152 131.75) | #9fd86b | hsl(91, 58%, 63%) |
|
|
600 | oklch(0.772 0.187 133.14) | #83cd40 | hsl(91, 59%, 53%) |
|
|
700 | oklch(0.669 0.169 133.57) | #68aa2d | hsl(92, 58%, 42%) |
|
|
800 | oklch(0.539 0.133 133.06) | #4e7e21 | hsl(91, 58%, 31%) |
|
|
900 | oklch(0.403 0.096 133.00) | #335316 | hsl(91, 58%, 21%) |
|
|
950 | oklch(0.255 0.053 132.01) | #19280b | hsl(91, 57%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.