Tranquil Coastal Color Palette
This palette exudes a tranquil, modern elegance with deep slate blues and soft grays, evoking a serene, coastal atmosphere that balances sophistication and calm.
Practical uses and creative applications
The Tranquil Coastal Color Palette beautifully captures the serene essence of the seaside, making it an ideal choice for various design applications. With deep tones like #2A363B reminiscent of stormy waters and softer hues such as #D3D9DF evoking gentle sea foam, this palette is perfect for branding that aims to convey calmness and reliability.
Whether you're creating a logo for a coastal retreat or designing packaging for eco-friendly products, these colors can establish a harmonious connection with nature while appealing to environmentally-conscious consumers. This palette is particularly suited for web design, especially for businesses in the wellness, travel, or lifestyle sectors.
Designers and creatives can utilize the soothing tones of #4A536B and #8595A1 to craft visually appealing interfaces that invite users to explore and engage. Additionally, the Tranquil Coastal Color Palette can enhance interior spaces, making it an excellent choice for those looking to create tranquil home environments or stylish commercial spaces.
Overall, this palette inspires relaxation and mindfulness, making it a go-to for anyone seeking to evoke a coastal retreat atmosphere in their work.
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.924 0.008 228.86) | #e1e7ea | hsl(200, 18%, 90%) |
|
|
| 100 | oklch(0.817 0.019 223.65) | #b7c6cc | hsl(197, 17%, 76%) |
|
|
| 200 | oklch(0.707 0.029 223.40) | #8ea5ae | hsl(197, 16%, 62%) |
|
|
| 300 | oklch(0.592 0.038 225.11) | #66838f | hsl(198, 17%, 48%) |
|
|
| 400 | oklch(0.462 0.028 227.10) | #485c65 | hsl(199, 17%, 34%) |
|
|
| 500 | oklch(0.324 0.018 225.13) | #2a363b | hsl(198, 17%, 20%) |
|
|
| 600 | oklch(0.305 0.017 221.97) | #263135 | hsl(196, 16%, 18%) |
|
|
| 700 | oklch(0.282 0.015 226.59) | #222b2f | hsl(198, 16%, 16%) |
|
|
| 800 | oklch(0.262 0.013 222.55) | #1e2629 | hsl(196, 15%, 14%) |
|
|
| 900 | oklch(0.241 0.013 222.64) | #192124 | hsl(196, 18%, 12%) |
|
|
| 950 | oklch(0.217 0.011 229.51) | #151b1e | hsl(200, 18%, 10%) |
|
dsfds
| 50 | oklch(0.916 0.010 273.35) | #e1e3ea | hsl(227, 18%, 90%) |
|
|
| 100 | oklch(0.824 0.020 270.17) | #c0c5d3 | hsl(224, 18%, 79%) |
|
|
| 200 | oklch(0.729 0.033 269.69) | #9fa7bd | hsl(224, 19%, 68%) |
|
|
| 300 | oklch(0.631 0.046 268.77) | #7e89a6 | hsl(224, 18%, 57%) |
|
|
| 400 | oklch(0.534 0.052 269.84) | #616c8c | hsl(225, 18%, 46%) |
|
|
| 500 | oklch(0.444 0.041 268.69) | #4a536b | hsl(224, 18%, 35%) |
|
|
| 600 | oklch(0.399 0.037 268.46) | #3f475c | hsl(223, 19%, 30%) |
|
|
| 700 | oklch(0.354 0.031 269.62) | #353b4c | hsl(224, 18%, 25%) |
|
|
| 800 | oklch(0.306 0.026 269.47) | #2a2f3d | hsl(224, 18%, 20%) |
|
|
| 900 | oklch(0.257 0.022 269.24) | #1f232e | hsl(224, 19%, 15%) |
|
|
| 950 | oklch(0.206 0.014 272.58) | #15171e | hsl(227, 18%, 10%) |
|
dsfds
| 50 | oklch(0.923 0.006 239.82) | #e2e6e9 | hsl(206, 14%, 90%) |
|
|
| 100 | oklch(0.873 0.009 236.58) | #d0d6da | hsl(204, 12%, 84%) |
|
|
| 200 | oklch(0.821 0.013 236.67) | #bdc6cc | hsl(204, 13%, 77%) |
|
|
| 300 | oklch(0.767 0.018 242.50) | #aab5be | hsl(207, 13%, 71%) |
|
|
| 400 | oklch(0.715 0.021 240.85) | #98a5af | hsl(206, 13%, 64%) |
|
|
| 500 | oklch(0.661 0.026 240.29) | #8595a1 | hsl(206, 13%, 58%) |
|
|
| 600 | oklch(0.580 0.030 241.51) | #6b7d8b | hsl(206, 13%, 48%) |
|
|
| 700 | oklch(0.495 0.025 241.75) | #56646f | hsl(206, 13%, 39%) |
|
|
| 800 | oklch(0.407 0.021 242.89) | #404b54 | hsl(207, 14%, 29%) |
|
|
| 900 | oklch(0.316 0.014 235.36) | #2b3338 | hsl(203, 13%, 19%) |
|
|
| 950 | oklch(0.215 0.008 240.30) | #161a1d | hsl(206, 14%, 10%) |
|
dsfds
| 50 | oklch(0.918 0.009 264.52) | #e1e4ea | hsl(220, 18%, 90%) |
|
|
| 100 | oklch(0.897 0.012 264.51) | #d9dde5 | hsl(220, 19%, 87%) |
|
|
| 200 | oklch(0.878 0.012 259.82) | #d2d7df | hsl(217, 17%, 85%) |
|
|
| 300 | oklch(0.856 0.015 260.73) | #cad0da | hsl(218, 18%, 82%) |
|
|
| 400 | oklch(0.835 0.017 262.74) | #c3c9d4 | hsl(219, 17%, 80%) |
|
|
| 500 | oklch(0.813 0.020 262.99) | #bbc2cf | hsl(219, 17%, 77%) |
|
|
| 600 | oklch(0.697 0.033 263.44) | #939eb3 | hsl(219, 17%, 64%) |
|
|
| 700 | oklch(0.578 0.047 262.82) | #6b7a96 | hsl(219, 17%, 50%) |
|
|
| 800 | oklch(0.463 0.037 263.25) | #4e596e | hsl(219, 17%, 37%) |
|
|
| 900 | oklch(0.343 0.025 260.08) | #313946 | hsl(217, 18%, 23%) |
|
|
| 950 | oklch(0.209 0.013 264.25) | #15181e | hsl(220, 18%, 10%) |
|
dsfds
| 50 | oklch(0.922 0.008 241.67) | #e1e6ea | hsl(207, 18%, 90%) |
|
|
| 100 | oklch(0.914 0.007 247.90) | #dfe3e7 | hsl(210, 14%, 89%) |
|
|
| 200 | oklch(0.907 0.008 241.67) | #dce1e5 | hsl(207, 15%, 88%) |
|
|
| 300 | oklch(0.898 0.009 247.92) | #d9dee3 | hsl(210, 15%, 87%) |
|
|
| 400 | oklch(0.891 0.009 242.85) | #d6dce1 | hsl(207, 15%, 86%) |
|
|
| 500 | oklch(0.882 0.011 247.95) | #d3d9df | hsl(210, 16%, 85%) |
|
|
| 600 | oklch(0.761 0.022 248.11) | #a7b3bf | hsl(210, 16%, 70%) |
|
|
| 700 | oklch(0.632 0.034 248.37) | #7a8c9e | hsl(210, 16%, 55%) |
|
|
| 800 | oklch(0.503 0.032 248.47) | #566676 | hsl(210, 16%, 40%) |
|
|
| 900 | oklch(0.366 0.022 248.42) | #36404a | hsl(210, 16%, 25%) |
|
|
| 950 | oklch(0.214 0.011 242.27) | #151a1e | hsl(207, 18%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.
