Crayon Box Color Palette
Straight out of the crayon box: saturated primary and secondary brights — fire-engine red, tangerine, lemon, grass green, true blue, and grape. Loud, happy, and nostalgic for 90s lunchboxes and cartoon Saturdays. For kids' products, playful branding, stickers, and anything that should feel like recess.
Get Paintrix free on the App Store.
Download
Hex codes
Color theory
Base
Complement
Analogous −30°
Analogous +30°
Triadic
Use it for
Code formats
CSS
:root {
--kidcore-1: #F0432F;
--kidcore-2: #F25C29;
--kidcore-3: #F47424;
--kidcore-4: #F68B1F;
--kidcore-5: #F8A019;
--kidcore-6: #FAB514;
--kidcore-7: #FBD813;
--kidcore-8: #F2E61C;
--kidcore-9: #D8E81E;
--kidcore-10: #B6E020;
--kidcore-11: #92D822;
--kidcore-12: #6FCF24;
--kidcore-13: #3DCB52;
--kidcore-14: #2BC174;
--kidcore-15: #22B795;
--kidcore-16: #1FAEB0;
--kidcore-17: #2A9FC6;
--kidcore-18: #3A8FD6;
--kidcore-19: #3E6FE0;
--kidcore-20: #3D54DC;
--kidcore-21: #4A3FD2;
--kidcore-22: #5E36C6;
--kidcore-23: #7430B8;
--kidcore-24: #8A2BAA;
--kidcore-25: #A8299C;
--kidcore-26: #C0268C;
--kidcore-27: #D6247B;
--kidcore-28: #E62A6A;
--kidcore-29: #F03A5E;
--kidcore-30: #F25080;
}SCSS
$kidcore-1: #F0432F;
$kidcore-2: #F25C29;
$kidcore-3: #F47424;
$kidcore-4: #F68B1F;
$kidcore-5: #F8A019;
$kidcore-6: #FAB514;
$kidcore-7: #FBD813;
$kidcore-8: #F2E61C;
$kidcore-9: #D8E81E;
$kidcore-10: #B6E020;
$kidcore-11: #92D822;
$kidcore-12: #6FCF24;
$kidcore-13: #3DCB52;
$kidcore-14: #2BC174;
$kidcore-15: #22B795;
$kidcore-16: #1FAEB0;
$kidcore-17: #2A9FC6;
$kidcore-18: #3A8FD6;
$kidcore-19: #3E6FE0;
$kidcore-20: #3D54DC;
$kidcore-21: #4A3FD2;
$kidcore-22: #5E36C6;
$kidcore-23: #7430B8;
$kidcore-24: #8A2BAA;
$kidcore-25: #A8299C;
$kidcore-26: #C0268C;
$kidcore-27: #D6247B;
$kidcore-28: #E62A6A;
$kidcore-29: #F03A5E;
$kidcore-30: #F25080;Tailwind
// tailwind.config.js
module.exports = {
theme: {
extend: {
colors: {
'kidcore': {
'1': '#F0432F',
'2': '#F25C29',
'3': '#F47424',
'4': '#F68B1F',
'5': '#F8A019',
'6': '#FAB514',
'7': '#FBD813',
'8': '#F2E61C',
'9': '#D8E81E',
'10': '#B6E020',
'11': '#92D822',
'12': '#6FCF24',
'13': '#3DCB52',
'14': '#2BC174',
'15': '#22B795',
'16': '#1FAEB0',
'17': '#2A9FC6',
'18': '#3A8FD6',
'19': '#3E6FE0',
'20': '#3D54DC',
'21': '#4A3FD2',
'22': '#5E36C6',
'23': '#7430B8',
'24': '#8A2BAA',
'25': '#A8299C',
'26': '#C0268C',
'27': '#D6247B',
'28': '#E62A6A',
'29': '#F03A5E',
'30': '#F25080',
},
},
},
},
};JSON
{
"name": "Crayon Box",
"colors": [
"#F0432F",
"#F25C29",
"#F47424",
"#F68B1F",
"#F8A019",
"#FAB514",
"#FBD813",
"#F2E61C",
"#D8E81E",
"#B6E020",
"#92D822",
"#6FCF24",
"#3DCB52",
"#2BC174",
"#22B795",
"#1FAEB0",
"#2A9FC6",
"#3A8FD6",
"#3E6FE0",
"#3D54DC",
"#4A3FD2",
"#5E36C6",
"#7430B8",
"#8A2BAA",
"#A8299C",
"#C0268C",
"#D6247B",
"#E62A6A",
"#F03A5E",
"#F25080"
]
}Hex list
#F0432F
#F25C29
#F47424
#F68B1F
#F8A019
#FAB514
#FBD813
#F2E61C
#D8E81E
#B6E020
#92D822
#6FCF24
#3DCB52
#2BC174
#22B795
#1FAEB0
#2A9FC6
#3A8FD6
#3E6FE0
#3D54DC
#4A3FD2
#5E36C6
#7430B8
#8A2BAA
#A8299C
#C0268C
#D6247B
#E62A6A
#F03A5E
#F25080