Serene Coastal Color Palette
This palette radiates a serene, coastal elegance with soft sandy hues, cool oceanic blues, and warm earthy accents, evoking a tranquil retreat by the shore.
Practical uses and creative applications
The Serene Coastal Color Palette evokes the tranquil beauty of seaside landscapes, making it an ideal choice for designers and creatives looking to infuse their projects with a calming, sophisticated vibe. Featuring soft neutrals like #F8EDE3 and #B3BAC0 paired with deeper oceanic hues such as #19334A and #00182F, this palette elegantly balances warmth and coolness.
Whether you're designing a brand identity, crafting an engaging website, or creating serene packaging, these colors work harmoniously to convey a sense of peace and reliability. Perfect for brands in the wellness, travel, or lifestyle sectors, the Serene Coastal Color Palette speaks to audiences seeking relaxation and inspiration.
Interior designers can utilize these soothing shades to create inviting spaces that promote tranquility, while web designers can harness the palette for user-friendly interfaces that enhance the browsing experience. With its versatile and stylish approach, this color palette is tailored for those who wish to evoke a coastal retreat in their work, appealing to creatives who appreciate the beauty of nature-inspired designs.
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.931 0.027 65.67) | #f5e5d6 | hsl(29, 61%, 90%) |
|
|
| 100 | oklch(0.933 0.024 63.49) | #f5e6d9 | hsl(28, 58%, 91%) |
|
|
| 200 | oklch(0.939 0.023 65.46) | #f6e8db | hsl(29, 60%, 91%) |
|
|
| 300 | oklch(0.944 0.021 65.31) | #f7eade | hsl(29, 61%, 92%) |
|
|
| 400 | oklch(0.947 0.020 65.14) | #f7ebe0 | hsl(29, 59%, 92%) |
|
|
| 500 | oklch(0.952 0.018 64.93) | #f8ede3 | hsl(29, 60%, 93%) |
|
|
| 600 | oklch(0.835 0.063 63.62) | #e7c19f | hsl(28, 60%, 76%) |
|
|
| 700 | oklch(0.724 0.108 62.43) | #d6965b | hsl(29, 60%, 60%) |
|
|
| 800 | oklch(0.592 0.117 59.46) | #b06b2c | hsl(29, 60%, 43%) |
|
|
| 900 | oklch(0.422 0.080 59.89) | #6d421b | hsl(29, 60%, 27%) |
|
|
| 950 | oklch(0.230 0.036 62.58) | #29190a | hsl(29, 61%, 10%) |
|
dsfds
| 50 | oklch(0.923 0.004 236.50) | #e3e6e8 | hsl(204, 10%, 90%) |
|
|
| 100 | oklch(0.895 0.006 239.83) | #d9dde0 | hsl(206, 10%, 86%) |
|
|
| 200 | oklch(0.868 0.007 247.91) | #d0d4d8 | hsl(210, 9%, 83%) |
|
|
| 300 | oklch(0.840 0.009 247.93) | #c6cbd0 | hsl(210, 10%, 80%) |
|
|
| 400 | oklch(0.814 0.010 242.87) | #bdc3c8 | hsl(207, 9%, 76%) |
|
|
| 500 | oklch(0.785 0.012 243.69) | #b3bac0 | hsl(208, 9%, 73%) |
|
|
| 600 | oklch(0.681 0.018 245.19) | #909aa3 | hsl(208, 9%, 60%) |
|
|
| 700 | oklch(0.573 0.022 245.85) | #6e7a85 | hsl(209, 9%, 48%) |
|
|
| 800 | oklch(0.463 0.017 244.99) | #515a62 | hsl(208, 9%, 35%) |
|
|
| 900 | oklch(0.345 0.012 243.17) | #343a3f | hsl(207, 10%, 23%) |
|
|
| 950 | oklch(0.215 0.006 236.85) | #171a1c | hsl(204, 10%, 10%) |
|
dsfds
| 50 | oklch(0.919 0.022 245.86) | #d9e6f2 | hsl(209, 49%, 90%) |
|
|
| 100 | oklch(0.803 0.054 245.89) | #a3c3e0 | hsl(209, 50%, 76%) |
|
|
| 200 | oklch(0.688 0.087 246.67) | #6da0ce | hsl(208, 50%, 62%) |
|
|
| 300 | oklch(0.574 0.110 247.88) | #3d7db6 | hsl(208, 50%, 48%) |
|
|
| 400 | oklch(0.448 0.083 247.63) | #2b5880 | hsl(208, 50%, 34%) |
|
|
| 500 | oklch(0.312 0.053 247.09) | #19334a | hsl(208, 49%, 19%) |
|
|
| 600 | oklch(0.293 0.048 247.73) | #172e43 | hsl(209, 49%, 18%) |
|
|
| 700 | oklch(0.273 0.045 247.48) | #14293c | hsl(209, 50%, 16%) |
|
|
| 800 | oklch(0.253 0.039 246.84) | #122434 | hsl(208, 49%, 14%) |
|
|
| 900 | oklch(0.233 0.035 246.39) | #0f1f2d | hsl(208, 50%, 12%) |
|
|
| 950 | oklch(0.212 0.030 247.51) | #0d1a26 | hsl(209, 49%, 10%) |
|
dsfds
| 50 | oklch(0.914 0.044 247.26) | #cce6ff | hsl(209, 100%, 90%) |
|
|
| 100 | oklch(0.782 0.116 248.46) | #7abeff | hsl(209, 100%, 74%) |
|
|
| 200 | oklch(0.664 0.183 252.34) | #2795ff | hsl(209, 100%, 58%) |
|
|
| 300 | oklch(0.541 0.180 255.33) | #006cd4 | hsl(209, 100%, 42%) |
|
|
| 400 | oklch(0.382 0.121 253.95) | #004281 | hsl(209, 100%, 25%) |
|
|
| 500 | oklch(0.205 0.056 248.59) | #00182f | hsl(209, 100%, 9%) |
|
|
| 600 | oklch(0.205 0.057 249.54) | #001830 | hsl(210, 100%, 9%) |
|
|
| 700 | oklch(0.209 0.058 248.96) | #001931 | hsl(209, 100%, 10%) |
|
|
| 800 | oklch(0.209 0.058 248.96) | #001931 | hsl(209, 100%, 10%) |
|
|
| 900 | oklch(0.213 0.058 248.40) | #001a32 | hsl(209, 100%, 10%) |
|
|
| 950 | oklch(0.214 0.059 249.31) | #001a33 | hsl(209, 100%, 10%) |
|
dsfds
| 50 | oklch(0.931 0.015 77.07) | #eee7dd | hsl(35, 33%, 90%) |
|
|
| 100 | oklch(0.880 0.027 80.24) | #e1d6c4 | hsl(37, 33%, 83%) |
|
|
| 200 | oklch(0.827 0.038 79.06) | #d4c4ab | hsl(37, 32%, 75%) |
|
|
| 300 | oklch(0.773 0.050 78.28) | #c7b292 | hsl(36, 32%, 68%) |
|
|
| 400 | oklch(0.721 0.063 79.78) | #baa178 | hsl(37, 32%, 60%) |
|
|
| 500 | oklch(0.666 0.074 78.71) | #ad8f5f | hsl(37, 32%, 53%) |
|
|
| 600 | oklch(0.591 0.070 79.53) | #94794c | hsl(38, 32%, 44%) |
|
|
| 700 | oklch(0.507 0.060 78.00) | #78613d | hsl(37, 33%, 35%) |
|
|
| 800 | oklch(0.420 0.047 78.52) | #5b4a2f | hsl(37, 32%, 27%) |
|
|
| 900 | oklch(0.328 0.035 80.71) | #3e3320 | hsl(38, 32%, 18%) |
|
|
| 950 | oklch(0.227 0.021 76.21) | #221b11 | hsl(35, 33%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.
