Skip to content

UI component libraries

A component library is a long-term dependency, not a one-off download. The collection covers copy-paste primitives, installed packages and animated marketing kits; the criteria below separate what you own from what you rent, and what each choice costs in maintenance.

83 resources in this category

Resources

83 resources

Neat Icons website preview

A 1,104-icon set drawn on one 24px grid in Rounded and Sharp plus Line and Solid, shipped as Figma component sets, SVG files and a typed React package.

icons
Cult UI website preview

154 free, MIT-licensed animated shadcn/ui components and blocks, from a globe and kanban board to Apple device mockups, installed by copy-paste or one CLI line.

components
HextaUI website preview

65 React components, 9 hooks and 5 utilities built on Base UI and Tailwind CSS v4, added through the shadcn CLI so the source lands in your project under MIT.

components
EasyUI website preview

An open-source set of 131 micro-animated React components distributed through the shadcn GitHub registry, using spring physics and copy-paste source ownership.

components
Animata website preview

About 130 hand-crafted animated React components built with Tailwind CSS v4 — text effects, backgrounds, cards, widgets and bento grids — installed with the shadcn CLI.

components
Gauge UI website preview

Composable SVG gauge primitives for React — arcs, ticks, zones and needles — distributed as a shadcn registry for building speedometers, dials and meters.

components
Hover.dev website preview

A copy-and-paste library of animated React and Tailwind CSS components and page sections built with Motion, where every demo exposes its full source through a code toggle.

components
23rd website preview

A shadcn/ui registry of opinionated React components, from WebGL shaders and animated backgrounds to footers, 404 pages and a gooey colour picker, installed by CLI so you own the code.

components
Pele website preview

Pele renders Mermaid diagram syntax to SVG and themes the result with CSS variables instead of a theme configuration.

components

Animate UI replaces shadcn/ui primitives with animated versions built on Radix UI, Base UI and React Aria, driven by Motion.

components
Open Claude UI website preview

Open-source React and CSS library that reconstructs Claude's desktop chat interface, shipping 30 component modules plus the motion and scroll physics behind them.

components
Bluma website preview

Library of live animated UI components for the web and SwiftUI, where each entry plays in the browser and its code can be copied straight into a project.

components
Tailgrids UI website preview

React and Tailwind CSS component library with 600+ components and blocks, a CLI, prebuilt templates and a matching Figma design system.

ReactTailwindComponents+1
SakaniUI website preview

Open-source React design system of 126 components and 42 blocks exported 1:1 from Figma, with glass and liquid-glass surface themes.

components
EmailCN website preview

Open-source collection of beautifully designed, accessible email components for React Email, MJML React and JSX Email, copy-paste ready and compatible with shadcn/ui.

EmailReactReact Email+3
MicroKit UI website preview

49 free copy-paste microinteractions for React, CSS and Tailwind — animated buttons, hover effects, tabs and inputs with no package to install.

ReactTailwindCSS+3
OGImageCN website preview

A collection of beautifully designed, customizable Open Graph image components built on Satori and compatible with the shadcn/ui workflow.

Open GraphSatorishadcn/ui+2
Vengeance UI website preview

Open-source animated React components and next-gen UI interactions — displacement hovers, animated tooltips and scroll-driven cards installed via the shadcn CLI.

ReactNext.jsTailwind+3
ShaderCN website preview

Beautifully designed, accessible and customizable shader components for React — built on vgpu and TypeGPU and made to work alongside shadcn/ui.

ReactWebGPUShadcn UI+2
Appica UI website preview

A free, open-source React component library built on Base UI, styled with Tailwind, animated with Motion — 70+ polished components for humans and AI agents.

ReactTailwindDesign Systems+3
PDFCN website preview

Beautifully designed, accessible and customizable PDF components — built on Takumi and Forme and made to work with shadcn/ui.

ReactPDFShadcn UI+2
Bencho website preview

A library of interactive React UI blocks — heat maps, signature pads, drag interactions, sliders — you can explore, tweak, and take straight into projects.

ReactAnimationWeb+1
DevClub UI website preview

Open-source component library engineered for speed and visual excellence, with copy-paste components built around physical elasticity, shaders, and micro-interactions.

ComponentsShadersMicro-interactions+2
ui.devclubxnst.online
Visitopens in a new tab
RTECN website preview

Ready-to-use, customizable rich text editor components for React, built on Tiptap and distributed via shadcn so you own the code.

Rich Text EditorReactTiptap+2

How to choose

  • Ownership model

    Copy-paste libraries put the source in your repository: you can restyle any component and you carry the upgrade work yourself. Installed packages update centrally but constrain styling to their extension points. shadcn/ui popularized the first model; Radix, Base UI and MUI represent the second. Decide which trade-off fits the team before adopting either.

  • Accessibility primitives

    Check what the library builds on. Components layered over Radix UI or Base UI inherit tested focus management, keyboard interaction and ARIA behavior. Purely visual component sets often leave those details to you. Tab through a menu, open a dialog with Escape and run a screen reader before committing.

  • Maintenance and dependencies

    Read the install path and the update history: does it target your React and Tailwind versions, and did it ship fixes in the last few months? A component set tied to an abandoned styling layer becomes upgrade debt quickly, especially when Tailwind majors change utilities.

Editor’s starting points

  • shadcn/ui

    The clearest copy-paste baseline: accessible Radix primitives styled with Tailwind, with the component source living in your repo. Best when the team wants to own and retheme the UI layer — budget time for maintaining the copied code.

  • Magic UI

    Animated React sections and effects built on Tailwind and Motion. It layers visual polish on top of an existing component system rather than replacing it — a good second library for marketing pages, not the foundation for dense app UI.

  • Aceternity UI

    A free core of high-impact animated components plus paid Pro templates, aimed at launch and agency pages. Strongest where a first impression matters most; verify the license and bundle impact before using the effects throughout a product.