Tranquil Coastal Color Palette
This palette exudes a tranquil yet uplifting vibe, blending deep ocean blues and soothing greens with warm golden yellows and soft creams, reminiscent of a serene coastal sunset.
Practical uses and creative applications
The Tranquil Coastal Color Palette features a harmonious blend of deep ocean blues and soft sandy hues, making it an ideal choice for designers seeking to evoke a sense of calm and serenity. With main colors like #204b5e, #426b65, #baab6a, #fbea80, and #fdfac7, this palette is perfect for branding efforts that aim to convey tranquility, reliability, and a connection to nature.
Whether you're developing a coastal-themed logo or creating marketing materials for a beach resort, these colors work beautifully together to create an inviting atmosphere. Ideal for web design and packaging, the Tranquil Coastal Color Palette can enhance user experience by instilling a sense of relaxation and comfort.
The soothing combination of colors is particularly suited for wellness brands, eco-friendly products, or interior spaces designed for leisure and rejuvenation. Designers and creatives looking to infuse their work with a fresh, airy vibe will find this palette an excellent choice for residential interiors, spas, or lifestyle blogs focused on relaxation and outdoor living.
Embrace the tranquility of the coast in your next project by incorporating these serene shades into your 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.927 0.021 227.53) | #d9eaf2 | hsl(199, 49%, 90%) |
|
|
| 100 | oklch(0.832 0.049 227.05) | #a7cfe1 | hsl(199, 49%, 77%) |
|
|
| 200 | oklch(0.738 0.075 228.25) | #76b4d0 | hsl(199, 49%, 64%) |
|
|
| 300 | oklch(0.647 0.099 230.31) | #4499bf | hsl(199, 49%, 51%) |
|
|
| 400 | oklch(0.526 0.080 229.90) | #317390 | hsl(198, 49%, 38%) |
|
|
| 500 | oklch(0.391 0.057 229.62) | #204b5e | hsl(198, 49%, 25%) |
|
|
| 600 | oklch(0.359 0.052 229.83) | #1c4253 | hsl(199, 50%, 22%) |
|
|
| 700 | oklch(0.327 0.047 230.11) | #183948 | hsl(199, 50%, 19%) |
|
|
| 800 | oklch(0.294 0.039 229.13) | #15303c | hsl(198, 48%, 16%) |
|
|
| 900 | oklch(0.260 0.034 229.46) | #112731 | hsl(199, 48%, 13%) |
|
|
| 950 | oklch(0.224 0.028 230.02) | #0d1e26 | hsl(199, 49%, 10%) |
|
dsfds
| 50 | oklch(0.933 0.014 185.94) | #dfecea | hsl(171, 25%, 90%) |
|
|
| 100 | oklch(0.856 0.028 185.47) | #bcd6d2 | hsl(171, 24%, 79%) |
|
|
| 200 | oklch(0.778 0.043 184.87) | #99c0ba | hsl(171, 24%, 68%) |
|
|
| 300 | oklch(0.699 0.057 184.26) | #75aaa2 | hsl(171, 24%, 56%) |
|
|
| 400 | oklch(0.607 0.059 183.96) | #588e86 | hsl(171, 23%, 45%) |
|
|
| 500 | oklch(0.496 0.047 184.16) | #426b65 | hsl(171, 24%, 34%) |
|
|
| 600 | oklch(0.446 0.041 184.51) | #395c57 | hsl(171, 23%, 29%) |
|
|
| 700 | oklch(0.395 0.037 185.24) | #2f4d49 | hsl(172, 24%, 24%) |
|
|
| 800 | oklch(0.343 0.031 182.84) | #263e3a | hsl(170, 24%, 20%) |
|
|
| 900 | oklch(0.288 0.024 183.02) | #1d2f2c | hsl(170, 24%, 15%) |
|
|
| 950 | oklch(0.231 0.019 184.09) | #13201e | hsl(171, 25%, 10%) |
|
dsfds
| 50 | oklch(0.939 0.020 94.53) | #efebdc | hsl(47, 37%, 90%) |
|
|
| 100 | oklch(0.899 0.034 95.89) | #e4dec5 | hsl(48, 36%, 83%) |
|
|
| 200 | oklch(0.861 0.049 96.88) | #dad2ae | hsl(49, 37%, 77%) |
|
|
| 300 | oklch(0.820 0.061 97.02) | #cfc598 | hsl(49, 36%, 70%) |
|
|
| 400 | oklch(0.780 0.074 96.44) | #c5b881 | hsl(49, 37%, 64%) |
|
|
| 500 | oklch(0.739 0.087 96.74) | #baab6a | hsl(49, 37%, 57%) |
|
|
| 600 | oklch(0.672 0.096 96.50) | #a7964d | hsl(49, 37%, 48%) |
|
|
| 700 | oklch(0.572 0.080 96.08) | #86783e | hsl(48, 37%, 38%) |
|
|
| 800 | oklch(0.470 0.064 96.85) | #655b2f | hsl(49, 36%, 29%) |
|
|
| 900 | oklch(0.359 0.047 96.57) | #443d1f | hsl(49, 37%, 19%) |
|
|
| 950 | oklch(0.239 0.027 94.96) | #231f10 | hsl(47, 37%, 10%) |
|
dsfds
| 50 | oklch(0.971 0.053 100.43) | #fdf7ce | hsl(52, 92%, 90%) |
|
|
| 100 | oklch(0.961 0.070 99.66) | #fdf4be | hsl(51, 94%, 87%) |
|
|
| 200 | oklch(0.953 0.086 100.66) | #fcf2af | hsl(52, 93%, 84%) |
|
|
| 300 | oklch(0.945 0.101 100.13) | #fcef9f | hsl(52, 94%, 81%) |
|
|
| 400 | oklch(0.937 0.115 100.82) | #fbed90 | hsl(52, 93%, 77%) |
|
|
| 500 | oklch(0.929 0.128 100.35) | #fbea80 | hsl(52, 94%, 74%) |
|
|
| 600 | oklch(0.899 0.169 99.54) | #f9df40 | hsl(52, 94%, 61%) |
|
|
| 700 | oklch(0.859 0.176 97.82) | #f0d008 | hsl(52, 94%, 49%) |
|
|
| 800 | oklch(0.684 0.140 97.82) | #b19906 | hsl(52, 93%, 36%) |
|
|
| 900 | oklch(0.496 0.101 98.56) | #716204 | hsl(52, 93%, 23%) |
|
|
| 950 | oklch(0.287 0.058 100.75) | #312b02 | hsl(52, 92%, 10%) |
|
dsfds
| 50 | oklch(0.978 0.058 105.32) | #fdfbce | hsl(57, 92%, 90%) |
|
|
| 100 | oklch(0.976 0.059 104.36) | #fdfacc | hsl(56, 92%, 90%) |
|
|
| 200 | oklch(0.976 0.061 104.44) | #fdfacb | hsl(56, 93%, 89%) |
|
|
| 300 | oklch(0.976 0.062 104.52) | #fdfaca | hsl(56, 93%, 89%) |
|
|
| 400 | oklch(0.975 0.064 104.68) | #fdfac8 | hsl(57, 93%, 89%) |
|
|
| 500 | oklch(0.975 0.066 104.75) | #fdfac7 | hsl(57, 93%, 89%) |
|
|
| 600 | oklch(0.946 0.143 105.83) | #faf37a | hsl(57, 93%, 73%) |
|
|
| 700 | oklch(0.923 0.188 105.95) | #f7ec2c | hsl(57, 93%, 57%) |
|
|
| 800 | oklch(0.795 0.168 105.45) | #ccc107 | hsl(57, 93%, 41%) |
|
|
| 900 | oklch(0.561 0.118 105.48) | #7f7805 | hsl(57, 92%, 26%) |
|
|
| 950 | oklch(0.298 0.062 106.97) | #312f02 | hsl(57, 92%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.
