Tranquil Coastal Color Palette
This palette exudes a tranquil coastal vibe, blending soft sky blues and earthy tones with a touch of muted elegance, perfect for a serene and stylish retreat.
Practical uses and creative applications
The Tranquil Coastal Color Palette is a serene blend of soft blues, earthy greens, and warm neutrals, perfect for evoking a calming seaside atmosphere. With hues like #b2d9f7 reminiscent of clear skies and #487aa1 reflecting the depth of ocean waters, this palette is ideal for branding and web design that seeks to promote relaxation and clarity.
It’s an excellent choice for businesses in wellness, travel, or any creative sector that aims to create a soothing online presence. Designers and creatives can leverage the Tranquil Coastal Color Palette in various applications, from packaging for eco-friendly products to interior design for coastal-themed spaces.
The muted tones of #3d3c3b and #7c8071 offer a grounded feel, making it suitable for modern homes or boutique hotels that want to embody a tranquil retreat. Whether you’re creating a stylish website or designing an inviting living area, this palette is sure to resonate with audiences looking for peace and harmony in their environments.
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.920 0.035 241.46) | #d1e8fa | hsl(206, 80%, 90%) |
|
|
100 | oklch(0.909 0.040 242.43) | #cbe5fa | hsl(207, 82%, 89%) |
|
|
200 | oklch(0.898 0.045 241.07) | #c4e2f9 | hsl(206, 82%, 87%) |
|
|
300 | oklch(0.888 0.049 240.83) | #bedff8 | hsl(206, 81%, 86%) |
|
|
400 | oklch(0.878 0.054 241.66) | #b8dcf8 | hsl(206, 82%, 85%) |
|
|
500 | oklch(0.867 0.059 241.45) | #b2d9f7 | hsl(206, 81%, 83%) |
|
|
600 | oklch(0.756 0.110 242.75) | #6eb8f0 | hsl(206, 81%, 69%) |
|
|
700 | oklch(0.654 0.155 247.08) | #2a96e9 | hsl(206, 81%, 54%) |
|
|
800 | oklch(0.529 0.137 248.54) | #136fb6 | hsl(206, 81%, 39%) |
|
|
900 | oklch(0.383 0.094 247.32) | #0c4672 | hsl(206, 81%, 25%) |
|
|
950 | oklch(0.219 0.046 245.05) | #051c2e | hsl(206, 80%, 10%) |
|
dsfds
50 | oklch(0.922 0.016 239.12) | #dce7ef | hsl(205, 37%, 90%) |
|
|
100 | oklch(0.851 0.031 242.06) | #bdd1e1 | hsl(207, 38%, 81%) |
|
|
200 | oklch(0.780 0.047 240.34) | #9dbcd3 | hsl(206, 38%, 72%) |
|
|
300 | oklch(0.707 0.063 242.04) | #7ea6c5 | hsl(206, 38%, 63%) |
|
|
400 | oklch(0.636 0.079 242.27) | #5f91b7 | hsl(206, 38%, 55%) |
|
|
500 | oklch(0.561 0.081 243.49) | #487aa1 | hsl(206, 38%, 46%) |
|
|
600 | oklch(0.497 0.071 243.60) | #3d6788 | hsl(206, 38%, 39%) |
|
|
700 | oklch(0.432 0.060 243.76) | #32546f | hsl(207, 38%, 32%) |
|
|
800 | oklch(0.363 0.049 243.16) | #264156 | hsl(206, 39%, 24%) |
|
|
900 | oklch(0.292 0.036 241.45) | #1b2e3c | hsl(205, 38%, 17%) |
|
|
950 | oklch(0.216 0.022 240.65) | #101b23 | hsl(205, 37%, 10%) |
|
dsfds
50 | oklch(0.925 0.001 106.43) | #e6e6e5 | hsl(60, 2%, 90%) |
|
|
100 | oklch(0.821 0.002 67.80) | #c5c4c3 | hsl(30, 2%, 77%) |
|
|
200 | oklch(0.712 0.003 84.56) | #a3a2a0 | hsl(40, 2%, 63%) |
|
|
300 | oklch(0.601 0.004 67.75) | #82807e | hsl(30, 2%, 50%) |
|
|
400 | oklch(0.482 0.003 84.57) | #5f5e5c | hsl(40, 2%, 37%) |
|
|
500 | oklch(0.357 0.002 67.75) | #3d3c3b | hsl(30, 2%, 24%) |
|
|
600 | oklch(0.330 0.002 67.75) | #363534 | hsl(30, 2%, 21%) |
|
|
700 | oklch(0.302 0.002 67.74) | #2f2e2d | hsl(30, 2%, 18%) |
|
|
800 | oklch(0.274 0.001 17.25) | #282727 | hsl(0, 1%, 15%) |
|
|
900 | oklch(0.245 0.002 17.26) | #212020 | hsl(0, 2%, 13%) |
|
|
950 | oklch(0.217 0.002 106.56) | #1a1a19 | hsl(60, 2%, 10%) |
|
dsfds
50 | oklch(0.926 0.004 121.56) | #e6e7e4 | hsl(80, 6%, 90%) |
|
|
100 | oklch(0.864 0.008 121.65) | #d1d3cd | hsl(80, 6%, 82%) |
|
|
200 | oklch(0.798 0.011 118.08) | #bcbeb6 | hsl(75, 6%, 73%) |
|
|
300 | oklch(0.732 0.017 118.24) | #a7aa9e | hsl(75, 7%, 64%) |
|
|
400 | oklch(0.663 0.021 116.79) | #929587 | hsl(73, 6%, 56%) |
|
|
500 | oklch(0.592 0.023 119.24) | #7c8071 | hsl(76, 6%, 47%) |
|
|
600 | oklch(0.524 0.020 121.03) | #686c5f | hsl(78, 6%, 40%) |
|
|
700 | oklch(0.454 0.018 119.52) | #55584d | hsl(76, 7%, 32%) |
|
|
800 | oklch(0.379 0.012 119.95) | #41433c | hsl(77, 6%, 25%) |
|
|
900 | oklch(0.302 0.009 116.12) | #2e2f2a | hsl(72, 6%, 17%) |
|
|
950 | oklch(0.220 0.006 121.93) | #1a1b18 | hsl(80, 6%, 10%) |
|
dsfds
50 | oklch(0.940 0.020 115.97) | #eaedde | hsl(72, 29%, 90%) |
|
|
100 | oklch(0.932 0.023 117.61) | #e7ebda | hsl(74, 30%, 89%) |
|
|
200 | oklch(0.926 0.026 116.56) | #e5e9d6 | hsl(73, 30%, 88%) |
|
|
300 | oklch(0.918 0.028 117.85) | #e2e7d2 | hsl(74, 30%, 86%) |
|
|
400 | oklch(0.912 0.031 116.98) | #e0e5ce | hsl(73, 31%, 85%) |
|
|
500 | oklch(0.905 0.034 118.05) | #dde3ca | hsl(74, 31%, 84%) |
|
|
600 | oklch(0.814 0.066 119.28) | #bdc999 | hsl(75, 31%, 69%) |
|
|
700 | oklch(0.724 0.098 119.77) | #9eaf67 | hsl(74, 31%, 55%) |
|
|
800 | oklch(0.586 0.088 120.34) | #758446 | hsl(75, 31%, 40%) |
|
|
900 | oklch(0.423 0.061 120.82) | #49532c | hsl(75, 31%, 25%) |
|
|
950 | oklch(0.240 0.027 117.71) | #1e2112 | hsl(72, 29%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.