Skip to content
ChatJS
Esc
navigateopen⌘Jpreview
On this page

Theming

Customize colors, fonts, and styling

ChatJS uses standard shadcn theming with CSS variables. If you’re familiar with shadcn, everything works as expected.

This also applies to AI Elements components since they’re shadcn-compatible and read the same CSS variables.

Quick start

  1. Open app/globals.css
  2. Edit the CSS variables in :root (light) and .dark (dark)

Generate a theme

Use the shadcn theme generator to create a palette, then copy the CSS variables into globals.css.

Was this page helpful?