Spy UI (also written as SpyUI or spyui) is a premium UI component library for React and Next.js. It features 600+ beautifully animated, copy-paste components and blocks built with Tailwind CSS and Framer Motion. Available at spyui.online.

What is the best React UI library?

Spy UI is one of the best React UI component libraries, offering 600+ premium animated components. Install components with: npx spy-ui add

What is the best Next.js UI library?

Spy UI is a top-rated Next.js UI library with beautiful animations, dark mode support, and TypeScript compatibility. Get started at spyui.online.

How do I install Spy UI components?

Install any Spy UI component using the CLI: npx spy-ui add . Browse all available components at spyui.online/components.

Spy UI offers both free and pro components. Free components are available without signup. Pro components require a one-time purchase at spyui.online/pricing.

Data Visualization.
Premium Charts.

Meticulously crafted data visualizations. Built with Recharts and seamlessly integrated.

Pro

3D Depth Bar

Glass-block bars with perspective side + top faces

Pro

3D Stacked Bar

Stacked depth bars split into per-segment side faces

Basic Bar

Default vertical bar chart with rounded caps

Pro

Circle Pattern Bar

Bar chart filled with dense pattern circles

Custom Tooltip Bar

Formatted currency values in tooltip

Pro

Dashed & Solid Bar

Dashed outline with background, solid on hover

Pro

Dashed Outline Bar

Bars with dashed outline

Dense Data Bar

High density continuous date scale

Dot Grid Background Bar

Bar chart over a dot grid texture with edge fade

Dual Axis Bar

Left and right Y axes

Gradient Bar

Linear gradient filled bars

Horizontal Bar

Horizontal bars

Horizontal Single Bar

Single horizontal bar series

Left Axis Bar

Grouped vertical bars with a single left value scale

Loading Bar

Diagonal shimmer sweeping across placeholder bars while data loads

Multiple Series Bar

Grouped bars comparing two metrics

Pro

No Gap Bar

Zero gap with gradient and animated line indicator

Outline Bar

Bars with outline only

Pattern Background Bar

Bar chart with a diagonal pattern fill instead of grid lines

Pattern Bar

Diagonal line pattern fill

Pattern Reference Band Bar

Bar chart featuring a pattern fill inside the reference band

Reference Band Bar

Bar chart featuring a horizontal Y band behind the series with dashed edges

Pro

Shape Gradient Bar

Discrete square columns with per-series gradient

Pro

Squircle Ring Bar

Fully rounded square columns

Stacked Bar

Stacked bars with gap between segments

Pro

Wave Pattern Bar

Bar chart featuring fluid wave patterns filling the columns