Tranquil Coastal Color Palette
This palette exudes a tranquil, modern elegance with soft grays, deep purples, and refreshing teal tones, evoking a serene coastal retreat bathed in gentle ocean breezes.
Practical uses and creative applications
The Tranquil Coastal Color Palette combines soft grays, calming teal, and gentle blues to evoke the serenity of a seaside escape. With main colors like #C8C8C8, #63566A, #238282, #AFD6D6, and #C8F0F0, this palette is ideal for designers looking to create a soothing atmosphere in branding, web design, or interiors.
The muted tones are perfect for wellness brands, coastal-themed businesses, or any creative endeavor that aims to instill a sense of peace and relaxation. Ideal for creatives and designers, the Tranquil Coastal Color Palette works beautifully in various applications.
In web design, it can enhance user experience by creating a calm, inviting interface that encourages exploration. For packaging, these colors can convey a message of sustainability and natural beauty, resonating with eco-conscious consumers.
When applied to interiors, the palette can transform spaces into serene retreats, making it a perfect choice for spas, coastal homes, or tranquil workspaces. Embrace the tranquility of the coast and let this palette inspire your next creative project!.
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.925 0.000 89.88) | #e6e6e6 | hsl(0, 0%, 90%) |
|
|
| 100 | oklch(0.907 0.000 89.88) | #e0e0e0 | hsl(0, 0%, 88%) |
|
|
| 200 | oklch(0.888 0.000 89.88) | #dadada | hsl(0, 0%, 85%) |
|
|
| 300 | oklch(0.870 0.000 89.88) | #d4d4d4 | hsl(0, 0%, 83%) |
|
|
| 400 | oklch(0.851 0.000 89.88) | #cecece | hsl(0, 0%, 81%) |
|
|
| 500 | oklch(0.833 0.000 89.88) | #c8c8c8 | hsl(0, 0%, 78%) |
|
|
| 600 | oklch(0.722 0.000 89.88) | #a5a5a5 | hsl(0, 0%, 65%) |
|
|
| 700 | oklch(0.607 0.000 89.88) | #828282 | hsl(0, 0%, 51%) |
|
|
| 800 | oklch(0.485 0.000 89.88) | #5f5f5f | hsl(0, 0%, 37%) |
|
|
| 900 | oklch(0.356 0.000 89.88) | #3c3c3c | hsl(0, 0%, 24%) |
|
|
| 950 | oklch(0.218 0.000 89.88) | #1a1a1a | hsl(0, 0%, 10%) |
|
dsfds
| 50 | oklch(0.920 0.007 312.30) | #e6e3e8 | hsl(276, 10%, 90%) |
|
|
| 100 | oklch(0.832 0.017 313.59) | #ccc5d0 | hsl(278, 10%, 79%) |
|
|
| 200 | oklch(0.746 0.026 315.44) | #b3a8b8 | hsl(281, 10%, 69%) |
|
|
| 300 | oklch(0.654 0.036 315.14) | #998aa0 | hsl(281, 10%, 58%) |
|
|
| 400 | oklch(0.563 0.043 314.98) | #7f6e87 | hsl(281, 10%, 48%) |
|
|
| 500 | oklch(0.473 0.036 313.81) | #63566a | hsl(279, 10%, 38%) |
|
|
| 600 | oklch(0.423 0.031 313.70) | #54495a | hsl(279, 10%, 32%) |
|
|
| 700 | oklch(0.375 0.026 313.55) | #463d4b | hsl(279, 10%, 27%) |
|
|
| 800 | oklch(0.321 0.021 313.32) | #37303b | hsl(278, 10%, 21%) |
|
|
| 900 | oklch(0.267 0.019 314.49) | #29232c | hsl(280, 11%, 15%) |
|
|
| 950 | oklch(0.210 0.011 311.98) | #1a171c | hsl(276, 10%, 10%) |
|
dsfds
| 50 | oklch(0.946 0.030 196.65) | #d7f4f4 | hsl(180, 57%, 90%) |
|
|
| 100 | oklch(0.888 0.064 196.05) | #a8e8e8 | hsl(180, 58%, 78%) |
|
|
| 200 | oklch(0.832 0.092 195.53) | #7adbdb | hsl(180, 57%, 67%) |
|
|
| 300 | oklch(0.784 0.113 195.10) | #4ccfcf | hsl(180, 58%, 55%) |
|
|
| 400 | oklch(0.691 0.107 194.96) | #2fb0b0 | hsl(180, 58%, 44%) |
|
|
| 500 | oklch(0.554 0.085 194.99) | #238282 | hsl(180, 58%, 32%) |
|
|
| 600 | oklch(0.498 0.076 195.00) | #1e7070 | hsl(180, 58%, 28%) |
|
|
| 700 | oklch(0.441 0.066 195.02) | #195e5e | hsl(180, 58%, 23%) |
|
|
| 800 | oklch(0.381 0.056 195.05) | #144c4c | hsl(180, 58%, 19%) |
|
|
| 900 | oklch(0.320 0.045 195.12) | #103a3a | hsl(180, 57%, 15%) |
|
|
| 950 | oklch(0.255 0.034 195.22) | #0b2828 | hsl(180, 57%, 10%) |
|
dsfds
| 50 | oklch(0.937 0.018 196.85) | #ddeeee | hsl(180, 33%, 90%) |
|
|
| 100 | oklch(0.919 0.022 196.77) | #d4e9e9 | hsl(180, 32%, 87%) |
|
|
| 200 | oklch(0.901 0.026 196.69) | #cbe4e4 | hsl(180, 32%, 85%) |
|
|
| 300 | oklch(0.882 0.031 196.61) | #c2dfdf | hsl(180, 31%, 82%) |
|
|
| 400 | oklch(0.866 0.037 196.49) | #b8dbdb | hsl(180, 33%, 79%) |
|
|
| 500 | oklch(0.848 0.041 196.40) | #afd6d6 | hsl(180, 32%, 76%) |
|
|
| 600 | oklch(0.763 0.063 195.92) | #82bfbf | hsl(180, 32%, 63%) |
|
|
| 700 | oklch(0.680 0.080 195.43) | #56a8a8 | hsl(180, 32%, 50%) |
|
|
| 800 | oklch(0.543 0.062 195.47) | #3f7b7b | hsl(180, 32%, 36%) |
|
|
| 900 | oklch(0.396 0.043 195.54) | #284e4e | hsl(180, 32%, 23%) |
|
|
| 950 | oklch(0.237 0.023 195.72) | #112222 | hsl(180, 33%, 10%) |
|
dsfds
| 50 | oklch(0.946 0.030 196.65) | #d7f4f4 | hsl(180, 57%, 90%) |
|
|
| 100 | oklch(0.942 0.032 196.62) | #d4f3f3 | hsl(180, 56%, 89%) |
|
|
| 200 | oklch(0.938 0.034 196.58) | #d1f2f2 | hsl(180, 56%, 88%) |
|
|
| 300 | oklch(0.936 0.037 196.53) | #cef2f2 | hsl(180, 58%, 88%) |
|
|
| 400 | oklch(0.931 0.039 196.50) | #cbf1f1 | hsl(180, 58%, 87%) |
|
|
| 500 | oklch(0.927 0.041 196.46) | #c8f0f0 | hsl(180, 57%, 86%) |
|
|
| 600 | oklch(0.850 0.082 195.72) | #8bdfdf | hsl(180, 57%, 71%) |
|
|
| 700 | oklch(0.785 0.112 195.12) | #4ecfcf | hsl(180, 57%, 56%) |
|
|
| 800 | oklch(0.650 0.100 194.97) | #2ca2a2 | hsl(180, 57%, 40%) |
|
|
| 900 | oklch(0.464 0.069 195.03) | #1c6565 | hsl(180, 57%, 25%) |
|
|
| 950 | oklch(0.255 0.034 195.22) | #0b2828 | hsl(180, 57%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.
