React Bits
reactbits.dev
Over 100 animated React components. Every one has a working demo and the code to copy.
COMPONENTS, ICONS, REFERENCES AND TOOLS
Everything worth reaching for, in one place.
91 sources, grouped by what you would actually come to them for. The tile opens the site. The mark beside it opens the code. Where pieces have already been pulled down, the count says how many.
/
Sources
91
sites, repositories and directories
Groups
8
sorted by what you would use them for
Pieces saved
3,854
already pulled down and readable offline
With code
62
open the repository from the tile
Nothing matches that. Clear the filter to see all 91 again.
Search results
Ranked by exact title, tags, technologies, use cases, then description.
Component libraries
Ready-made pieces of interface you can copy into your own build.
React Bits
reactbits.dev
Over 100 animated React components. Every one has a working demo and the code to copy.
pdfcn
github.com/shadcn-labs/pdfcn
Components that turn a page into a PDF. One command to set up, nothing to configure.
BeUI
beui.dev
Animated buttons, cards and menus for React. Copy the code straight off the page or install it.
Beautiful UI
beautifului.dev
Parts for AI chat screens, made with real care: the thinking state, tool calls, approval prompts.
86 saved
Watermelon UI
ui.watermelon.sh
Finished React pieces you can ship as they are: dashboards, page sections, forms.
37 saved
AI CSS
aicss.dev
More pieces for AI chat: text that streams in a word at a time, tool calls, reasoning steps.
OriginKit
originkit.dev
A big free set of animated components. Use them as code, inside Framer, or just copied out.
14 saved
Rare UI
rareui.com
Unusual animated components you will not see in every other library. Installs with one command.
CSS Snippets
cssnippets.shefali.dev
Snippets for the small stuff: buttons, shadows, cards, spinners. Plain CSS or React, your pick.
11 saved
mapcn
mapcn.dev
Drop-in map components. You get a working map without wiring up the mapping library yourself.
23rd.dev
23rd.dev
A small, opinionated set from one person who ships. Fewer choices, and that is the point.
10 saved
Interaction Kit
interactionkit.org
Components about how a thing behaves when you touch it, rather than how a page is laid out.
21st.dev
21st.dev
Over 12,000 React components, page templates and themes, posted by people who design and build for a living.
3 saved
Fancy Components
www.fancycomponents.dev
Free React components on the playful side: bouncing physics, text that reacts, odd little effects.
Motion, sound and micro-interactions
Movement and sound: how things appear, change and answer back.
Amicro
github.com/Subhan-code/Amicro--Micro-transitions-
A big collection of small movements to study or lift wholesale.
Bloub
bloub.vercel.app/#etat=thinking&stop
Animated thinking and loading shapes, drawn as vectors. The site is in French; the code is not.
54 saved
Transitions.dev
transitions.dev
The handful of transitions most apps actually need, each one ready to paste in.
Drawably
drawably-site.pages.dev
Buttons and controls that look hand-drawn, and sketch themselves afresh every time they appear.
The Micro
the-micro.vercel.app
The tiny movements that make an interface feel considered. Hover, press, settle.
Cuelume
cuelume-site.pages.dev
Click and hover sounds made in the browser rather than loaded as audio files. Tiny, and nothing to install.
NumberFlow
number-flow.barvian.me
Numbers that roll and slide when they change. Nothing extra to install, and screen readers still read it correctly.
UI SFX
uisfx.com/#sound-library
936 free interface sounds in 12 styles. Play them side by side before you choose one.
Boneyard
boneyard.vercel.app/overview
Builds the grey placeholder screen from your real page, so the loading state matches the layout exactly.
Orbs
orbs.jakubantalik.com
Glowing orb loaders for AI chat. Nine different states, light and dark.
Transition Kit
transition-kit.space
Over 30 ways to move between pages, plus light and dark toggles: fades, slides, flips, wipes.
Generative Loaders
generativeloaders.com
Loading animations made for waiting on AI: writing text, filling in a picture, thinking.
Goey Toast
goey-toast.vercel.app
Pop-up notifications that stretch and morph, and that can follow a job through to success or failure.
1 saved
404 Animations
404.colorion.co
Animated 404 pages, ready to copy. Pure CSS, no JavaScript, free to use.
3D and WebGL
3D scenes that run in a browser, with the code behind them.
Pascal Editor
github.com/pascalorg/editor
A full 3D editor for building plans. The largest real codebase on this list, and a good one to get lost in.
Stylized Components
github.com/cortiz2894/stylized-components
Anime-style 3D that renders live in the browser rather than being drawn in advance.
Bruno Simon: Folio 2025
github.com/brunosimon/folio-2025
The personal site of the man who taught most of the web Three.js. Worth reading end to end.
Jets
github.com/thebuggeddev/jets
A 3D drone flight. A good look at how to move a camera through a scene and load it without stutter.
Anatomy
github.com/thebuggeddev/anatomy
An explorable 3D human body. Shows how to load a big model and let people click parts of it.
Carfolio
github.com/thebuggeddev/carfolio
An animated showcase of famous cars. Study how it moves from one car to the next.
Vinyl
github.com/thebuggeddev/vinyl
A 3D record player. Small enough to read in one sitting.
Paper Shaders
shaders.paper.design
Ready-made moving backgrounds and light effects. Take them as React components or as the raw graphics code.
Viscose Carousel
github.com/Yousuf-developer/Viscose-carousel
Cards that fuse where they meet and stretch into threads as they pull apart.
Complete Shelf
github.com/mengto/complete-shelf
Seven hardback books you can pick up and open, and the whole thing is one file.
Liquid Glass Carousel
github.com/Yousuf-developer/liquid-glass-carousel
A carousel that slides behind a glass lens, bending whatever passes under it.
Promise Wall
github.com/thebuggeddev/promise-wall
A 3D wall of cards. A useful pattern any time you have hundreds of things to show at once.
Vantage
github.com/thebuggeddev/vantage
A 3D cinema that shows you the view from a seat before you buy the ticket.
Casebook
github.com/thebuggeddev/casebook
A detective's pin board in 3D: cards, string between them, and the camera flying to whichever you pick.
Books
github.com/thebuggeddev/books
A book collection rebuilt in 3D. Nice shelf layout and hover behaviour.
ThreeUI
threeui.com
Over 250 Three.js pieces: whole landing pages, backgrounds, buttons and text effects, many with variants to switch between. Some are free, some are paid. A coding agent can pull from it directly.
Icons, logos and illustrations
Icons, logos and drawings you can search and pull single files from.
Lucide Animated
lucide-animated.com
Over 350 icons that animate when you hover. Copy and paste, nothing to install.
SVG Logos
logos.lndev.me
15,000 company and developer-tool logos. Search, then copy or download in one click.
46 savedUnverified
Kitbitz
kitbitz.art
Over 2,000 free hand-drawn illustrations, ready as image files or as Figma kits.
23 saved
Lucide Motion (Vue)
github.com/respeak-io/lucide-motion-vue
The same animated icons for Vue, reacting to hover, tap, or simply scrolling into view.
11 savedUnverified
useAnimations
github.com/useAnimations/react-useanimations
Free animated icons, mostly switches and things that change from one state to another.
BGJar
bgjar.com
Makes background graphics: waves, blobs, grids. Adjust it on screen, then download the file.
2 saved
Dashboards, templates and starters
Whole screens and app shells rather than single pieces.
shadcn Dashboard
github.com/shadcndashboard/shadcndashboard
A complete admin dashboard, free. Charts, tables and settings pages already built.
Mappd
github.com/uxderrick/mappd
Lays every screen of your app out on one endless canvas, with lines showing how they connect.
Lavish
github.com/kunchenguid/lavish-axi
An editor for single-page HTML documents, built on the idea that HTML is the new plain text file.
Top Welcome Screens
github.com/Appllama/top-welcome-screens
Ten first-run screens rebuilt from the highest-earning iPhone apps. Built for phone apps, not the web.
DashboardStack
dashboardstack.sh/templates
Dashboard templates that come with sign-in, tables and forms already wired up.
4 saved
Flowline
github.com/Alezander9/Flowline
A boxes-and-arrows interface. Worth reading for how it decides where everything goes.
References and directories
Read before building, to name a thing or check you have not missed one.
Name That UI
namethatui.com
Describe a bit of interface badly and it tells you what it is called, which makes it searchable.
95 saved
Checklist Design
checklist.design
Checklists for pages, apps, components and flows. Run one before you call something finished.
70 saved
The Component Gallery
component.gallery/components
How different design systems build the same component. Compare before you invent your own.
Happy Hues
happyhues.co/palettes/4
Colour palettes shown on a real page, so you can see where each colour is meant to go.
10 saved
Design Minis
designminis.com
A directory of small tools made by designers, for colour, type, movement and icons.
8 saved
1 saved
CTA Gallery
www.cta.gallery
Real sign-up and buy-now sections from live sites. Useful when you know your button is wrong but not why.
Link only
Link only
Public APIs
github.com/public-apis/public-apis
The big community list of free data sources, sorted by subject. Start here when a side project needs data.
Link only
Tools and builders
Give it something and it hands back an asset, a page or a palette.
Paper
paper.design
A design tool for making interface work and getting it out as something that runs.
96 saved
Aura
aura.build
Describe a landing page and it builds one. Export it as HTML or into Figma.
24 saved
Drawesome
github.com/benjitaylor/drawesome
A drawing toolbar you can drop into a React app.
Scene AI
sceneai.art
Makes the big top section of a landing page rather than the whole thing.
16 saved
Hypergraph Plotter
phileasdg.github.io/hypergraph-plotter
Draws diagrams where one thing connects to many at once. Niche, but the drawing approach is worth reading.
11 saved
prettymaps
github.com/marceloprates/prettymaps
Turns map data into a map good enough to frame. Written in Python, not JavaScript.
Normal Tools
www.normaltools.com
193 small calculators, converters and generators. No account, nothing to install.
Link only
Link only
Link only
Agent skills and prompts
Written instructions you hand to a coding agent.
Matt Pocock: Skills
github.com/mattpocock/skills
Instructions a coding agent can follow, straight out of a well-known TypeScript teacher's own setup.
Scroll World
github.com/oso95/scroll-world
Turns a brand into a scrollable 3D landing page.
Stamp Edge
github.com/xianxie6/stamp-edge-skill
Turns any picture into a postage stamp, perforated edges and all.
Gist
gist.github.com/byteab/06d251617c670840f4889d3a032a0e7e
A single saved snippet.
1 saved
No Mistakes
github.com/kunchenguid/no-mistakes
A small safety net for git, so an agent working on your code cannot lose it.