# Sites I Take Inspiration From

- Author: Yuehan John
- Published: 2026-09-26
- Reading time: 4 min
- Tags: UI/UX, Design, Animations, Resources
- Canonical page: https://yuehanjohn.com/blog/sites-i-take-inspiration-from

> TL;DR: My bookmarked sources of UI inspiration, grouped by what I use them for: component libraries, animation, icons and loaders, color, and design galleries.

Most good interfaces start with someone else's good idea. This is the list of sites I keep coming back to when I'm designing or building something: some I copy components from, some I study for motion, and some I just scroll through when I'm stuck.

I'll keep adding to it.

## Animated Component Libraries

The copy-paste kind. Great for motion-heavy landing pages and for seeing how other people solve interaction details.

- [Aceternity UI](https://ui.aceternity.com/) — flashy, animated Tailwind + Framer Motion components
- [React Bits](https://www.reactbits.dev/) — animated text, backgrounds, and interactive components for React
- [Vue Bits](https://vue-bits.dev/) — the same idea for Vue
- [Magic UI](https://magicui.design/docs/components/marquee) — polished animated components; the marquee is a favorite
- [Motion Primitives](https://motion-primitives.com/) — small, composable motion building blocks
- [Animata](https://animata.design/) — animation-first components (see the [AI button](https://animata.design/docs/button/ai-button))
- [Hover.dev](https://www.hover.dev/components) — animated Tailwind components with a lot of personality
- [Skiper UI](https://skiper-ui.com/v1/skiper2) — experimental, well-crafted interactive components
- [Lukacho UI](https://ui.lukacho.com/components) — clean animated components (the [accordion](https://ui.lukacho.com/components/accordion) is a good example)
- [Canvas UI](https://canvasui.dev/components)
- [Beautiful UI](https://www.beautifului.dev/)
- [Transitions.dev](https://transitions.dev/)

## Component Libraries & UI Kits

The more structured, production-ready side.

- [Origin UI](https://originui.com/) — a huge collection of well-made Tailwind components
- [NextUI](https://nextui.org/) — a full React component library with good defaults
- [Flowbite](https://flowbite.com/docs/components/dropdowns/) — Tailwind components for every standard UI pattern
- [daisyUI](https://daisyui.com/components/timeline/) — Tailwind plugin with semantic component classes
- [Float UI](https://floatui.com/) — simple Tailwind sections and components
- [Uiverse](https://uiverse.io/) — community-made buttons, loaders, toggles, and cards in pure HTML/CSS
- [FreeFrontend — CSS Buttons](https://freefrontend.com/css-buttons/) — a massive index of CSS button experiments
- [Microkit](http://microkit.co/)
- [Awesome Next.js](https://github.com/officialrajdeepsingh/awesome-nextjs#react-ui-library) — a curated list of React UI libraries and Next.js resources

## Animation Libraries

When a component library isn't enough and I need to build the motion myself.

- [GSAP](https://gsap.com/) — the standard for serious web animation
- [GreenSock on CodePen](https://codepen.io/GreenSock) — hundreds of GSAP demos to learn from
- [Anime.js](https://animejs.com/) — lightweight, flexible JavaScript animation
- [Vivus](https://github.com/maxwellito/vivus?tab=readme-ov-file#vivusjs) — makes SVGs look like they're being drawn
- [Unicorn Studio](https://www.unicorn.studio/dashboard/community) — no-code WebGL effects; the community gallery is full of ideas
- [Olivier Larose's tutorials](https://blog.olivierlarose.com/tutorials/3d-earth) — step-by-step breakdowns of award-style effects, like this 3D earth

## Icons & Loaders

- [React Icons](https://react-icons.github.io/react-icons/) — every popular icon set in one package
- [UI Ball](https://uiball.com/) — tasteful, lightweight loaders

## Color

- [Material Design — The Color System](https://m2.material.io/design/color/the-color-system.html#tools-for-picking-colors) — still one of the clearest explanations of building a color palette, plus tools for picking one

## Design Galleries

Where I go when I don't know what I want yet.

- [Awwwards — Following Wildfire](https://www.awwwards.com/sites/following-wildfire) — a reminder of how far storytelling on the web can go
- [One World One Dollar](https://oneworldonedollar.com/)
- [Inspora](https://www.inspora.design/) — curated design inspiration
- [Best Designs on X](https://bestdesignsonx.com/) — the best design work posted on X, in one place
- [Bencho](https://bencho.dev/#bench)

---

Got a site that should be on this list? Send it my way.