Coastal Serenity Color Palette
This palette exudes a serene yet vibrant coastal vibe, blending deep navy blues, soft sky tones, and a pop of warm coral, creating an inviting atmosphere perfect for refreshing seaside escapes.
Practical uses and creative applications
The Coastal Serenity Color Palette is a harmonious blend of deep ocean blues and soft, sandy hues, perfect for evoking a sense of tranquility and calm. Featuring striking shades like #1b325f, #9cc4e4, and #f26c4f, this palette is ideal for brands that want to convey a refreshing and inviting vibe.
Whether you're a designer working on a new web project, a packaging designer looking to create a beach-inspired product line, or an interior decorator aiming to bring the soothing essence of the coast into a space, this color palette offers endless possibilities. Ideal for creatives seeking to capture the essence of coastal living, the Coastal Serenity Color Palette is particularly well-suited for lifestyle brands, wellness products, and travel-related businesses.
The combination of cool blues and warm coral tones creates a balanced aesthetic that resonates with audiences who appreciate nature's beauty. Use these colors to create stunning websites, eye-catching packaging, or serene interior spaces that evoke the peacefulness of a seaside retreat.
Let your designs transport your audience to their favorite coastal getaway, making them feel relaxed and inspired.
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.908 0.028 263.43) | #d7e1f4 | hsl(219, 57%, 90%) |
|
|
| 100 | oklch(0.784 0.068 264.07) | #a3b9e5 | hsl(220, 56%, 77%) |
|
|
| 200 | oklch(0.660 0.111 263.15) | #6e91d6 | hsl(220, 56%, 64%) |
|
|
| 300 | oklch(0.540 0.154 262.05) | #3a6ac7 | hsl(220, 56%, 50%) |
|
|
| 400 | oklch(0.436 0.121 261.94) | #2a4e93 | hsl(219, 56%, 37%) |
|
|
| 500 | oklch(0.325 0.085 262.32) | #1b325f | hsl(220, 56%, 24%) |
|
|
| 600 | oklch(0.300 0.077 262.66) | #182c54 | hsl(220, 56%, 21%) |
|
|
| 700 | oklch(0.275 0.069 263.11) | #152649 | hsl(220, 55%, 18%) |
|
|
| 800 | oklch(0.252 0.059 262.33) | #12213e | hsl(220, 55%, 16%) |
|
|
| 900 | oklch(0.225 0.050 261.69) | #0e1b33 | hsl(219, 57%, 13%) |
|
|
| 950 | oklch(0.198 0.041 262.24) | #0b1528 | hsl(219, 57%, 10%) |
|
dsfds
| 50 | oklch(0.920 0.025 242.35) | #d7e7f4 | hsl(207, 57%, 90%) |
|
|
| 100 | oklch(0.896 0.032 242.38) | #cbe0f1 | hsl(207, 58%, 87%) |
|
|
| 200 | oklch(0.873 0.040 242.46) | #bfd9ee | hsl(207, 58%, 84%) |
|
|
| 300 | oklch(0.850 0.046 242.32) | #b4d2ea | hsl(207, 56%, 81%) |
|
|
| 400 | oklch(0.826 0.054 242.49) | #a8cbe7 | hsl(207, 57%, 78%) |
|
|
| 500 | oklch(0.802 0.062 242.69) | #9cc4e4 | hsl(207, 57%, 75%) |
|
|
| 600 | oklch(0.700 0.096 244.01) | #68a5d6 | hsl(207, 57%, 62%) |
|
|
| 700 | oklch(0.598 0.124 246.50) | #3685c5 | hsl(207, 57%, 49%) |
|
|
| 800 | oklch(0.480 0.097 245.94) | #276291 | hsl(207, 58%, 36%) |
|
|
| 900 | oklch(0.355 0.066 244.40) | #193f5c | hsl(206, 57%, 23%) |
|
|
| 950 | oklch(0.215 0.034 244.80) | #0b1b28 | hsl(207, 57%, 10%) |
|
dsfds
| 50 | oklch(0.920 0.025 242.35) | #d7e7f4 | hsl(207, 57%, 90%) |
|
|
| 100 | oklch(0.927 0.022 243.81) | #dbe9f5 | hsl(208, 57%, 91%) |
|
|
| 200 | oklch(0.936 0.020 238.67) | #deecf6 | hsl(205, 57%, 92%) |
|
|
| 300 | oklch(0.943 0.018 240.00) | #e2eef7 | hsl(206, 57%, 93%) |
|
|
| 400 | oklch(0.949 0.016 239.11) | #e5f0f8 | hsl(205, 58%, 94%) |
|
|
| 500 | oklch(0.956 0.013 240.95) | #e9f2f9 | hsl(206, 57%, 95%) |
|
|
| 600 | oklch(0.822 0.057 241.99) | #a5cae7 | hsl(206, 58%, 78%) |
|
|
| 700 | oklch(0.689 0.099 243.49) | #62a2d4 | hsl(206, 57%, 61%) |
|
|
| 800 | oklch(0.554 0.113 245.49) | #3078b0 | hsl(206, 57%, 44%) |
|
|
| 900 | oklch(0.395 0.076 244.38) | #1d4a6c | hsl(206, 58%, 27%) |
|
|
| 950 | oklch(0.215 0.034 244.80) | #0b1b28 | hsl(207, 57%, 10%) |
|
dsfds
| 50 | oklch(0.920 0.025 242.35) | #d7e7f4 | hsl(207, 57%, 90%) |
|
|
| 100 | oklch(0.857 0.044 243.00) | #b8d4eb | hsl(207, 56%, 82%) |
|
|
| 200 | oklch(0.793 0.065 243.73) | #98c1e3 | hsl(207, 57%, 74%) |
|
|
| 300 | oklch(0.733 0.085 243.29) | #79afda | hsl(207, 57%, 66%) |
|
|
| 400 | oklch(0.671 0.106 244.63) | #599cd2 | hsl(207, 57%, 59%) |
|
|
| 500 | oklch(0.611 0.124 246.31) | #3a89c9 | hsl(207, 57%, 51%) |
|
|
| 600 | oklch(0.539 0.111 246.77) | #2f73ab | hsl(207, 57%, 43%) |
|
|
| 700 | oklch(0.464 0.093 246.43) | #265d8a | hsl(207, 57%, 35%) |
|
|
| 800 | oklch(0.385 0.075 245.91) | #1d4769 | hsl(207, 57%, 26%) |
|
|
| 900 | oklch(0.303 0.056 246.05) | #143149 | hsl(207, 57%, 18%) |
|
|
| 950 | oklch(0.215 0.034 244.80) | #0b1b28 | hsl(207, 57%, 10%) |
|
dsfds
| 50 | oklch(0.907 0.042 30.85) | #fbd7d0 | hsl(10, 84%, 90%) |
|
|
| 100 | oklch(0.861 0.067 32.27) | #fac2b6 | hsl(11, 87%, 85%) |
|
|
| 200 | oklch(0.813 0.093 32.32) | #f8ac9c | hsl(10, 87%, 79%) |
|
|
| 300 | oklch(0.769 0.119 33.25) | #f69782 | hsl(11, 87%, 74%) |
|
|
| 400 | oklch(0.727 0.146 32.99) | #f48169 | hsl(10, 86%, 68%) |
|
|
| 500 | oklch(0.690 0.171 33.73) | #f26c4f | hsl(11, 86%, 63%) |
|
|
| 600 | oklch(0.630 0.214 33.34) | #ee421d | hsl(11, 86%, 52%) |
|
|
| 700 | oklch(0.542 0.192 32.92) | #c62f0f | hsl(10, 86%, 42%) |
|
|
| 800 | oklch(0.440 0.152 33.12) | #94230b | hsl(11, 86%, 31%) |
|
|
| 900 | oklch(0.331 0.110 33.52) | #621707 | hsl(11, 87%, 21%) |
|
|
| 950 | oklch(0.211 0.061 34.69) | #2f0b04 | hsl(10, 84%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.
