18.04.2026 – Pavel Klavík, Kamila Klavíková

We have recently added Dark Mode into OrgPad, and it was much bigger task we originally anticipated. In this blog post, we discuss our experience and the problems we had to solve along the way. We discuss color spaces and design decisions behind OrgPad's new Dark Mode palette. We show how we manage color themes in ClojureScript and use color palettes in CSS. And we deal with inverting colors in MathJax math formulas, both in CSS and 2D canvas.

#development, #webdev, #OrgPad, #CSS, #tech, #dark mode, #2D canvas

Color spaces

RGB color space

HSL color space

Converting between HSL and RGB

okLCH color space

Converting between okLCH and RGB

OrgPad's color palette

Design philosophy behind dark mode

Warm background instead of cold gray

Foreground elements are lighter on purpose

A lighter dark mode overall

Accessibility of colors

WCAG 2

APCA

Color deficiencies

Beware of too much contrast

Applying color standards in OrgPad's palette

Dark mode colors in CSS

Adding color theme to settings

Updating the current color scheme

Light and dark mode palettes in CSS

Generating CSS with Garden

Inverting colors in math and chemistry

Inverting colors in CSS

Inverting colors in 2D canvas

Inverting other images