Vibrant Coastal Color Palette
This palette exudes a vibrant coastal energy, blending deep ocean blues with refreshing sky hues and a zesty pop of sunset orange, perfect for a modern, adventurous style.
Practical uses and creative applications
Introducing the Vibrant Coastal Color Palette, a stunning combination of deep ocean blues and bright sunset hues that captures the essence of coastal living. With bold shades like #0066B3 and #00487D, complemented by lighter tones of #BFE4FF and #80C9FF, this palette is perfect for projects that aim to evoke a sense of tranquility and adventure.
The energetic pop of #FF5500 adds a striking contrast, making it ideal for branding and web design that seeks to stand out while maintaining a fresh, inviting feel. This color palette is particularly well-suited for designers and creatives looking to create a beachy, laid-back atmosphere in their work.
Whether you're designing a coastal-themed website, packaging for a summer product, or refreshing the interiors of a seaside café, the Vibrant Coastal Color Palette effortlessly communicates a mood of relaxation and excitement. Its versatility allows it to appeal to a wide audience, from lifestyle brands to travel agencies, making it an excellent choice for any project that aims to inspire wanderlust and joy.
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.043 240.73) | #cce9ff | hsl(206, 100%, 90%) |
|
|
| 100 | oklch(0.836 0.090 241.70) | #94d1ff | hsl(206, 100%, 79%) |
|
|
| 200 | oklch(0.758 0.134 243.70) | #5cb9ff | hsl(206, 100%, 68%) |
|
|
| 300 | oklch(0.690 0.172 247.55) | #24a1ff | hsl(206, 100%, 57%) |
|
|
| 400 | oklch(0.614 0.180 251.19) | #0086eb | hsl(206, 100%, 46%) |
|
|
| 500 | oklch(0.504 0.145 250.61) | #0066b3 | hsl(206, 100%, 35%) |
|
|
| 600 | oklch(0.450 0.128 250.28) | #005799 | hsl(206, 100%, 30%) |
|
|
| 700 | oklch(0.398 0.112 249.57) | #004980 | hsl(206, 100%, 25%) |
|
|
| 800 | oklch(0.341 0.094 248.81) | #003a66 | hsl(206, 100%, 20%) |
|
|
| 900 | oklch(0.285 0.075 247.18) | #002c4d | hsl(206, 100%, 15%) |
|
|
| 950 | oklch(0.223 0.056 244.61) | #001d33 | hsl(206, 100%, 10%) |
|
dsfds
| 50 | oklch(0.920 0.043 240.73) | #cce9ff | hsl(206, 100%, 90%) |
|
|
| 100 | oklch(0.821 0.099 241.33) | #89cdff | hsl(205, 100%, 77%) |
|
|
| 200 | oklch(0.733 0.149 244.18) | #46b1ff | hsl(205, 100%, 64%) |
|
|
| 300 | oklch(0.658 0.189 250.64) | #0494ff | hsl(206, 100%, 51%) |
|
|
| 400 | oklch(0.531 0.153 250.53) | #006ec0 | hsl(206, 100%, 38%) |
|
|
| 500 | oklch(0.394 0.109 249.00) | #00487d | hsl(205, 100%, 25%) |
|
|
| 600 | oklch(0.360 0.099 248.79) | #003f6e | hsl(206, 100%, 22%) |
|
|
| 700 | oklch(0.328 0.088 247.61) | #00375f | hsl(205, 100%, 19%) |
|
|
| 800 | oklch(0.294 0.079 247.76) | #002e51 | hsl(206, 100%, 16%) |
|
|
| 900 | oklch(0.260 0.067 245.86) | #002642 | hsl(205, 100%, 13%) |
|
|
| 950 | oklch(0.223 0.056 244.61) | #001d33 | hsl(206, 100%, 10%) |
|
dsfds
| 50 | oklch(0.920 0.043 240.73) | #cce9ff | hsl(206, 100%, 90%) |
|
|
| 100 | oklch(0.916 0.045 240.16) | #c9e8ff | hsl(206, 100%, 89%) |
|
|
| 200 | oklch(0.912 0.047 240.49) | #c7e7ff | hsl(206, 100%, 89%) |
|
|
| 300 | oklch(0.908 0.050 239.99) | #c4e6ff | hsl(205, 100%, 88%) |
|
|
| 400 | oklch(0.905 0.051 240.31) | #c2e5ff | hsl(206, 100%, 88%) |
|
|
| 500 | oklch(0.901 0.054 239.87) | #bfe4ff | hsl(205, 100%, 87%) |
|
|
| 600 | oklch(0.788 0.118 241.77) | #70c3ff | hsl(205, 100%, 72%) |
|
|
| 700 | oklch(0.690 0.172 247.31) | #21a1ff | hsl(205, 100%, 56%) |
|
|
| 800 | oklch(0.568 0.162 250.23) | #0079d1 | hsl(205, 100%, 41%) |
|
|
| 900 | oklch(0.405 0.112 249.06) | #004b82 | hsl(205, 100%, 25%) |
|
|
| 950 | oklch(0.223 0.056 244.61) | #001d33 | hsl(206, 100%, 10%) |
|
dsfds
| 50 | oklch(0.920 0.043 240.73) | #cce9ff | hsl(206, 100%, 90%) |
|
|
| 100 | oklch(0.898 0.055 240.17) | #bde3ff | hsl(205, 100%, 87%) |
|
|
| 200 | oklch(0.874 0.068 241.34) | #aedcff | hsl(206, 100%, 84%) |
|
|
| 300 | oklch(0.852 0.081 240.65) | #9ed6ff | hsl(205, 100%, 81%) |
|
|
| 400 | oklch(0.829 0.094 241.69) | #8fcfff | hsl(206, 100%, 78%) |
|
|
| 500 | oklch(0.808 0.106 241.78) | #80c9ff | hsl(206, 100%, 75%) |
|
|
| 600 | oklch(0.722 0.155 245.04) | #3eadff | hsl(205, 100%, 62%) |
|
|
| 700 | oklch(0.646 0.187 250.84) | #0090fa | hsl(205, 100%, 49%) |
|
|
| 800 | oklch(0.517 0.147 250.17) | #006ab8 | hsl(205, 100%, 36%) |
|
|
| 900 | oklch(0.375 0.104 249.04) | #004375 | hsl(206, 100%, 23%) |
|
|
| 950 | oklch(0.223 0.056 244.61) | #001d33 | hsl(206, 100%, 10%) |
|
dsfds
| 50 | oklch(0.921 0.044 48.22) | #ffddcc | hsl(20, 100%, 90%) |
|
|
| 100 | oklch(0.862 0.082 48.14) | #ffc2a3 | hsl(20, 100%, 82%) |
|
|
| 200 | oklch(0.806 0.120 47.58) | #ffa77a | hsl(20, 100%, 74%) |
|
|
| 300 | oklch(0.754 0.158 45.50) | #ff8b52 | hsl(20, 100%, 66%) |
|
|
| 400 | oklch(0.710 0.191 43.17) | #ff7029 | hsl(20, 100%, 58%) |
|
|
| 500 | oklch(0.676 0.217 38.80) | #ff5500 | hsl(20, 100%, 50%) |
|
|
| 600 | oklch(0.593 0.190 39.12) | #d64700 | hsl(20, 100%, 42%) |
|
|
| 700 | oklch(0.509 0.160 39.95) | #ad3a00 | hsl(20, 100%, 34%) |
|
|
| 800 | oklch(0.422 0.131 40.63) | #852c00 | hsl(20, 100%, 26%) |
|
|
| 900 | oklch(0.329 0.098 42.95) | #5c1f00 | hsl(20, 100%, 18%) |
|
|
| 950 | oklch(0.229 0.063 47.64) | #331100 | hsl(20, 100%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.
