Mangrove Split-complementary Color Scheme
Five colors arranged by the split-complementary rule around Mangrove (#757461), each snapped to its nearest named color.
#757461
#4F6F85
#6A5287
#555337
#7595AB
Color names and codes
| Name | HEX | RGB | HSL | CMYK | OKLCH | |
|---|---|---|---|---|---|---|
| Mangrove | #757461 | 117, 116, 97 | 57°, 9%, 42% | 0, 1, 17, 54 | 55.4% 0.028 105 | |
| Shipyard | #4F6F85 | 79, 111, 133 | 204°, 25%, 42% | 41, 17, 0, 48 | 52.6% 0.051 239 | |
| Zimidar | #6A5287 | 106, 82, 135 | 267°, 24%, 43% | 21, 39, 0, 47 | 48.5% 0.087 304 | |
| Avocado Pear | #555337 | 85, 83, 55 | 56°, 21%, 27% | 0, 2, 35, 67 | 43.6% 0.043 105 | |
| American Anthem | #7595AB | 117, 149, 171 | 204°, 24%, 56% | 32, 13, 0, 33 | 65.4% 0.049 239 |
Which pairs work for text
| Text on background | Contrast | WCAG |
|---|---|---|
| Aa #555337 on #7595AB | 2.48:1 | — |
| Aa #6A5287 on #7595AB | 2.10:1 | — |
| Aa #4F6F85 on #7595AB | 1.68:1 | — |
| Aa #757461 on #555337 | 1.65:1 | — |
| Aa #757461 on #7595AB | 1.50:1 | — |
| Aa #4F6F85 on #555337 | 1.47:1 | — |
CSS variables
:root {
--color-1: #757461; /* Mangrove */
--color-2: #4f6f85; /* Shipyard */
--color-3: #6a5287; /* Zimidar */
--color-4: #555337; /* Avocado Pear */
--color-5: #7595ab; /* American Anthem */
}Other schemes from Mangrove
- Mangrove Complementary Color Scheme#757461#B3B17B#4D5588#333355#888CBA
- Mangrove Analogous Color Scheme#875251#836953#757461#708452#598556
- Mangrove Triadic Color Scheme#757461#4D8681#804B81#BBB286#365955
- Mangrove Tetradic Color Scheme#757461#52896B#4D5588#875169#BBB286
- Mangrove Monochromatic Color Scheme#21211D#4D483D#757461#9E9B88#BEBFB2
More medium gray split-complementary color schemes
- Abandoned Spaceship Split-complementary Color Scheme#747A8A#9F715F#8C9E5E#445172#B5998E
- Acoustic Brown Split-complementary Color Scheme#766B69#588A79#5A6A8C#5B3D34#7DB39E
- Alley Cat Split-complementary Color Scheme#656874#886150#728A51#343E54#AE8A78
- Aloe Tip Split-complementary Color Scheme#8A9480#6C70A9#A66DA1#647F4A#9D9AC4
- Aluminium Split-complementary Color Scheme#848789#A36A6D#A69D64#476476#C4989E
- Amorous Split-complementary Color Scheme#967D96#8AA56E#70A38D#7F4F78#B3C39C
- Anchovy Split-complementary Color Scheme#756F6B#538B89#565B8D#594537#79AFAD
- Archaeology Split-complementary Color Scheme#6E6A5E#506E82#5C5083#534931#719DA8
- Argent Split-complementary Color Scheme#888888#70A38D#6A8AA4#784848#9BC2B4
- Armour Split-complementary Color Scheme#74857F#9D5A8F#9C675F#416858#B98FAF
- Armoury Split-complementary Color Scheme#6A6B65#4C5E87#764F82#515131#7886AA
- Ashen Whisper Split-complementary Color Scheme#646B7A#8B5E52#868B53#3A405A#B18377
Questions
What colors go with Mangrove?
In a split-complementary scheme: Shipyard (#4F6F85), Zimidar (#6A5287), Avocado Pear (#555337), American Anthem (#7595AB).
What is the hex code of Mangrove?
#757461.