NextGuide

Colors & styles

Own your documentation design

The nextguide package provides namespaced component CSS and editable starter styles. The built-in components use --ng-* variables, not the original renderer's legacy token names.

Import component stylesTypeScript (TSX)
import "nextguide/styles.css"

Override a token

:root {
  --ng-accent: #2196f3;
  --ng-radius: 0.4rem;
}

[data-theme="dark"] {
  --ng-accent: #64b5f6;
}

The Developer Mode initializer creates styles/nextguide.css (or src/styles/nextguide.css) containing the page layout, sidebar and typography. It is yours to edit and commit.

Individual interactive and layout components use ng- classes in the generated stylesheet. You can adopt your own CSS or integrate Tailwind independently; NextGuide does not force a specific design preset.

Component catalog · Typography