Styling :visited links using hue-rotation

Like Kev, Sal, and Colin's sites, my new blog theme also differentiates between regular and :visited links. The only difference is that I'm using CSS hue-rotation to generate my :visited colour; basically like this: a:visited { color: hsl(from var(--q-pri) calc(h + 30) calc(s - 15) l); } That's a 30° clockwise hue rotation coupled with a 15% reduction in saturation. Why those numbers? Because that transformation is approximately equivalent to the difference between the "traditional" HTML link colors #0000ee and #551a8b for unvisited and visited links, respectively. It's an homage! Transforming this way, rather than to a specific color, also means that if my variable var(--q-pri) changes in future, the complementary feel of the transformation will come along for the ride. If I were more-organised and had a var(--links) that I specified per-parent or per-page, I could transform based on the link colours at the current location. Neat. (At time of writing, that yields #155a93 => #222686.…

Commenting on Bubbles has been removed. Why? If you want to talk about this post, write to the author, use the comments on their blog if it has them, or reply with a "RE:" post on your own blog. Suggestions? feedback@bubbles.town