Moody Ocean Color Palette
This palette exudes a moody, sophisticated vibe with deep oceanic blues and greens, accented by a vibrant teal and warm sandy beige, creating a stylish balance between tranquility and elegance.
Practical uses and creative applications
The Moody Ocean Color Palette encapsulates the serene yet powerful essence of the sea, featuring deep shades of navy and teal complemented by warm earthy tones. This palette, dominated by #000706, #00272d, and #134647, is perfect for branding projects that aim to evoke a sense of tranquility and sophistication.
Ideal for web design, the colors can create visually striking backgrounds and elements, ensuring an engaging user experience while conveying reliability and depth. Designers and creatives looking to infuse their projects with an aquatic vibe will find the Moody Ocean palette particularly appealing.
It suits businesses in wellness, eco-friendly products, or lifestyle brands that prioritize a connection to nature. Additionally, its versatile tones can enhance packaging designs, making them stand out on shelves with a contemporary yet inviting feel.
Whether you're crafting an interior space or designing a digital platform, the calming yet dynamic color scheme fosters a mood that resonates with audiences seeking both style and substance.
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.963 0.052 186.07) | #ccfff8 | hsl(172, 100%, 90%) |
|
|
100 | oklch(0.917 0.126 182.79) | #72ffeb | hsl(171, 100%, 72%) |
|
|
200 | oklch(0.896 0.162 178.62) | #17ffde | hsl(171, 100%, 55%) |
|
|
300 | oklch(0.711 0.131 177.46) | #00bca1 | hsl(171, 100%, 37%) |
|
|
400 | oklch(0.441 0.081 178.36) | #006153 | hsl(171, 100%, 19%) |
|
|
500 | oklch(0.116 0.020 186.38) | #000706 | hsl(171, 100%, 1%) |
|
|
600 | oklch(0.156 0.027 185.80) | #00100e | hsl(173, 100%, 3%) |
|
|
700 | oklch(0.191 0.034 181.23) | #001915 | hsl(170, 100%, 5%) |
|
|
800 | oklch(0.223 0.040 183.42) | #00211d | hsl(173, 100%, 6%) |
|
|
900 | oklch(0.255 0.046 180.66) | #002a24 | hsl(171, 100%, 8%) |
|
|
950 | oklch(0.288 0.052 180.59) | #00332c | hsl(172, 100%, 10%) |
|
dsfds
50 | oklch(0.951 0.046 208.22) | #ccf8ff | hsl(188, 100%, 90%) |
|
|
100 | oklch(0.885 0.108 208.73) | #79edff | hsl(188, 100%, 74%) |
|
|
200 | oklch(0.840 0.141 211.66) | #26e2ff | hsl(188, 100%, 57%) |
|
|
300 | oklch(0.717 0.126 213.77) | #00b7d3 | hsl(188, 100%, 41%) |
|
|
400 | oklch(0.498 0.087 213.00) | #006f80 | hsl(188, 100%, 25%) |
|
|
500 | oklch(0.250 0.043 210.09) | #00272d | hsl(188, 100%, 9%) |
|
|
600 | oklch(0.254 0.044 209.82) | #00282e | hsl(188, 100%, 9%) |
|
|
700 | oklch(0.257 0.044 209.55) | #00292f | hsl(188, 100%, 9%) |
|
|
800 | oklch(0.262 0.045 211.60) | #002a31 | hsl(189, 100%, 10%) |
|
|
900 | oklch(0.265 0.046 211.32) | #002b32 | hsl(188, 100%, 10%) |
|
|
950 | oklch(0.269 0.047 211.05) | #002c33 | hsl(188, 100%, 10%) |
|
dsfds
50 | oklch(0.946 0.030 196.65) | #d7f4f4 | hsl(180, 57%, 90%) |
|
|
100 | oklch(0.870 0.070 198.21) | #9de3e5 | hsl(182, 58%, 76%) |
|
|
200 | oklch(0.802 0.103 196.88) | #62d3d5 | hsl(181, 58%, 61%) |
|
|
300 | oklch(0.718 0.111 196.47) | #32b9bb | hsl(181, 58%, 46%) |
|
|
400 | oklch(0.546 0.083 197.16) | #237f81 | hsl(181, 57%, 32%) |
|
|
500 | oklch(0.362 0.053 196.96) | #134647 | hsl(181, 58%, 18%) |
|
|
600 | oklch(0.341 0.049 197.12) | #114041 | hsl(181, 59%, 16%) |
|
|
700 | oklch(0.320 0.045 197.37) | #103a3b | hsl(181, 57%, 15%) |
|
|
800 | oklch(0.299 0.042 197.61) | #0e3435 | hsl(182, 58%, 13%) |
|
|
900 | oklch(0.277 0.039 195.15) | #0c2e2e | hsl(180, 59%, 11%) |
|
|
950 | oklch(0.255 0.034 195.22) | #0b2828 | hsl(180, 57%, 10%) |
|
dsfds
50 | oklch(0.958 0.044 196.44) | #d0fbfb | hsl(180, 84%, 90%) |
|
|
100 | oklch(0.911 0.090 195.68) | #96f5f5 | hsl(180, 83%, 77%) |
|
|
200 | oklch(0.874 0.124 195.12) | #5befef | hsl(180, 82%, 65%) |
|
|
300 | oklch(0.850 0.141 194.82) | #21eaea | hsl(180, 83%, 52%) |
|
|
400 | oklch(0.712 0.119 194.81) | #12b9b9 | hsl(180, 82%, 40%) |
|
|
500 | oklch(0.538 0.090 194.82) | #0c7e7e | hsl(180, 83%, 27%) |
|
|
600 | oklch(0.488 0.081 194.83) | #0a6e6e | hsl(180, 83%, 24%) |
|
|
700 | oklch(0.438 0.072 194.84) | #095e5e | hsl(180, 83%, 20%) |
|
|
800 | oklch(0.385 0.063 194.85) | #074e4e | hsl(180, 84%, 17%) |
|
|
900 | oklch(0.331 0.053 194.88) | #063e3e | hsl(180, 82%, 13%) |
|
|
950 | oklch(0.278 0.045 194.89) | #042f2f | hsl(180, 84%, 10%) |
|
dsfds
50 | oklch(0.930 0.014 78.26) | #ede7de | hsl(36, 29%, 90%) |
|
|
100 | oklch(0.897 0.021 81.78) | #e4dcce | hsl(38, 29%, 85%) |
|
|
200 | oklch(0.861 0.028 81.46) | #dbd0bd | hsl(38, 29%, 80%) |
|
|
300 | oklch(0.825 0.036 82.89) | #d1c4ac | hsl(39, 29%, 75%) |
|
|
400 | oklch(0.789 0.042 81.66) | #c8b89c | hsl(38, 29%, 70%) |
|
|
500 | oklch(0.752 0.050 81.38) | #bfac8b | hsl(38, 29%, 65%) |
|
|
600 | oklch(0.672 0.066 80.75) | #ab9267 | hsl(38, 29%, 54%) |
|
|
700 | oklch(0.578 0.063 80.81) | #8d764e | hsl(38, 29%, 43%) |
|
|
800 | oklch(0.469 0.050 81.22) | #69583a | hsl(38, 29%, 32%) |
|
|
900 | oklch(0.354 0.036 82.02) | #453a26 | hsl(39, 29%, 21%) |
|
|
950 | oklch(0.226 0.019 77.63) | #211b12 | hsl(36, 29%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.