Xoxo Split-complementary Color Scheme
Five colors arranged by the split-complementary rule around Xoxo (#F08497), each snapped to its nearest named color.
#F08497
#87F8A3
#87CDED
#E4445E
#CCFFDD
Color names and codes
| Name | HEX | RGB | HSL | CMYK | OKLCH | |
|---|---|---|---|---|---|---|
| Xoxo | #F08497 | 240, 132, 151 | 349°, 78%, 73% | 0, 45, 37, 6 | 73.6% 0.133 10 | |
| Mild Menthol | #87F8A3 | 135, 248, 163 | 135°, 89%, 75% | 46, 0, 34, 3 | 89.1% 0.157 150 | |
| Below Zero | #87CDED | 135, 205, 237 | 199°, 74%, 73% | 43, 14, 0, 7 | 81.3% 0.083 229 | |
| Paradise Pink | #E4445E | 228, 68, 94 | 350°, 75%, 58% | 0, 70, 59, 11 | 62.3% 0.196 16 | |
| Mint Zest | #CCFFDD | 204, 255, 221 | 140°, 100%, 90% | 20, 0, 13, 0 | 95.6% 0.069 156 |
Which pairs work for text
| Text on background | Contrast | WCAG |
|---|---|---|
| Aa #E4445E on #CCFFDD | 3.58:1 | AA large |
| Aa #87F8A3 on #E4445E | 3.02:1 | AA large |
| Aa #87CDED on #E4445E | 2.27:1 | — |
| Aa #F08497 on #CCFFDD | 2.24:1 | — |
| Aa #F08497 on #87F8A3 | 1.89:1 | — |
| Aa #F08497 on #E4445E | 1.60:1 | — |
CSS variables
:root {
--color-1: #f08497; /* Xoxo */
--color-2: #87f8a3; /* Mild Menthol */
--color-3: #87cded; /* Below Zero */
--color-4: #e4445e; /* Paradise Pink */
--color-5: #ccffdd; /* Mint Zest */
}Other schemes from Xoxo
- Xoxo Complementary Color Scheme#F08497#F8D7DD#88FFDD#45E9C1#DFFBF3
- Xoxo Analogous Color Scheme#CC81F0#EE88CC#F08497#EDAA86#F0DC82
- Xoxo Triadic Color Scheme#F08497#90EE90#8F99FB#F9DFE5#4EFD54
- Xoxo Tetradic Color Scheme#F08497#C6EA80#88FFDD#BB88FF#F9DFE5
- Xoxo Monochromatic Color Scheme#C41A3B#E4445E#F08497#FAC8CE#FFE9EB
More light red split-complementary color schemes
- Amour Split-complementary Color Scheme#EE5851#53FCA1#4F8FE6#DD180E#96FBC4
- Angry Flamingo Split-complementary Color Scheme#F04E45#53FCA1#4488EE#DD180E#96FBC4
- Anime Blush Split-complementary Color Scheme#FF7A83#7EFBB3#77CCFF#FF3333#CCFFDD
- Aphrodisiac Split-complementary Color Scheme#E35A63#58F898#5DADEC#D3212D#99EEBB
- Babe Split-complementary Color Scheme#DC7B7C#7BD9AD#7DABD8#D13B40#B2EED3
- Begonia Split-complementary Color Scheme#FA6E79#76FDA8#74BBFB#FF2233#B8F8D8
- Berrylicious Split-complementary Color Scheme#D75E6C#5CCD97#57A9D4#B52F3A#99E6B3
- Bite My Tongue Split-complementary Color Scheme#D47D72#78D1B1#6E99D1#BC4D39#B2E4D0
- Blood Burst Split-complementary Color Scheme#FF474C#58F898#46ADF9#F60206#96FBC4
- Blush Bomb Split-complementary Color Scheme#DD99AA#99DEAD#95CDD8#C7607B#D1F0DD
- Blush Hour Split-complementary Color Scheme#FF6F91#7BE892#76D6FF#FF2255#BDFFCA
- Boho Blush Split-complementary Color Scheme#E58787#8BE0BA#83BCE5#D3494E#D1F1DE
Questions
What colors go with Xoxo?
In a split-complementary scheme: Mild Menthol (#87F8A3), Below Zero (#87CDED), Paradise Pink (#E4445E), Mint Zest (#CCFFDD).
What is the hex code of Xoxo?
#F08497.