Warm Coastal Color Palette
This palette radiates a warm, sunny optimism with soft peach and honey tones, balanced by vibrant blues and deep navy, evoking a playful yet sophisticated coastal retreat.
Practical uses and creative applications
The Warm Coastal Color Palette is a delightful blend of soft sandy hues and vibrant oceanic blues, making it an ideal choice for branding and web design that seeks to evoke feelings of calmness and creativity. With its gentle peach (#FFE7BE) and rich coral (#E6B990) tones, this palette is perfect for businesses in the wellness, travel, and lifestyle sectors, offering a warm and inviting aesthetic that draws customers in.
The striking contrasting blues (#2C97FF, #0151C2) add a refreshing touch, perfect for creating dynamic visuals that stand out, whether on a website or in marketing materials. This color palette is particularly well-suited for designers and creatives looking to infuse their projects with a coastal vibe.
Whether you're designing packaging for artisanal products or crafting interiors that reflect a beachy retreat, the Warm Coastal Color Palette provides versatility and warmth. The deeper shade of navy (#1B1B33) anchors the lighter tones, making it an excellent choice for creating depth in spaces or branding elements, ensuring your designs resonate with an audience that values both style and serenity.
Embrace the soothing essence of the coast with this palette, and watch your creative visions flow effortlessly into reality.
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.950 0.047 80.81) | #ffeccc | hsl(38, 100%, 90%) |
|
|
| 100 | oklch(0.948 0.049 81.00) | #ffebc9 | hsl(38, 100%, 89%) |
|
|
| 200 | oklch(0.945 0.052 81.17) | #ffeac6 | hsl(38, 100%, 89%) |
|
|
| 300 | oklch(0.943 0.054 80.72) | #ffe9c4 | hsl(38, 100%, 88%) |
|
|
| 400 | oklch(0.940 0.057 80.88) | #ffe8c1 | hsl(38, 100%, 88%) |
|
|
| 500 | oklch(0.937 0.059 81.03) | #ffe7be | hsl(38, 100%, 87%) |
|
|
| 600 | oklch(0.868 0.124 79.45) | #ffca6f | hsl(38, 100%, 72%) |
|
|
| 700 | oklch(0.808 0.165 73.41) | #ffad20 | hsl(38, 100%, 56%) |
|
|
| 800 | oklch(0.678 0.148 69.18) | #d18400 | hsl(38, 100%, 41%) |
|
|
| 900 | oklch(0.481 0.104 70.85) | #825200 | hsl(38, 100%, 25%) |
|
|
| 950 | oklch(0.261 0.055 76.59) | #332000 | hsl(38, 100%, 10%) |
|
| 50 | oklch(0.931 0.028 65.76) | #f6e5d5 | hsl(29, 65%, 90%) |
|
|
| 100 | oklch(0.908 0.037 63.37) | #f3dcc8 | hsl(28, 64%, 87%) |
|
|
| 200 | oklch(0.884 0.046 63.96) | #efd3ba | hsl(28, 62%, 83%) |
|
|
| 300 | oklch(0.862 0.056 65.20) | #eccbac | hsl(29, 63%, 80%) |
|
|
| 400 | oklch(0.839 0.066 64.46) | #e9c29e | hsl(29, 63%, 77%) |
|
|
| 500 | oklch(0.816 0.075 63.80) | #e6b990 | hsl(29, 63%, 73%) |
|
|
| 600 | oklch(0.732 0.111 62.40) | #da985b | hsl(29, 63%, 61%) |
|
|
| 700 | oklch(0.645 0.133 58.75) | #c8772d | hsl(29, 63%, 48%) |
|
|
| 800 | oklch(0.516 0.104 58.75) | #935721 | hsl(28, 63%, 35%) |
|
|
| 900 | oklch(0.380 0.073 60.12) | #5e3815 | hsl(29, 63%, 23%) |
|
|
| 950 | oklch(0.232 0.038 62.36) | #2a1909 | hsl(29, 65%, 10%) |
|
| 50 | oklch(0.914 0.044 247.26) | #cce6ff | hsl(209, 100%, 90%) |
|
|
| 100 | oklch(0.860 0.072 248.06) | #acd6ff | hsl(210, 100%, 84%) |
|
|
| 200 | oklch(0.808 0.101 248.75) | #8cc6ff | hsl(210, 100%, 77%) |
|
|
| 300 | oklch(0.760 0.128 248.95) | #6cb7ff | hsl(209, 100%, 71%) |
|
|
| 400 | oklch(0.713 0.155 250.29) | #4ca7ff | hsl(209, 100%, 65%) |
|
|
| 500 | oklch(0.670 0.180 252.16) | #2c97ff | hsl(210, 100%, 59%) |
|
|
| 600 | oklch(0.607 0.206 255.82) | #007ef9 | hsl(210, 100%, 49%) |
|
|
| 700 | oklch(0.517 0.173 255.49) | #0065c8 | hsl(210, 100%, 39%) |
|
|
| 800 | oklch(0.422 0.138 254.71) | #004c96 | hsl(210, 100%, 29%) |
|
|
| 900 | oklch(0.323 0.101 253.52) | #003365 | hsl(210, 100%, 20%) |
|
|
| 950 | oklch(0.214 0.059 249.31) | #001a33 | hsl(209, 100%, 10%) |
|
| 50 | oklch(0.904 0.047 257.26) | #cce1ff | hsl(215, 100%, 90%) |
|
|
| 100 | oklch(0.806 0.097 257.29) | #98c2fe | hsl(215, 98%, 80%) |
|
|
| 200 | oklch(0.713 0.149 257.35) | #63a3fe | hsl(215, 99%, 69%) |
|
|
| 300 | oklch(0.631 0.198 258.06) | #2f85fe | hsl(215, 99%, 59%) |
|
|
| 400 | oklch(0.559 0.230 260.21) | #0167f7 | hsl(215, 99%, 49%) |
|
|
| 500 | oklch(0.469 0.190 259.89) | #0151c2 | hsl(215, 99%, 38%) |
|
|
| 600 | oklch(0.419 0.166 259.62) | #0145a5 | hsl(215, 99%, 33%) |
|
|
| 700 | oklch(0.368 0.144 259.38) | #013989 | hsl(215, 99%, 27%) |
|
|
| 800 | oklch(0.314 0.119 258.84) | #012d6c | hsl(215, 98%, 21%) |
|
|
| 900 | oklch(0.258 0.093 257.43) | #00214f | hsl(215, 100%, 15%) |
|
|
| 950 | oklch(0.199 0.067 255.41) | #001533 | hsl(215, 100%, 10%) |
|
| 50 | oklch(0.905 0.020 285.99) | #dedeed | hsl(240, 29%, 90%) |
|
|
| 100 | oklch(0.758 0.056 285.00) | #acacd3 | hsl(240, 31%, 75%) |
|
|
| 200 | oklch(0.605 0.095 283.20) | #7a7ab9 | hsl(240, 31%, 60%) |
|
|
| 300 | oklch(0.467 0.113 281.10) | #505097 | hsl(240, 31%, 45%) |
|
|
| 400 | oklch(0.354 0.082 281.38) | #353565 | hsl(240, 31%, 30%) |
|
|
| 500 | oklch(0.235 0.046 282.32) | #1b1b33 | hsl(240, 31%, 15%) |
|
|
| 600 | oklch(0.226 0.042 282.47) | #19192f | hsl(240, 31%, 14%) |
|
|
| 700 | oklch(0.216 0.041 282.45) | #17172c | hsl(240, 31%, 13%) |
|
|
| 800 | oklch(0.206 0.037 282.62) | #151528 | hsl(240, 31%, 12%) |
|
|
| 900 | oklch(0.201 0.034 282.93) | #141425 | hsl(240, 30%, 11%) |
|
|
| 950 | oklch(0.190 0.030 283.16) | #121221 | hsl(240, 29%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection
