The colouring on this site is done with CSS Variables, so here's a quick bit of Javascript to let us play with them ^^
If you don't care to read the link, here is the TLDR: CSS variables can effect parts of a calculation or gradient. With "normal" CSS you can only change the whole property. You can use them to do all kinds of things when you build a website. Today we're using it to play!
--main
--main
is the background for the header, and most blocks/content with a solid background.
--main-accent
--main-accent
is mostly used in gradients with --main
--main-text
--main-text
is the colour of all plain text.
--secondary
The background colour for the site, header, and most body copy!
--secondary-accent
--secondary-accent
is combined with --secondary
to form the main background gradient.
--interactive
--interactive
is the colour of links, buttons, inputs, and other clickables!