Kawaii — 5-color palette
#FFB3D9#FF8FAB#C5A3FF#A0E7E5#FFFA9CHex codes
Hex
#FFB3D9
RGB
255, 179, 217
HSL
330°, 100%, 85%
Hex
#FF8FAB
RGB
255, 143, 171
HSL
345°, 100%, 78%
Hex
#C5A3FF
RGB
197, 163, 255
HSL
262°, 100%, 82%
Hex
#A0E7E5
RGB
160, 231, 229
HSL
178°, 60%, 77%
Hex
#FFFA9C
RGB
255, 250, 156
HSL
57°, 100%, 81%
How to use this palette
The first color in Kawaii is the dominant tone — use it for primary surfaces and backgrounds. The middle three are the supporting palette: one warm, one cool, one neutral. The last is the accent — reserve it for highlights, calls-to-action, and emphasis.
For web projects, copy the CSS variables below. For print or illustration, use the hex codes directly. If you’re designing for accessibility, check the contrast between the text and background colors before you ship.
CSS
:root {
--kawaii-1: #FFB3D9;
--kawaii-2: #FF8FAB;
--kawaii-3: #C5A3FF;
--kawaii-4: #A0E7E5;
--kawaii-5: #FFFA9C;
}