Usage

The site title is a text-only component used near the logo or header. Start with:

--site-title-font-size and --site-title-font-weight for emphasis

--site-title-color for contrast against the header background

Tokens

:root {
  --site-title-font-size: var(--font-size-base);
  --site-title-color: var(--text-color-secondary);
}

:root {
  --site-title-font-weight: 700;
  --site-title-font-size: var(--font-size-xl);
}

Align with logo: Use similar visual weight between logo and title for a cohesive header.

Header contrast: Make sure --site-title-color is readable against --header-background.