back to palettes
Color lane

Nightlight

Three highlighter-bright glow hues on a warm plum-charcoal night ground; colour reads as emitted light, so the live object is always the brightest thing in the room.

Signature · the star
primary accentCoral · #ff6b8a
Mint · #3fe0b0
Violet · #8e86ff
Neutrals · the ground
bg
#18121f
surface
#221a2c
text
#f4ecfb
muted
#b6a8c9
border
#33283f
Semantic · functional accessory
success
warning
error
info
Ramps
neutral
Download .cssdark-warmglowhighlighter-accentscoral-mint-violetnightlight
Do
  • · use the three hues only as emitted glow on the dark ground
  • · keep one hue glowing brightest to mark the live element
  • · tune neutrals warm so the dark never reads cold
Don't
  • · use the hues as flat fills on a light surface
  • · let semantic colours (warning/error) dominate the screen
  • · place the palette on a white or pale ground
try it

remix with this palette

Drop Nightlight onto any UI language and swap the art style — the preview recolors live.

UI language
Palette · fixed
Nightlight
Art style
Landing Page
live preview · recolored + filled