CSS

Variable configuration

All of Starlight’s CSS variables can be used to customize the theme to your liking.

The only variable override made by the theme, is that the background color of the site (the --sl-color-bg variable) has been set to #111213 and #f8f9fa for the dark and light themes respectively. Additionally, the sidebar and navigation background color variables have been styled to match the page background. Other than that, the theme uses the default Starlight CSS variables for styling the content.

Styling the Graph and Backlinks

You can find more information about configuring the graph and backlinks components in Starlight Site Graph’s CSS Configuration.

Setting reading width

The reading width can be easily adapted by setting the --sl-content-width variable.

Note

When either of the sidebars is hidden (which happens on smaller screens), the content width will always automatically expand to fill the available space, even if it exceeds the set --sl-content-width.