style

palette

Colours are based on the accent. Surfaces are ordered from lightest to darkest in light mode, and vice versa in dark mode. Inverse variants, relative to current mode, use the -inv suffix. You’ll need CSS enabled to see the following colour chart:

Text has two colour variants, with accent being a tertiary option. Variations between text1 and text2 should be visible if there are no set preferences for contrast on your device.

Each October, ff8000 is set as the accent, in line with the Merveilles tradition of donning orange avatars throughout the month.

typography

I arbitrarily oscillate between tritonic, tetratonic, and golden ratio scales. f1 is default. f0 is used for small texts such as captions, tooltips, and footers.

HTML has six headings, but I rarely need more than three: article heading in h1; section headings in h2; and, optionally, subsection headings in h3.

components

Topo tooltips are found throughout the site when you hover over some abbreviations, images, and timestamps.