Coastal Serenity Color Palette
This palette exudes a refreshing coastal vibe, blending soft sandy beige (#f7f3cf) with soothing minty greens (#c2e4cb, #36cecc) and deep teal blues (#27b1bf, #176585) for a tranquil yet vibrant seaside escape.
Practical uses and creative applications
The Coastal Serenity Color Palette evokes the tranquil essence of seaside living, making it an ideal choice for designers and creatives seeking to infuse a calming atmosphere into their work. Featuring soft sandy beige (#f7f3cf), soothing seafoam green (#c2e4cb), vibrant turquoise (#36cecc), deep ocean blue (#27b1bf), and rich navy (#176585), this palette captures the serene beauty of coastal landscapes.
Whether you're working on branding for a beachside café or designing an ocean-themed website, these colors work harmoniously to create a refreshing and inviting vibe. Perfect for web design, packaging, and interiors, the Coastal Serenity Palette is particularly suited for businesses that want to convey a sense of tranquility and relaxation.
It speaks to audiences in the wellness sectorthink spas, yoga studios, or coastal retreatsas well as lifestyle brands that promote a relaxed, beach-inspired lifestyle. By employing this palette, designers can evoke feelings of peace and serenity, making it a fantastic choice for any creative project aiming to transport viewers to a serene seaside escape.
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.962 0.043 101.49) | #f8f4d3 | hsl(54, 73%, 90%) |
|
|
| 100 | oklch(0.962 0.045 101.67) | #f8f4d2 | hsl(54, 73%, 90%) |
|
|
| 200 | oklch(0.961 0.044 103.05) | #f7f4d2 | hsl(55, 70%, 90%) |
|
|
| 300 | oklch(0.959 0.045 101.67) | #f7f3d1 | hsl(54, 70%, 89%) |
|
|
| 400 | oklch(0.958 0.046 101.85) | #f7f3d0 | hsl(54, 71%, 89%) |
|
|
| 500 | oklch(0.958 0.047 102.02) | #f7f3cf | hsl(54, 71%, 89%) |
|
|
| 600 | oklch(0.901 0.110 103.27) | #ebe28a | hsl(54, 71%, 73%) |
|
|
| 700 | oklch(0.847 0.154 102.65) | #e0d045 | hsl(54, 71%, 57%) |
|
|
| 800 | oklch(0.719 0.144 102.55) | #b6a71e | hsl(54, 72%, 42%) |
|
|
| 900 | oklch(0.508 0.099 102.11) | #716713 | hsl(54, 71%, 26%) |
|
|
| 950 | oklch(0.273 0.049 102.38) | #2c2807 | hsl(54, 73%, 10%) |
|
dsfds
| 50 | oklch(0.934 0.027 153.87) | #dcefe1 | hsl(136, 37%, 90%) |
|
|
| 100 | oklch(0.925 0.033 152.43) | #d7eddc | hsl(134, 38%, 89%) |
|
|
| 200 | oklch(0.916 0.037 153.88) | #d1ebd8 | hsl(136, 39%, 87%) |
|
|
| 300 | oklch(0.907 0.042 154.03) | #cce9d4 | hsl(137, 40%, 86%) |
|
|
| 400 | oklch(0.896 0.045 153.28) | #c7e6cf | hsl(135, 38%, 84%) |
|
|
| 500 | oklch(0.887 0.049 153.43) | #c2e4cb | hsl(136, 39%, 83%) |
|
|
| 600 | oklch(0.794 0.091 151.99) | #8fcd9f | hsl(135, 38%, 68%) |
|
|
| 700 | oklch(0.703 0.131 150.38) | #5bb673 | hsl(136, 38%, 54%) |
|
|
| 800 | oklch(0.570 0.115 150.20) | #3d8a52 | hsl(136, 39%, 39%) |
|
|
| 900 | oklch(0.412 0.080 150.21) | #265733 | hsl(136, 39%, 25%) |
|
|
| 950 | oklch(0.235 0.037 151.17) | #102315 | hsl(136, 37%, 10%) |
|
dsfds
| 50 | oklch(0.948 0.032 196.62) | #d6f5f5 | hsl(180, 61%, 90%) |
|
|
| 100 | oklch(0.908 0.056 194.82) | #b6edec | hsl(179, 60%, 82%) |
|
|
| 200 | oklch(0.871 0.078 194.80) | #96e5e4 | hsl(179, 60%, 74%) |
|
|
| 300 | oklch(0.838 0.097 193.81) | #76dedc | hsl(179, 61%, 67%) |
|
|
| 400 | oklch(0.805 0.112 193.72) | #56d6d4 | hsl(179, 61%, 59%) |
|
|
| 500 | oklch(0.776 0.122 193.60) | #36cecc | hsl(179, 61%, 51%) |
|
|
| 600 | oklch(0.687 0.108 194.15) | #2bafae | hsl(180, 61%, 43%) |
|
|
| 700 | oklch(0.589 0.092 193.05) | #238e8c | hsl(179, 60%, 35%) |
|
|
| 800 | oklch(0.485 0.075 193.74) | #1a6c6b | hsl(179, 61%, 26%) |
|
|
| 900 | oklch(0.377 0.057 193.30) | #124b4a | hsl(179, 61%, 18%) |
|
|
| 950 | oklch(0.258 0.036 195.16) | #0a2929 | hsl(180, 61%, 10%) |
|
dsfds
| 50 | oklch(0.943 0.032 203.97) | #d5f3f6 | hsl(185, 65%, 90%) |
|
|
| 100 | oklch(0.897 0.059 204.10) | #afe9ef | hsl(186, 67%, 81%) |
|
|
| 200 | oklch(0.850 0.083 204.35) | #89dee7 | hsl(186, 66%, 72%) |
|
|
| 300 | oklch(0.809 0.103 203.95) | #63d4df | hsl(185, 66%, 63%) |
|
|
| 400 | oklch(0.769 0.117 204.90) | #3dc9d7 | hsl(185, 66%, 54%) |
|
|
| 500 | oklch(0.697 0.112 205.54) | #27b1bf | hsl(186, 66%, 45%) |
|
|
| 600 | oklch(0.615 0.098 205.66) | #2195a1 | hsl(186, 66%, 38%) |
|
|
| 700 | oklch(0.532 0.084 205.75) | #1b7a84 | hsl(186, 66%, 31%) |
|
|
| 800 | oklch(0.443 0.069 206.01) | #155e66 | hsl(186, 66%, 24%) |
|
|
| 900 | oklch(0.352 0.053 204.47) | #0f4348 | hsl(185, 66%, 17%) |
|
|
| 950 | oklch(0.252 0.035 204.43) | #09272a | hsl(185, 65%, 10%) |
|
dsfds
| 50 | oklch(0.931 0.030 223.77) | #d4edf7 | hsl(197, 69%, 90%) |
|
|
| 100 | oklch(0.851 0.066 225.23) | #a0d8ef | hsl(197, 71%, 78%) |
|
|
| 200 | oklch(0.774 0.098 227.32) | #6cc2e6 | hsl(198, 71%, 66%) |
|
|
| 300 | oklch(0.704 0.122 230.15) | #39addd | hsl(198, 71%, 55%) |
|
|
| 400 | oklch(0.603 0.114 231.93) | #208cb9 | hsl(198, 71%, 43%) |
|
|
| 500 | oklch(0.477 0.088 231.05) | #176585 | hsl(197, 71%, 31%) |
|
|
| 600 | oklch(0.430 0.078 231.23) | #145773 | hsl(198, 70%, 26%) |
|
|
| 700 | oklch(0.385 0.068 230.00) | #114a61 | hsl(197, 70%, 22%) |
|
|
| 800 | oklch(0.335 0.058 230.12) | #0e3c4f | hsl(198, 70%, 18%) |
|
|
| 900 | oklch(0.287 0.047 228.00) | #0b2f3d | hsl(197, 69%, 14%) |
|
|
| 950 | oklch(0.234 0.036 227.68) | #08212b | hsl(197, 69%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.
