You commented REPOS. Here's everything I promised.
Four free repos. One prompt each. You paste the prompt into Claude Code, it does the build.
Before you start
Open Claude Code in your website's folder.
These work best on a React or Next.js site. On Wix or Squarespace they won't drop in.
No site yet? Paste this first:
Build me a simple one-page website with Next.js and Tailwind. A hero section with a headline, a short intro and a button. Install everything, run it, and give me the local link to open.
1. Magic UI
A library of animated components you copy straight into your site. 22.4k stars.
Repo: https://github.com/magicuidesign/magicui
Live demo: https://magicui.design
The prompt:
Use Magic UI (github.com/magicuidesign/magicui) on my site. Add the Border Beam effect around my main call-to-action button, and a Marquee of customer logos under the hero. Match my brand colours. Install what you need and show me how to run it locally.
Swap in any other component from the site. Good ones to start with: Shimmer Button, Number Ticker, Particles.
2. Cobe
The spinning globe you see on every startup site. The whole library is 5KB. 5.9k stars.
Repo: https://github.com/shuding/cobe
Live demo: https://cobe.vercel.app
The prompt:
Add the cobe globe from github.com/shuding/cobe to the hero section of my site, in my brand colours, spinning slowly behind the headline. Put a marker on London. Install what you need and show me how to run it locally.
Change London to wherever your customers are.
3. Paper Shaders
My favourite. Moving mesh gradients and textures for backgrounds, with zero dependencies. 3.5k stars.
Repo: https://github.com/paper-design/shaders
Live demo: https://shaders.paper.design
The prompt:
Install @paper-design/shaders-react (github.com/paper-design/shaders) and use the MeshGradient component as a full-screen animated background behind my hero section. Use my brand colours, keep the movement slow, and make sure the headline text stays readable. Show me how to run it locally.
Play with the settings on the demo site first, then tell Claude the colours and speed you liked. Also try LiquidMetal and GrainGradient.
4. React Bits
Animated text, backgrounds and effects. 48k stars, the biggest of the four.
Repo: https://github.com/DavidHDev/react-bits
Live demo: https://reactbits.dev
The prompt:
Add React Bits (github.com/DavidHDev/react-bits) to my site. Use the Aurora background behind my hero, and animate my headline with Split Text so it reveals word by word on load. Brand colours. Install what you need and show me how to run it locally.
Each component page on reactbits.dev has an install command. Paste that into Claude Code too if it gets stuck.
Licence note: React Bits is MIT + Commons Clause. Use it on your own site or product, commercial included. Don't resell the components as a kit. (Magic UI and Cobe are MIT, Paper Shaders is Apache 2.0. All free to use.)
One tip
Add one effect at a time. Ask Claude Code to use only the piece you need, not the whole library. Your site stays fast and you can see what changed.
If it looks wrong, tell it what you see: "the globe is too big and covers the button". It fixes it.
Build something with these? DM me on Instagram and show me. I read every one.
I send one of these a week: an AI tool, what it does, and how to use it without writing code. Subscribe and the next one lands in your inbox.
PS. Want this done for your business site? That's what we do at optimax-ai.com.