Primary
rgb(255, 253, 240)
Education
Kids Learning Color Palette
Friendly color blocks for playful learning tools. Re-select individual colors or adjust brightness, saturation, and warmth across the palette.
Secondary
rgb(255, 209, 102)
Accent
rgb(5, 214, 158)
Deep
rgb(16, 137, 177)
Light
rgb(7, 58, 75)
Adjust palette
Tune the full palette while keeping individual color choices editable.
Export for design and code
Download a palette image or copy CSS generated from the current adjusted colors.
Palette PNG Preview
#FFFDF0#FFD166#05D69E#1089B1#073A4B
Linear Gradient Preview
Preview of the gradient background generated from this palette.
Kids Learning CSS
/* CSS */
.color-1 {
color: #FFFDF0;
}
.color-2 {
color: #FFD166;
}
.color-3 {
color: #05D69E;
}
.color-4 {
color: #1089B1;
}
.color-5 {
color: #073A4B;
}
/* CSS Variables */
:root {
--color-1: #FFFDF0;
--color-2: #FFD166;
--color-3: #05D69E;
--color-4: #1089B1;
--color-5: #073A4B;
}Kids Learning Linear Gradient CSS
/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #FFFDF0, #FFD166, #05D69E, #1089B1, #073A4B);
}