Coastal Serenity Color Palette
This palette radiates a serene coastal vibe, blending vibrant teal and soft seafoam with gentle sandy beige and creamy pastel hues for a fresh, breezy feel that's both tranquil and uplifting.
Practical uses and creative applications
The Coastal Serenity Color Palette is a refreshing blend of soothing hues that evoke the tranquil essence of seaside escapes. Featuring vibrant teal (#00ccbe) and deep sea green (#09a6a3), complemented by soft sage (#9dbfaf), muted cream (#edebc9), and gentle sand (#fcf9d8), this palette is perfect for branding and web design aimed at wellness, lifestyle, and travel industries.
Designers can leverage these colors to create inviting experiences that resonate with audiences seeking relaxation and rejuvenation. Ideal for creatives and brands targeting a serene, coastal vibe, the Coastal Serenity palette is well-suited for packaging designs, interior decor, and marketing materials.
Whether you're a designer crafting a brand identity for a beachside resort or an artist looking to infuse calmness into your portfolio, these colors evoke a sense of harmony and peace. Use this palette to enhance spaces with a coastal feel, or to create digital experiences that transport users to sandy shores, making it an excellent choice for those aiming to inspire tranquility and connection with nature.
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.964 0.052 191.88) | #ccfffc | hsl(176, 100%, 90%) |
|
|
| 100 | oklch(0.936 0.096 190.00) | #99fff8 | hsl(176, 100%, 80%) |
|
|
| 200 | oklch(0.916 0.130 189.11) | #66fff5 | hsl(176, 100%, 70%) |
|
|
| 300 | oklch(0.904 0.150 187.52) | #33fff1 | hsl(176, 100%, 60%) |
|
|
| 400 | oklch(0.900 0.158 186.25) | #00ffee | hsl(176, 100%, 50%) |
|
|
| 500 | oklch(0.761 0.133 186.12) | #00ccbe | hsl(176, 100%, 40%) |
|
|
| 600 | oklch(0.673 0.118 186.83) | #00ada2 | hsl(176, 100%, 34%) |
|
|
| 700 | oklch(0.585 0.103 186.19) | #008f85 | hsl(176, 100%, 28%) |
|
|
| 800 | oklch(0.491 0.086 187.26) | #007069 | hsl(176, 100%, 22%) |
|
|
| 900 | oklch(0.395 0.069 186.34) | #00524c | hsl(176, 100%, 16%) |
|
|
| 950 | oklch(0.289 0.050 188.51) | #003330 | hsl(176, 100%, 10%) |
|
dsfds
| 50 | oklch(0.960 0.046 196.41) | #cffcfc | hsl(180, 88%, 90%) |
|
|
| 100 | oklch(0.923 0.091 194.83) | #99f9f8 | hsl(179, 89%, 79%) |
|
|
| 200 | oklch(0.897 0.125 193.27) | #63f7f4 | hsl(179, 90%, 68%) |
|
|
| 300 | oklch(0.877 0.144 192.65) | #2df4f0 | hsl(179, 90%, 57%) |
|
|
| 400 | oklch(0.809 0.138 192.43) | #0cdcd8 | hsl(179, 90%, 45%) |
|
|
| 500 | oklch(0.656 0.111 192.49) | #09a6a3 | hsl(179, 90%, 34%) |
|
|
| 600 | oklch(0.585 0.099 193.02) | #088e8c | hsl(179, 89%, 29%) |
|
|
| 700 | oklch(0.515 0.087 192.71) | #067775 | hsl(179, 90%, 25%) |
|
|
| 800 | oklch(0.440 0.074 193.53) | #055f5e | hsl(179, 90%, 20%) |
|
|
| 900 | oklch(0.364 0.061 193.19) | #044847 | hsl(179, 89%, 15%) |
|
|
| 950 | oklch(0.281 0.046 194.86) | #033030 | hsl(180, 88%, 10%) |
|
dsfds
| 50 | oklch(0.930 0.013 167.16) | #e0ebe6 | hsl(153, 22%, 90%) |
|
|
| 100 | oklch(0.900 0.019 166.33) | #d3e2db | hsl(152, 21%, 86%) |
|
|
| 200 | oklch(0.868 0.025 167.00) | #c5d9d0 | hsl(153, 21%, 81%) |
|
|
| 300 | oklch(0.839 0.032 165.14) | #b8d1c5 | hsl(151, 21%, 77%) |
|
|
| 400 | oklch(0.807 0.038 165.57) | #aac8ba | hsl(152, 21%, 73%) |
|
|
| 500 | oklch(0.775 0.043 165.09) | #9dbfaf | hsl(152, 21%, 68%) |
|
|
| 600 | oklch(0.691 0.060 164.20) | #79a892 | hsl(152, 21%, 57%) |
|
|
| 700 | oklch(0.595 0.063 162.95) | #5b8b74 | hsl(151, 21%, 45%) |
|
|
| 800 | oklch(0.481 0.050 163.39) | #436756 | hsl(152, 21%, 33%) |
|
|
| 900 | oklch(0.360 0.035 163.36) | #2c4338 | hsl(151, 21%, 22%) |
|
|
| 950 | oklch(0.227 0.018 165.08) | #141f1a | hsl(153, 22%, 10%) |
|
dsfds
| 50 | oklch(0.953 0.032 105.04) | #f2f1d9 | hsl(58, 49%, 90%) |
|
|
| 100 | oklch(0.949 0.034 105.23) | #f1f0d6 | hsl(58, 49%, 89%) |
|
|
| 200 | oklch(0.945 0.038 105.49) | #f0efd2 | hsl(58, 50%, 88%) |
|
|
| 300 | oklch(0.940 0.039 104.01) | #efedcf | hsl(56, 50%, 87%) |
|
|
| 400 | oklch(0.936 0.042 104.25) | #eeeccc | hsl(56, 50%, 87%) |
|
|
| 500 | oklch(0.933 0.045 104.47) | #edebc9 | hsl(57, 50%, 86%) |
|
|
| 600 | oklch(0.863 0.091 105.40) | #dad68f | hsl(57, 50%, 71%) |
|
|
| 700 | oklch(0.792 0.129 106.02) | #c6c055 | hsl(57, 50%, 55%) |
|
|
| 800 | oklch(0.655 0.118 106.41) | #9a9533 | hsl(57, 50%, 40%) |
|
|
| 900 | oklch(0.468 0.082 106.48) | #605d20 | hsl(57, 50%, 25%) |
|
|
| 950 | oklch(0.259 0.039 106.68) | #26250d | hsl(58, 49%, 10%) |
|
dsfds
| 50 | oklch(0.971 0.052 103.78) | #fbf8d0 | hsl(56, 84%, 90%) |
|
|
| 100 | oklch(0.972 0.051 103.67) | #fbf8d1 | hsl(56, 84%, 90%) |
|
|
| 200 | oklch(0.973 0.048 102.16) | #fcf8d3 | hsl(54, 87%, 91%) |
|
|
| 300 | oklch(0.973 0.046 101.84) | #fcf8d5 | hsl(54, 87%, 91%) |
|
|
| 400 | oklch(0.975 0.046 103.18) | #fcf9d6 | hsl(55, 86%, 91%) |
|
|
| 500 | oklch(0.976 0.043 102.90) | #fcf9d8 | hsl(55, 86%, 92%) |
|
|
| 600 | oklch(0.933 0.120 103.87) | #f6ed8b | hsl(55, 86%, 75%) |
|
|
| 700 | oklch(0.895 0.172 103.95) | #f0e13d | hsl(55, 86%, 59%) |
|
|
| 800 | oklch(0.780 0.162 103.59) | #cabb10 | hsl(55, 85%, 43%) |
|
|
| 900 | oklch(0.548 0.112 103.24) | #7d730a | hsl(55, 85%, 26%) |
|
|
| 950 | oklch(0.288 0.057 105.09) | #2f2c04 | hsl(56, 84%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.
