Themes

Beautiful defaults with full customization. Every color, font, spacing value is overridable.

Beautiful defaults

Chart.ts looks stunning out of the box. Smooth gradients, clean typography, elegant animations, accessible color palettes. You don't need to configure anything to get a professional result.

Global theme

Set a global theme object to control colors, fonts, spacing, border radius, and animation timing across all charts. Override per-chart or per-element with props and className.

Color palettes

Ships with 8 curated color palettes designed for accessibility and aesthetics. Each palette includes 12 colors that work together and meet WCAG contrast requirements against both light and dark backgrounds.

CSS custom properties

Every theme value maps to a CSS custom property. Override them in your stylesheet for complete control. Works with Tailwind's @theme directive in v4.

Related