Serene Coastal Color Palette
This palette radiates a serene coastal vibe with soft aqua, warm peach, and sandy beige, punctuated by vibrant coral and deep navy, evoking a stylish yet comforting seaside retreat.
Practical uses and creative applications
The Serene Coastal Color Palette effortlessly captures the tranquil essence of seaside escapes with its soothing hues. Featuring soft aqua (#84bfc3), warm cream (#fff5d6), vibrant coral (#ffb870), deep sunset red (#d96153), and grounding black (#000511), this palette is ideal for those looking to create a calming yet stylish ambiance.
Perfect for branding, web design, and packaging, these colors embody a fresh and inviting aesthetic that resonates well with brands in the wellness, hospitality, and lifestyle sectors. Ideal for designers and creatives seeking to evoke a sense of relaxation and serenity, the Serene Coastal Color Palette is particularly suited for interior spaces like coastal-themed homes, cafes, and wellness centers.
Whether you're designing a tranquil user experience for a coastal retreat website or crafting eye-catching packaging for a summer skincare line, these colors harmonize beautifully to create an inviting atmosphere. Embrace the serene vibes of the coast and let this palette inspire your next project!.
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.934 0.017 201.38) | #ddedee | hsl(184, 33%, 90%) |
|
|
| 100 | oklch(0.901 0.027 202.54) | #cbe4e6 | hsl(184, 35%, 85%) |
|
|
| 200 | oklch(0.867 0.036 200.89) | #b9dbdd | hsl(183, 35%, 80%) |
|
|
| 300 | oklch(0.832 0.044 201.73) | #a7d1d4 | hsl(184, 34%, 74%) |
|
|
| 400 | oklch(0.799 0.052 202.32) | #96c8cc | hsl(184, 35%, 69%) |
|
|
| 500 | oklch(0.766 0.061 201.31) | #84bfc3 | hsl(184, 34%, 64%) |
|
|
| 600 | oklch(0.697 0.077 201.02) | #5facb1 | hsl(184, 34%, 53%) |
|
|
| 700 | oklch(0.600 0.071 201.60) | #478d92 | hsl(184, 35%, 43%) |
|
|
| 800 | oklch(0.486 0.056 200.41) | #35696c | hsl(183, 34%, 32%) |
|
|
| 900 | oklch(0.366 0.040 200.51) | #234547 | hsl(183, 34%, 21%) |
|
|
| 950 | oklch(0.234 0.022 200.84) | #112122 | hsl(184, 33%, 10%) |
|
dsfds
| 50 | oklch(0.964 0.052 92.93) | #fff3cc | hsl(46, 100%, 90%) |
|
|
| 100 | oklch(0.964 0.050 92.16) | #fff3ce | hsl(45, 100%, 90%) |
|
|
| 200 | oklch(0.967 0.048 93.00) | #fff4d0 | hsl(46, 100%, 91%) |
|
|
| 300 | oklch(0.967 0.046 92.18) | #fff4d2 | hsl(45, 100%, 91%) |
|
|
| 400 | oklch(0.970 0.044 93.09) | #fff5d4 | hsl(46, 100%, 92%) |
|
|
| 500 | oklch(0.970 0.042 92.20) | #fff5d6 | hsl(45, 100%, 92%) |
|
|
| 600 | oklch(0.915 0.120 92.36) | #ffe182 | hsl(46, 100%, 75%) |
|
|
| 700 | oklch(0.866 0.166 88.93) | #ffcc2f | hsl(45, 100%, 59%) |
|
|
| 800 | oklch(0.751 0.154 85.34) | #daa500 | hsl(45, 100%, 43%) |
|
|
| 900 | oklch(0.529 0.108 86.27) | #876600 | hsl(45, 100%, 26%) |
|
|
| 950 | oklch(0.279 0.057 91.01) | #332700 | hsl(46, 100%, 10%) |
|
dsfds
| 50 | oklch(0.939 0.044 68.35) | #ffe6cc | hsl(31, 100%, 90%) |
|
|
| 100 | oklch(0.917 0.059 67.79) | #ffddba | hsl(30, 100%, 86%) |
|
|
| 200 | oklch(0.894 0.076 66.60) | #ffd3a7 | hsl(30, 100%, 83%) |
|
|
| 300 | oklch(0.874 0.091 66.16) | #ffca95 | hsl(30, 100%, 79%) |
|
|
| 400 | oklch(0.854 0.107 66.02) | #ffc182 | hsl(30, 100%, 75%) |
|
|
| 500 | oklch(0.834 0.121 65.22) | #ffb870 | hsl(30, 100%, 72%) |
|
|
| 600 | oklch(0.774 0.164 60.59) | #ff9931 | hsl(30, 100%, 60%) |
|
|
| 700 | oklch(0.702 0.178 53.16) | #f17900 | hsl(30, 100%, 47%) |
|
|
| 800 | oklch(0.560 0.140 54.29) | #b15900 | hsl(30, 100%, 35%) |
|
|
| 900 | oklch(0.410 0.100 56.11) | #723900 | hsl(30, 100%, 22%) |
|
|
| 950 | oklch(0.247 0.056 63.84) | #331a00 | hsl(31, 100%, 10%) |
|
dsfds
| 50 | oklch(0.908 0.033 27.11) | #f6d9d5 | hsl(7, 65%, 90%) |
|
|
| 100 | oklch(0.851 0.055 26.72) | #f0c1bb | hsl(7, 64%, 84%) |
|
|
| 200 | oklch(0.794 0.078 26.84) | #eaa9a1 | hsl(7, 63%, 77%) |
|
|
| 300 | oklch(0.740 0.104 27.20) | #e59187 | hsl(6, 64%, 71%) |
|
|
| 400 | oklch(0.687 0.129 27.89) | #df796d | hsl(6, 64%, 65%) |
|
|
| 500 | oklch(0.638 0.154 28.80) | #d96153 | hsl(6, 64%, 59%) |
|
|
| 600 | oklch(0.571 0.183 30.29) | #cd3e2d | hsl(6, 64%, 49%) |
|
|
| 700 | oklch(0.486 0.152 30.34) | #a43224 | hsl(7, 64%, 39%) |
|
|
| 800 | oklch(0.397 0.121 29.96) | #7b251b | hsl(6, 64%, 29%) |
|
|
| 900 | oklch(0.306 0.088 29.86) | #531912 | hsl(6, 64%, 20%) |
|
|
| 950 | oklch(0.206 0.050 29.94) | #2a0d09 | hsl(7, 65%, 10%) |
|
dsfds
| 50 | oklch(0.892 0.052 267.44) | #ccdbff | hsl(222, 100%, 90%) |
|
|
| 100 | oklch(0.710 0.151 265.59) | #749dff | hsl(222, 100%, 73%) |
|
|
| 200 | oklch(0.552 0.247 263.35) | #1b5eff | hsl(222, 100%, 55%) |
|
|
| 300 | oklch(0.425 0.217 263.16) | #0039c2 | hsl(222, 100%, 38%) |
|
|
| 400 | oklch(0.280 0.134 262.40) | #001f69 | hsl(222, 100%, 21%) |
|
|
| 500 | oklch(0.115 0.035 252.37) | #000511 | hsl(222, 100%, 3%) |
|
|
| 600 | oklch(0.131 0.043 255.01) | #000718 | hsl(223, 100%, 5%) |
|
|
| 700 | oklch(0.145 0.052 257.13) | #00091f | hsl(223, 100%, 6%) |
|
|
| 800 | oklch(0.157 0.059 258.24) | #000b25 | hsl(222, 100%, 7%) |
|
|
| 900 | oklch(0.170 0.067 259.43) | #000d2c | hsl(222, 100%, 9%) |
|
|
| 950 | oklch(0.183 0.076 260.25) | #000f33 | hsl(222, 100%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.
