Trim Color

Trim color can sometimes affect how a browser or OS chooses to display borders and accent colors for your site. In Brave, for example, adjusting trim color affects stylizes the location bar. Set a trim color to customize this behavior.

The default trim color is automatically set to background color of the currently selected Skin Style. Override the default in your Custom Styles by declaring the --trim-color variable inside a :root selector at the top of the file:

1:root {
2  --trim-color: firebrick;
3}

Reuse the variable to maintain consistency throughout your custom styles:

4nav a.active {
5  background-color: var(--trim-color);
6}

See Using CSS variables for help using CSS variables.