Stylesheet generrrat'r

Arrr! Pirrrates

Fello' pirrrates, wrrrit'n are not fer us as yer can see! Also be awarrre some stuff may not work in this trrranslat'n. Like see'n Merrrmaids, do'n math or chemistrrry and stuff.

This interactive tool may help ye t' generate yer own color variant stylesheet.

T' get started, first select a color variant from th' variant switch that fits ye best as a start'n point.

Th' graph be interactive an' reflect th' current colors. Ye can click on any o' th' colored boxes t' adjust th' respective color. Th' graph an' th' plank will update accordingly.

Th' arrowed lines reflects how colors be inherited thru different parts o' th' theme if th' descendent isn’t overwritten. If ye want t' delete a color an' let it inherit from its parent, just delete th' value from th' input field.

T' better understand this select th' neon variant an' modify th' different head'n colors. There, colors fer th' head'n h2, h3 an' h4 be explicitly set. h5 be not set an' inherits its value from h4. h6 be also not set an' inherits its value from h5.

Once you’ve changed a color, th' variant switch will show a “My custom variant” entry an' yer changes be stored 'n th' browser. Ye can change planks an' even close th' browser without los'n yer changes.

Once ye be satisfied, ye can download th' new variants file an' copy it into yer site’s static/css directory. Afterwards ye have t' adjust th' themeVariant parameter 'n yer config.toml t' yer chosen file name.

Eg. if yer new variants file be named theme-my-custom-variant.css, ye have t' set themeVariant='my-custom-variant' t' use it.

Avast

This only works 'n modern browsers.

Variant generator

Graph