Caspian Theme for JavaFX

In 2009 we added UI Controls to JavaFX, for those controls we needed a theme. I set out to create a new theme from scratch that could work on many operating systems and devices; from Windows, Mac and Solaris on Desktops, to Mobile, Tablet, and TVs. Along with the theme, I designed a whole system for styling UI controls with CSS. One of the big use-cases I had learned from my experience as an app developer and working on Swing was that people will want to tweak the theme to match customers branding. So I set out to design a theme from scratch that could adapt to any color palette by setting a single color. This required working out how to make lighter and darker colors that looked consistently lighter or darker independently to if they were applied to yellow or blue. This turned into a deep dive into understanding color theory and how the human eye perceives color. It turns out you have to make twice as big a brightness adjustment to yellows as you would for blues to perceive the same brightness shift. I built equations to do those color shifts and built it into a single simple CSS function called derive() that took a color and a +/- percentage and returned a new color with that brightness shift. We extended the web CSS spec to add variables and named colors, much like Less and Sass did many years later for the web.

Caspian Design Document

StarOffice using Caspian

One of the applications we used as a test case for how Caspian would look in a complex application was StarOffice.