Convert your light mode color to a comfortable dark mode equivalent — adjusts lightness and saturation for nighttime viewing.
Sample Text
Background: #fff
Sample Text
Background: #0f172a
Strategies
- Invert lightness — flip HSL Lightness around 50% (L=80 → L=20)
- Shift lightness -30 — reduce L by 30 (lighter than invert)
- Muted — reduce saturation too, for less eye strain on dark backgrounds
FAQ
Why convert dark mode colors?
Pure inversion looks harsh. Designers usually adjust saturation and lightness to make colors comfortable on dark backgrounds.
Will this match Material/Apple guidelines?
Approximation only. For exact compliance, refer to Material Design 3 or Apple HIG dark color tokens.
Use case?
Quickly generate dark theme variants for an existing light-mode design system.
Free for commercial use?
Yes.