Vibrant Coastal Color Palette
This vibrant palette blends deep ocean blues and teals with warm, sunny corals and soft creams, evoking a lively coastal vibe that feels both refreshing and energizing.
Practical uses and creative applications
The Vibrant Coastal Color Palette is an exquisite blend of hues that captures the essence of sun-drenched shores and tranquil ocean waves. With deep teal (#006B95) and refreshing aqua (#018A9C) serving as the foundation, this palette evokes feelings of serenity and adventure.
The addition of soft sand tones (#FFE9B7) and zesty coral shades (#FEAA61, #FE6A1A) creates a dynamic contrast that is perfect for branding and web design. Whether you're a designer crafting a coastal-themed website or a creative looking to infuse energy into your packaging, this palette offers endless possibilities to engage and inspire your audience.
Ideal for brands targeting a vibrant and youthful demographic, the Vibrant Coastal Color Palette suits businesses in the travel, wellness, and lifestyle sectors. Designers will appreciate its versatility, as it can be seamlessly integrated into various projectsfrom striking marketing materials to inviting interiors that reflect a beachy vibe.
This palette not only enhances aesthetics but also evokes feelings of joy and relaxation, making it an excellent choice for any creative looking to capture the spirit of coastal living.
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.936 0.043 222.71) | #ccf1ff | hsl(196, 100%, 90%) |
|
|
| 100 | oklch(0.863 0.091 225.12) | #8edfff | hsl(197, 100%, 78%) |
|
|
| 200 | oklch(0.801 0.129 227.71) | #50ceff | hsl(197, 100%, 66%) |
|
|
| 300 | oklch(0.749 0.154 233.70) | #12bcff | hsl(197, 100%, 54%) |
|
|
| 400 | oklch(0.642 0.136 235.10) | #0098d3 | hsl(197, 100%, 41%) |
|
|
| 500 | oklch(0.498 0.105 234.47) | #006b95 | hsl(197, 100%, 29%) |
|
|
| 600 | oklch(0.450 0.094 233.63) | #005d81 | hsl(197, 100%, 25%) |
|
|
| 700 | oklch(0.403 0.084 233.38) | #004f6e | hsl(197, 100%, 22%) |
|
|
| 800 | oklch(0.352 0.072 231.99) | #00415a | hsl(197, 100%, 18%) |
|
|
| 900 | oklch(0.301 0.061 231.25) | #003347 | hsl(197, 100%, 14%) |
|
|
| 950 | oklch(0.247 0.048 228.26) | #002533 | hsl(196, 100%, 10%) |
|
| 50 | oklch(0.953 0.047 206.35) | #ccf9ff | hsl(187, 100%, 90%) |
|
|
| 100 | oklch(0.905 0.094 205.73) | #90f2fe | hsl(187, 98%, 78%) |
|
|
| 200 | oklch(0.866 0.127 207.74) | #54eafe | hsl(187, 99%, 66%) |
|
|
| 300 | oklch(0.840 0.143 210.20) | #18e3fe | hsl(187, 99%, 55%) |
|
|
| 400 | oklch(0.738 0.128 211.23) | #01bfd8 | hsl(187, 99%, 43%) |
|
|
| 500 | oklch(0.581 0.101 210.79) | #018a9c | hsl(187, 99%, 31%) |
|
|
| 600 | oklch(0.522 0.090 211.04) | #017787 | hsl(187, 99%, 27%) |
|
|
| 700 | oklch(0.464 0.080 210.12) | #016572 | hsl(187, 98%, 23%) |
|
|
| 800 | oklch(0.402 0.069 210.35) | #01525d | hsl(187, 98%, 18%) |
|
|
| 900 | oklch(0.337 0.058 210.57) | #003f48 | hsl(188, 100%, 14%) |
|
|
| 950 | oklch(0.272 0.047 208.59) | #002d33 | hsl(187, 100%, 10%) |
|
| 50 | oklch(0.934 0.016 182.70) | #deedea | hsl(168, 29%, 90%) |
|
|
| 100 | oklch(0.889 0.028 182.82) | #c7e1dc | hsl(168, 30%, 83%) |
|
|
| 200 | oklch(0.845 0.039 182.24) | #b1d5ce | hsl(168, 30%, 76%) |
|
|
| 300 | oklch(0.800 0.051 181.92) | #9ac9c0 | hsl(169, 30%, 70%) |
|
|
| 400 | oklch(0.756 0.061 181.23) | #84bdb2 | hsl(168, 30%, 63%) |
|
|
| 500 | oklch(0.711 0.072 180.62) | #6db1a4 | hsl(169, 30%, 56%) |
|
|
| 600 | oklch(0.641 0.077 179.80) | #539c8e | hsl(168, 31%, 47%) |
|
|
| 700 | oklch(0.547 0.064 180.09) | #437d72 | hsl(169, 30%, 38%) |
|
|
| 800 | oklch(0.450 0.052 179.36) | #325f56 | hsl(168, 31%, 28%) |
|
|
| 900 | oklch(0.346 0.038 179.66) | #22403a | hsl(168, 31%, 19%) |
|
|
| 950 | oklch(0.233 0.021 180.35) | #12211e | hsl(168, 29%, 10%) |
|
| 50 | oklch(0.956 0.049 86.35) | #ffefcc | hsl(41, 100%, 90%) |
|
|
| 100 | oklch(0.953 0.053 86.76) | #ffeec8 | hsl(41, 100%, 89%) |
|
|
| 200 | oklch(0.950 0.057 87.11) | #ffedc4 | hsl(42, 100%, 88%) |
|
|
| 300 | oklch(0.947 0.062 87.83) | #ffecbf | hsl(42, 100%, 87%) |
|
|
| 400 | oklch(0.943 0.065 86.75) | #ffeabb | hsl(41, 100%, 87%) |
|
|
| 500 | oklch(0.940 0.069 87.03) | #ffe9b7 | hsl(42, 100%, 86%) |
|
|
| 600 | oklch(0.881 0.131 85.40) | #ffd16a | hsl(41, 100%, 71%) |
|
|
| 700 | oklch(0.831 0.167 80.65) | #ffba1c | hsl(42, 100%, 55%) |
|
|
| 800 | oklch(0.695 0.145 77.41) | #ce8f00 | hsl(42, 100%, 40%) |
|
|
| 900 | oklch(0.493 0.102 79.05) | #805900 | hsl(42, 100%, 25%) |
|
|
| 950 | oklch(0.268 0.055 82.97) | #332300 | hsl(41, 100%, 10%) |
|
| 50 | oklch(0.935 0.044 63.91) | #ffe4cc | hsl(28, 100%, 90%) |
|
|
| 100 | oklch(0.907 0.062 62.16) | #ffd8b7 | hsl(28, 100%, 86%) |
|
|
| 200 | oklch(0.881 0.080 63.42) | #fecda1 | hsl(28, 98%, 81%) |
|
|
| 300 | oklch(0.854 0.098 61.92) | #fec18c | hsl(28, 98%, 77%) |
|
|
| 400 | oklch(0.831 0.116 61.79) | #feb676 | hsl(28, 99%, 73%) |
|
|
| 500 | oklch(0.806 0.133 60.14) | #feaa61 | hsl(28, 99%, 69%) |
|
|
| 600 | oklch(0.747 0.173 54.91) | #fe8a25 | hsl(28, 99%, 57%) |
|
|
| 700 | oklch(0.667 0.176 49.90) | #e66c01 | hsl(28, 99%, 45%) |
|
|
| 800 | oklch(0.535 0.139 50.99) | #aa5001 | hsl(28, 99%, 34%) |
|
|
| 900 | oklch(0.395 0.099 53.19) | #6e3401 | hsl(28, 98%, 22%) |
|
|
| 950 | oklch(0.243 0.057 59.83) | #331800 | hsl(28, 100%, 10%) |
|
| 50 | oklch(0.923 0.044 50.42) | #ffdecc | hsl(21, 100%, 90%) |
|
|
| 100 | oklch(0.872 0.076 49.51) | #ffc7a9 | hsl(21, 100%, 83%) |
|
|
| 200 | oklch(0.822 0.108 49.60) | #feb085 | hsl(21, 98%, 76%) |
|
|
| 300 | oklch(0.775 0.141 48.07) | #fe9861 | hsl(21, 99%, 69%) |
|
|
| 400 | oklch(0.735 0.172 46.20) | #fe813e | hsl(21, 99%, 62%) |
|
|
| 500 | oklch(0.700 0.198 43.16) | #fe6a1a | hsl(21, 99%, 55%) |
|
|
| 600 | oklch(0.637 0.199 40.14) | #e95201 | hsl(21, 99%, 46%) |
|
|
| 700 | oklch(0.544 0.168 40.63) | #bc4201 | hsl(21, 99%, 37%) |
|
|
| 800 | oklch(0.446 0.135 41.61) | #8e3201 | hsl(21, 99%, 28%) |
|
|
| 900 | oklch(0.341 0.099 43.93) | #602200 | hsl(21, 100%, 19%) |
|
|
| 950 | oklch(0.231 0.062 49.18) | #331200 | hsl(21, 100%, 10%) |
|
| 50 | oklch(0.908 0.048 33.97) | #ffd6cc | hsl(12, 100%, 90%) |
|
|
| 100 | oklch(0.840 0.090 35.15) | #ffb6a3 | hsl(12, 100%, 82%) |
|
|
| 200 | oklch(0.776 0.134 34.68) | #ff957b | hsl(12, 100%, 74%) |
|
|
| 300 | oklch(0.721 0.176 35.37) | #ff7552 | hsl(12, 100%, 66%) |
|
|
| 400 | oklch(0.676 0.214 34.59) | #ff542a | hsl(12, 100%, 58%) |
|
|
| 500 | oklch(0.647 0.240 32.69) | #ff3401 | hsl(12, 100%, 50%) |
|
|
| 600 | oklch(0.569 0.211 32.87) | #d72b00 | hsl(12, 100%, 42%) |
|
|
| 700 | oklch(0.488 0.179 33.30) | #ae2300 | hsl(12, 100%, 34%) |
|
|
| 800 | oklch(0.403 0.145 34.04) | #851b00 | hsl(12, 100%, 26%) |
|
|
| 900 | oklch(0.313 0.109 35.08) | #5c1200 | hsl(12, 100%, 18%) |
|
|
| 950 | oklch(0.217 0.070 38.90) | #330a00 | hsl(12, 100%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection
