Firefly Glow Complementary Color Scheme
Five colors arranged by the complementary rule around Firefly Glow (#FFF3A1), each snapped to its nearest named color.
#FFF3A1
#FFFCE4
#AAAAFF
#5566FF
#E6E8FA
Color names and codes
| Name | HEX | RGB | HSL | CMYK | |
|---|---|---|---|---|---|
| Firefly Glow | #FFF3A1 | 255, 243, 161 | 52°, 100%, 82% | 0, 5, 37, 0 | |
| Cuddly Yarn | #FFFCE4 | 255, 252, 228 | 53°, 100%, 95% | 0, 1, 11, 0 | |
| Shy Moment | #AAAAFF | 170, 170, 255 | 240°, 100%, 83% | 33, 33, 0, 0 | |
| Blue Heath Butterfly | #5566FF | 85, 102, 255 | 234°, 100%, 67% | 67, 60, 0, 0 | |
| Glitter | #E6E8FA | 230, 232, 250 | 234°, 67%, 94% | 8, 7, 0, 2 |
Which pairs work for text
| Text on background | Contrast | WCAG |
|---|---|---|
| Aa #FFFCE4 on #5566FF | 4.29:1 | AA large |
| Aa #FFF3A1 on #5566FF | 3.93:1 | AA large |
| Aa #5566FF on #E6E8FA | 3.65:1 | AA large |
| Aa #AAAAFF on #5566FF | 2.09:1 | — |
| Aa #FFFCE4 on #AAAAFF | 2.05:1 | — |
| Aa #FFF3A1 on #AAAAFF | 1.88:1 | — |
CSS variables
:root {
--color-1: #fff3a1; /* Firefly Glow */
--color-2: #fffce4; /* Cuddly Yarn */
--color-3: #aaaaff; /* Shy Moment */
--color-4: #5566ff; /* Blue Heath Butterfly */
--color-5: #e6e8fa; /* Glitter */
}Other schemes from Firefly Glow
- Firefly Glow Analogous Color Scheme#FCA2AD#FFC5A3#FFF3A1#DDFFAA#B2FBA5
- Firefly Glow Triadic Color Scheme#FFF3A1#AAFFEE#F1A7FE#FFFCE4#55FFEE
- Firefly Glow Split-complementary Color Scheme#FFF3A1#AADDFF#C9A0FF#FFEE55#E8F7FD
- Firefly Glow Tetradic Color Scheme#FFF3A1#AAFFCC#AAAAFF#FFA6D9#FFFCE4
- Firefly Glow Monochromatic Color Scheme#FEDF08#FFEE55#FFF3A1#FFFCE4#FFFCE4
More Very Light Yellow complementary palettes
- Au Clair de la Lune Complementary Color Scheme#F4F2E2#F9F7EC#E1E6F2#ACB5DC#E9EDF6
- Banan-Appeal Complementary Color Scheme#FAF3A6#FFFBE8#AAAAFF#5566EE#E6E8FA
- Banana Cream Complementary Color Scheme#FFF49C#FFFCE4#99AAFF#5566FF#E6E8FA
- Banana Milk Complementary Color Scheme#FFF7AD#FFFEE5#B5AFFF#6666FF#E6E8FA
- Banana Split Complementary Color Scheme#F7EEC8#FBF9E8#C9D1EF#8F99FB#E8EEFE
- Blanc Cassé Complementary Color Scheme#F1EEE2#F7F5ED#E1E6F2#ABB6D7#EDF2F8
- Blanco Complementary Color Scheme#EBEAE5#F6F4EF#E0E3EF#B2B7D1#EEF2F3
- Bleached Sunflower Complementary Color Scheme#FBE8A8#FFF9E7#A2BFFE#5588FF#E8EEFE
- Blond Complementary Color Scheme#FAF0BE#FFF9E7#BBCFEF#6888FC#E8EEFE
- Bollywood Gold Complementary Color Scheme#FFFBAB#FFFEE5#AAAAFF#5566FF#E6E6FA
- Bullet Hell Complementary Color Scheme#FAF1C8#FBF9E8#CCD5FF#8F99FB#E8EEFE
- Butter Honey Complementary Color Scheme#F5E5AB#FBF9E8#B8B8F8#6488EA#E8EEFE
Questions
What colors go with Firefly Glow?
In a complementary scheme: Cuddly Yarn (#FFFCE4), Shy Moment (#AAAAFF), Blue Heath Butterfly (#5566FF), Glitter (#E6E8FA).
What is the hex code of Firefly Glow?
#FFF3A1.