open-props/src/extra/brand.css

<div align="center">

:where(html) {
  /* --brand: your-brand-color-here; */
  
  scrollbar-color: var(--scrollthumb-color) transparent;
  accent-color: var(--brand, var(--link));
  caret-color: var(--brand, var(--link));
  color: var(--text-2);
  background-color: var(--surface-1);
}

:where(h1, h2, h3, h4, h5, h6, dt) { 
  color: var(--text-1);
}

:where(a[href]) {
  color: var(--brand, var(--link));
  
  &:visited {
    color: var(--link-visited);
  }
}

:focus-visible { 
  outline-color: var(--brand, var(--link)); 
}