Serene Coastal Color Palette
This palette radiates a serene coastal vibe, blending crisp whites with deep ocean blues and refreshing teal tones, evoking a tranquil yet invigorating seaside retreat.
Practical uses and creative applications
The Serene Coastal Color Palette transports users to tranquil shores with its soothing blend of ocean-inspired hues. Featuring crisp whites (#FFFFFF), deep sea blues (#144467, #096D95), and refreshing aquas (#84B6CA, #4792B0), this palette is ideal for branding projects that aim to evoke calmness and clarity.
Designers looking to create a coastal theme can effortlessly integrate these colors into web design, packaging, or interior decor, bringing a sense of serenity and sophistication to any creative endeavor. This color palette is particularly suited for brands in the wellness, travel, or home decor sectors, appealing to audiences who appreciate a fresh, clean aesthetic.
Whether it’s a spa looking to create a peaceful atmosphere, an eco-friendly product line wanting to reflect sustainability, or an interior designer aiming to create a beachy retreat, the Serene Coastal Color Palette embodies a harmonious blend that resonates with creatives and consumers alike. By incorporating these colors, you can establish a brand identity that feels both inviting and rejuvenating, perfect for standing out in the competitive marketplace.
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.925 0.000 89.88) | #e6e6e6 | hsl(0, 0%, 90%) |
|
|
100 | oklch(0.940 0.000 89.88) | #ebebeb | hsl(0, 0%, 92%) |
|
|
200 | oklch(0.955 0.000 89.88) | #f0f0f0 | hsl(0, 0%, 94%) |
|
|
300 | oklch(0.970 0.000 89.88) | #f5f5f5 | hsl(0, 0%, 96%) |
|
|
400 | oklch(0.985 0.000 89.88) | #fafafa | hsl(0, 0%, 98%) |
|
|
500 | oklch(1.000 0.000 89.88) | #ffffff | hsl(0, 0%, 100%) |
|
|
600 | oklch(0.861 0.000 89.88) | #d1d1d1 | hsl(0, 0%, 82%) |
|
|
700 | oklch(0.715 0.000 89.88) | #a3a3a3 | hsl(0, 0%, 64%) |
|
|
800 | oklch(0.562 0.000 89.88) | #757575 | hsl(0, 0%, 46%) |
|
|
900 | oklch(0.398 0.000 89.88) | #474747 | hsl(0, 0%, 28%) |
|
|
950 | oklch(0.218 0.000 89.88) | #1a1a1a | hsl(0, 0%, 10%) |
|
dsfds
50 | oklch(0.921 0.030 240.19) | #d4e8f7 | hsl(206, 69%, 90%) |
|
|
100 | oklch(0.818 0.068 240.66) | #9ccaec | hsl(206, 68%, 77%) |
|
|
200 | oklch(0.719 0.106 242.15) | #64ace1 | hsl(205, 68%, 64%) |
|
|
300 | oklch(0.625 0.140 245.33) | #2b8ed6 | hsl(205, 68%, 50%) |
|
|
400 | oklch(0.503 0.111 245.19) | #1f699f | hsl(205, 67%, 37%) |
|
|
500 | oklch(0.373 0.079 244.58) | #144467 | hsl(205, 67%, 24%) |
|
|
600 | oklch(0.344 0.071 244.61) | #123c5b | hsl(205, 67%, 21%) |
|
|
700 | oklch(0.313 0.064 244.21) | #0f344f | hsl(205, 68%, 18%) |
|
|
800 | oklch(0.283 0.056 244.24) | #0d2c43 | hsl(206, 68%, 16%) |
|
|
900 | oklch(0.251 0.047 244.38) | #0b2437 | hsl(206, 67%, 13%) |
|
|
950 | oklch(0.218 0.039 243.59) | #081c2b | hsl(206, 69%, 10%) |
|
dsfds
50 | oklch(0.928 0.018 223.61) | #dbeaf0 | hsl(197, 41%, 90%) |
|
|
100 | oklch(0.891 0.026 225.34) | #cadfe8 | hsl(198, 39%, 85%) |
|
|
200 | oklch(0.855 0.035 224.70) | #b8d5e1 | hsl(198, 41%, 80%) |
|
|
300 | oklch(0.820 0.043 223.45) | #a7cbd9 | hsl(197, 40%, 75%) |
|
|
400 | oklch(0.783 0.052 225.45) | #95c0d2 | hsl(198, 40%, 70%) |
|
|
500 | oklch(0.748 0.060 224.68) | #84b6ca | hsl(197, 40%, 65%) |
|
|
600 | oklch(0.668 0.078 225.14) | #5c9fb9 | hsl(197, 40%, 54%) |
|
|
700 | oklch(0.572 0.075 226.31) | #42819a | hsl(197, 40%, 43%) |
|
|
800 | oklch(0.464 0.060 226.61) | #316073 | hsl(197, 40%, 32%) |
|
|
900 | oklch(0.349 0.042 225.25) | #203f4b | hsl(197, 40%, 21%) |
|
|
950 | oklch(0.224 0.024 225.41) | #0f1e24 | hsl(197, 41%, 10%) |
|
dsfds
50 | oklch(0.928 0.018 223.61) | #dbeaf0 | hsl(197, 41%, 90%) |
|
|
100 | oklch(0.867 0.034 222.67) | #bcd9e4 | hsl(197, 43%, 82%) |
|
|
200 | oklch(0.806 0.050 225.11) | #9ec7d8 | hsl(198, 43%, 73%) |
|
|
300 | oklch(0.746 0.065 225.28) | #80b6cc | hsl(197, 43%, 65%) |
|
|
400 | oklch(0.688 0.079 225.93) | #62a5c0 | hsl(197, 43%, 57%) |
|
|
500 | oklch(0.624 0.087 226.87) | #4792b0 | hsl(197, 43%, 48%) |
|
|
600 | oklch(0.552 0.075 226.55) | #3c7b94 | hsl(197, 42%, 41%) |
|
|
700 | oklch(0.476 0.064 225.73) | #306478 | hsl(197, 43%, 33%) |
|
|
800 | oklch(0.395 0.052 227.05) | #254c5c | hsl(197, 43%, 25%) |
|
|
900 | oklch(0.313 0.038 226.52) | #1a3540 | hsl(197, 42%, 18%) |
|
|
950 | oklch(0.224 0.024 225.41) | #0f1e24 | hsl(197, 41%, 10%) |
|
dsfds
50 | oklch(0.933 0.038 224.26) | #cfeffc | hsl(197, 88%, 90%) |
|
|
100 | oklch(0.860 0.081 224.72) | #96ddf9 | hsl(197, 89%, 78%) |
|
|
200 | oklch(0.792 0.116 227.02) | #5dcaf5 | hsl(197, 88%, 66%) |
|
|
300 | oklch(0.733 0.142 231.99) | #25b7f2 | hsl(197, 89%, 55%) |
|
|
400 | oklch(0.638 0.131 233.82) | #0c97ce | hsl(197, 89%, 43%) |
|
|
500 | oklch(0.504 0.102 233.39) | #096d95 | hsl(197, 89%, 31%) |
|
|
600 | oklch(0.454 0.092 233.44) | #085e81 | hsl(197, 88%, 27%) |
|
|
700 | oklch(0.403 0.081 233.52) | #074f6d | hsl(198, 88%, 23%) |
|
|
800 | oklch(0.352 0.068 230.84) | #054158 | hsl(197, 89%, 18%) |
|
|
900 | oklch(0.298 0.056 230.28) | #043244 | hsl(197, 89%, 14%) |
|
|
950 | oklch(0.240 0.044 229.35) | #032330 | hsl(197, 88%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.