Registries
ActiveCharts/data viz2,554

@evilcharts

Charts/data viz · MIT · data updated 2026-07-08

EvilCharts is an open-source chart UI library built on shadcn/ui and Recharts. It provides handcrafted, visually styled chart components across eight types: area, line, bar, composed, radar, pie, radial, and Sankey charts. The docs site also ships UI utilities including a background component, tooltip, and legend, plus a chart-config system for consistent theming. Free and MIT licensed, distributed via the shadcn registry. Use for: adding Recharts-powered charts with opinionated, on-brand styling to a shadcn/ui project when the default shadcn chart appearance needs more visual polish without writing custom Recharts configuration from scratch.

Install

npx shadcn@latest add https://evilcharts.com/r/registry.json

Health

StatusActive
Last commit1 month ago
LicenseMIT
Open issues2
ArchivedNo
Stars2,554

Components (129)

charttooltiplegenddotevil-brushbackgroundarea-chartline-chartbar-chartcomposed-chartpie-chartradial-chartradar-chartsankey-chartex-area-chartex-gradient-colors-area-chartex-gradient-colors-bump-area-chartex-loading-state-area-chartex-default-type-area-chartex-stacked-type-area-chartex-expanded-type-area-chartex-bump-curve-type-area-chartex-step-curve-type-area-chartex-monotoney-curve-type-area-chartex-solid-stroke-area-chartex-dashed-stroke-area-chartex-animated-dashed-stroke-area-chartex-gradient-area-variant-area-chartex-gradient-reverse-area-variant-area-chartex-solid-area-variant-area-chartex-dotted-area-variant-area-chartex-lines-area-variant-area-chartex-hatched-area-variant-area-chartex-line-chartex-gradient-colors-line-chartex-gradient-colors-bump-line-chartex-loading-state-line-chartex-bump-curve-type-line-chartex-step-curve-type-line-chartex-monotoney-curve-type-line-chartex-solid-stroke-line-chartex-dashed-stroke-line-chartex-animated-dashed-stroke-line-chartex-glowing-desktop-line-chartex-glowing-mobile-line-chartex-buffer-line-chartex-bg-dots-line-chartex-bg-grid-line-chartex-bg-cross-hatch-line-chartex-bg-diagonal-lines-line-chartex-bg-plus-line-chartex-bg-falling-triangles-line-chartex-bg-4-pointed-star-line-chartex-bg-tiny-checkers-line-chartex-bg-overlapping-circles-line-chartex-bg-wiggle-lines-line-chartex-bg-bubbles-line-chartex-buffer-bar-chartex-bar-chartex-gradient-colors-bar-chart
Components: chart, tooltip, legend, dot, evil-brush, background, area-chart, line-chart, bar-chart, composed-chart, pie-chart, radial-chart, radar-chart, sankey-chart, ex-area-chart, ex-gradient-colors-area-chart, ex-gradient-colors-bump-area-chart, ex-loading-state-area-chart, ex-default-type-area-chart, ex-stacked-type-area-chart, ex-expanded-type-area-chart, ex-bump-curve-type-area-chart, ex-step-curve-type-area-chart, ex-monotoney-curve-type-area-chart, ex-solid-stroke-area-chart, ex-dashed-stroke-area-chart, ex-animated-dashed-stroke-area-chart, ex-gradient-area-variant-area-chart, ex-gradient-reverse-area-variant-area-chart, ex-solid-area-variant-area-chart, ex-dotted-area-variant-area-chart, ex-lines-area-variant-area-chart, ex-hatched-area-variant-area-chart, ex-line-chart, ex-gradient-colors-line-chart, ex-gradient-colors-bump-line-chart, ex-loading-state-line-chart, ex-bump-curve-type-line-chart, ex-step-curve-type-line-chart, ex-monotoney-curve-type-line-chart, ex-solid-stroke-line-chart, ex-dashed-stroke-line-chart, ex-animated-dashed-stroke-line-chart, ex-glowing-desktop-line-chart, ex-glowing-mobile-line-chart, ex-buffer-line-chart, ex-bg-dots-line-chart, ex-bg-grid-line-chart, ex-bg-cross-hatch-line-chart, ex-bg-diagonal-lines-line-chart, ex-bg-plus-line-chart, ex-bg-falling-triangles-line-chart, ex-bg-4-pointed-star-line-chart, ex-bg-tiny-checkers-line-chart, ex-bg-overlapping-circles-line-chart, ex-bg-wiggle-lines-line-chart, ex-bg-bubbles-line-chart, ex-buffer-bar-chart, ex-bar-chart, ex-gradient-colors-bar-chart, ex-loading-state-bar-chart, ex-default-variant-bar-chart, ex-hatched-variant-bar-chart, ex-duotone-variant-bar-chart, ex-duotone-reverse-variant-bar-chart, ex-gradient-variant-bar-chart, ex-stripped-variant-bar-chart, ex-stacked-type-bar-chart, ex-percent-type-bar-chart, ex-horizontal-layout-bar-chart, ex-hover-highlight-bar-chart, ex-glowing-desktop-bar-chart, ex-glowing-mobile-bar-chart, ex-composed-chart, ex-gradient-colors-composed-chart, ex-loading-state-composed-chart, ex-hatched-variant-composed-chart, ex-duotone-variant-composed-chart, ex-gradient-variant-composed-chart, ex-stripped-variant-composed-chart, ex-dashed-stroke-composed-chart, ex-animated-dashed-stroke-composed-chart, ex-bump-curve-composed-chart, ex-dots-composed-chart, ex-hover-highlight-composed-chart, ex-glowing-composed-chart, ex-pie-chart, ex-gradient-colors-pie-chart, ex-donut-pie-chart, ex-padded-pie-chart, ex-overlapping-padded-pie-chart, ex-labels-pie-chart, ex-loading-state-pie-chart, ex-glowing-pie-chart, ex-radial-chart, ex-semi-variant-radial-chart, ex-gradient-colors-radial-chart, ex-loading-state-radial-chart, ex-glowing-radial-chart, ex-radar-chart

Preview

Live sandbox previews render component source client-side. Where a component can’t be rendered standalone, sh4dcn falls back to its source and install command.

@evilcharts · chart

npx shadcn@latest add https://evilcharts.com/r/chart.json
View source