11 Mar 2020

Use Prince's purple for a:visited in your CSS

Evert Pot wrote an article about using a:visited in your stylesheets.

In a nutshell, most people change the styling of their links and that disables a:visited. Purple is the default colour for the selector but that might not always work for your layout. It works for me though. The only issue is I don’t like that purple. So I looked for the Pantone colour created in honour of Prince when he passed away in 2016 and I now use that on my main site.

The shade I use is #9663C4 but from the official Pantone PQ-7448C page, it’s #4B384C.

Copy the below code to add it to your stylesheets.

My Prince purple version

a:visited {
    color: #9663C4;
}

// The Pantone PQ-7448C version

a:visited {
    color: #4B384C;
}

// Or the CSS custom variables option

:root {
    --princepurple: #9663C4;
}

a:visited {
    color: var(--princepurple);
}