Moccasin (CSS) Complementary Color Scheme
Five colors arranged by the complementary rule around Moccasin (CSS) (#FFE4B5), each snapped to its nearest named color.
#FFE4B5
#FFF5E4
#B1D1FC
#6495ED
#E8EEFE
Color names and codes
| Name | HEX | RGB | HSL | CMYK | OKLCH | |
|---|---|---|---|---|---|---|
| Moccasin (CSS) | #FFE4B5 | 255, 228, 181 | 38°, 100%, 85% | 0, 11, 29, 0 | 93.0% 0.068 81 | |
| Silky Tofu | #FFF5E4 | 255, 245, 228 | 38°, 100%, 95% | 0, 4, 11, 0 | 97.3% 0.025 81 | |
| Ice Cold Stare | #B1D1FC | 177, 209, 252 | 214°, 93%, 84% | 30, 17, 0, 1 | 85.2% 0.069 256 | |
| Guilliman Blue | #6495ED | 100, 149, 237 | 219°, 79%, 66% | 58, 37, 0, 7 | 67.5% 0.141 261 | |
| Brilliant White | #E8EEFE | 232, 238, 254 | 224°, 92%, 95% | 9, 6, 0, 0 | 94.9% 0.022 269 |
Which pairs work for text
| Text on background | Contrast | WCAG |
|---|---|---|
| Aa #FFF5E4 on #6495ED | 2.75:1 | — |
| Aa #6495ED on #E8EEFE | 2.56:1 | — |
| Aa #FFE4B5 on #6495ED | 2.41:1 | — |
| Aa #B1D1FC on #6495ED | 1.90:1 | — |
| Aa #FFF5E4 on #B1D1FC | 1.45:1 | — |
| Aa #B1D1FC on #E8EEFE | 1.35:1 | — |
CSS variables
:root {
--color-1: #ffe4b5; /* Moccasin (CSS) */
--color-2: #fff5e4; /* Silky Tofu */
--color-3: #b1d1fc; /* Ice Cold Stare */
--color-4: #6495ed; /* Guilliman Blue */
--color-5: #e8eefe; /* Brilliant White */
}Other schemes from Moccasin (CSS)
- Moccasin (CSS) Analogous Color Scheme#FFB7CE#FDBCB4#FFE4B5#FFFFB6#CFFDBC
- Moccasin (CSS) Triadic Color Scheme#FFE4B5#B8FFEB#E0B0FF#FFF5E4#7BFDC7
- Moccasin (CSS) Split-complementary Color Scheme#FFE4B5#B9F2FF#B8B8FF#FBCA69#E7FEFF
- Moccasin (CSS) Tetradic Color Scheme#FFE4B5#B6FFBB#B1D1FC#FFB3F0#FFF5E4
- Moccasin (CSS) Monochromatic Color Scheme#FFAA1D#FBCA69#FFE4B5#FFF5E4#FFF5E4
More very light orange complementary color schemes
- A Smell of Bakery Complementary Color Scheme#F3E9D9#F8F4ED#D8E1F1#9FB9E2#EDF2F8
- Acropolis Complementary Color Scheme#F8E2CA#FBF4E8#C6E3F7#88BBEE#EAF4FC
- Air-Kiss Complementary Color Scheme#F6DCD2#FAEFE9#D4E9F5#94D0E9#E8F5FC
- Albescent Complementary Color Scheme#E1DACB#F6F4EF#CBD1E1#99AAC8#EDF2F8
- Almond Complementary Color Scheme#EDDCC8#F8F4ED#C7DAED#95AFDC#ECF3F9
- Almond Brittle Complementary Color Scheme#E5D3B9#F8F4ED#B8CBE5#80A4CD#EDF2F8
- Alpaca Complementary Color Scheme#F9EDE2#F8F1EB#E0EBFA#A7C9EB#EAF4FC
- Ancient Scroll Complementary Color Scheme#F0E4D1#F8F4ED#D2DEF2#95AFDC#EDF2F8
- Angel Wing Complementary Color Scheme#F3DFD7#FAEFE9#D5EAF2#9DCEE3#EBF6F7
- Angelic White Complementary Color Scheme#F4EDE4#F8F4ED#E2ECF2#B0C4DE#EDF2F8
- Apricot Freeze Complementary Color Scheme#F3CFB7#FAEFE9#B8DEF2#7CB9E8#EAF4FC
- Apricot Sherbet Complementary Color Scheme#FBCD9F#FFF1E8#99CCFF#55AAFF#EAF4FC
Questions
What colors go with Moccasin (CSS)?
In a complementary scheme: Silky Tofu (#FFF5E4), Ice Cold Stare (#B1D1FC), Guilliman Blue (#6495ED), Brilliant White (#E8EEFE).
What is the hex code of Moccasin (CSS)?
#FFE4B5.