# 12 Modern UI Component Libraries

> Curated directory of modern UI component libraries and micro-interaction resources.

A curated list of twelve modern component libraries, design galleries, and animation toolkits for front-end developers. It highlights specialized resources ranging from pattern archives to ready-to-copy animated interactive components.

## The list

1. collectui.com — hand-curated gallery of the best UI details on the web, \#1 for pattern recognition.
2. cuedesign.space — best-in-class components; picks up where CollectUI stops.
3. ui.aceternity.com — components that look expensive.
4. watermelon.sh — modern, minimal, fast.
5. 21st.dev — huge community library.
6. shadcnstudio.com — 800+ shadcn blocks.
7. reactbits.dev — clean animated React bits.
8. motion-primitives.com — motion done right.
9. fancycomponents.dev — the fun, weird ones.
10. pro.ui-layouts.com — full layouts, not just pieces.
11. number-flow.barvian.me — animated numbers.
12. component.gallery — patterns from 95 design systems.

## What it is for

- Find copy-paste interactive UI components for web applications
- Source complex micro-interaction patterns and animations
- Research UI design system patterns across established products

## Key points

- Directory of 12 modern UI galleries, component collections, and interaction tools
- Includes specialized motion and interaction libraries like Motion Primitives and Number Flow
- Features copy-paste resources for Tailwind and shadcn-compatible ecosystems
- Covers design pattern galleries indexing production design systems

## Pricing

Free

## Details

- Type: List
- Category: [Development](https://xiry.app/topics/development.md)
- Topic: [UI Components](https://xiry.app/topics/development/ui-components.md)
- Platforms: Web
- For: Front-end developers and UI/UX designers
- Tags: ui, components, frontend, react, microinteractions, design

## Why it was saved

- [@Alok619308, 28 August 2026](https://x.com/Alok619308/status/2093373247576486077): Copy-paste-ready sources for polished, animated UI components.

## Related

- [shadcn/ui](https://xiry.app/resources/shadcn-ui-1902): Copy-paste React UI components built with Tailwind CSS and Radix primitives. (Website, Open source)
- [Efferd](https://xiry.app/resources/efferd): Pre-built, responsive shadcn/ui blocks and layouts for React applications (Web app, Freemium)
- [Motion](https://xiry.app/resources/motion): Open-source animation library for React, Vue, and vanilla JavaScript (Website, Freemium)
- [React Bits](https://xiry.app/resources/react-bits): Open-source animated and interactive React UI components and backgrounds (Website, Freemium)
- [21st.dev](https://xiry.app/resources/21st-dev): Curated directory of crafted React, Tailwind, and shadcn UI components. (Website, Freemium)
- [lucide-animated](https://xiry.app/resources/lucide-animated): Open-source animated React icons built with Lucide and Motion (Web app, Open source)

Updated 11 October 2026. Page: https://xiry.app/resources/12-modern-ui-component-libraries

Make your own library: Xiry takes your saved reels, tweets, Reddit bookmarks and Watch Later videos, makes them searchable and pulls the useful stuff out, like this library. It's invite-only for now; join the waitlist at https://xiry.app/#waitlist.