Currently High on Creativity
Build beautifulUI with Devsloka.
Devsloka UI is a React component library for landing pages that feel alive. 79+ production-ready components, blocks and backgrounds, built with React, Tailwind CSS and Motion. Copy, paste, make it yours and ship fast, with the animation and styling already done.
Move your cursor · click to spin
Built on shadcn conventions, so everything drops straight into your components/ui and is yours to change.
Devsloka
Interfaces that move
Receipt
#4471Ready
Order ready
Vietnamese Coffee · Cinnamon Roll
Tap print to issue the receipt
Devsloka UI
Current time
Ship list for today
DEVSLOKADiscover
Browse 90+ animated components, blocks and backgrounds.
Made by devsloka.in
Get started- React 19
- Next.js
- Tailwind v4
- Motion
- Radix
- TypeScript
One command. Any component.
Install with the shadcn CLI and the source lands in components/ui, typed and ready to change. Or copy it by hand.
$
npx shadcn@latest add https://ui.devsloka.in/r/morphing-nav.jsonEverything in the library, in one list.
Hover a name to preview it, open it for the code. Each entry installs with the shadcn CLI.
- 001Morphing NavInteractionfree
- 002Morphing CardInteractionfree
- 003Morphing ModalInteractionfree
- 004Tabs SwitcherInteractionfree
- 005Text EffectInteractionfree
- 006Product TourInteractionfree
- 007Expanding CardsInteractionfree
- 008Content CarouselInteractionfree
- 009Image GalleryInteractionfree
- 010Logo Cloud CarouselInteractionfree
- 011Laptop Closes On ScrollInteractionfree
- 012Animated SmartwatchInteractionfree
Props you can feel.
Every component is built to be tuned. Change the props and the code follows.
Interfaces that feelcalm, precise, alive, yours
<TextEffect
words={["calm","precise","alive","yours"]}
effect="flip"
interval={2500}
/>Whole sections, ready to assemble.
Heroes, pricing, FAQs, footers. Stack them into a page, then restyle them like any other component.
Copy. Paste. Own it.
No package to update, no runtime to depend on. The source lands in your repo and becomes yours to change.
- 1
Pick
Find a component in the index and tune it in the preview.
ui.devsloka.in/components/morphing-nav - 2
Add
Install it with the shadcn CLI, or paste the source by hand.
npx shadcn@latest add …/r/morphing-nav.json - 3
Own
The file lands in your repo. No package, no lock-in. Change anything.
components/ui/morphing-nav.tsx
Free to build with. Pro when you need more.
Every component, block, background and hook is free and MIT licensed. Pro, launching soon, is a one-time purchase with more advanced components and new ones every month.
- Every component, background and hook in the index
- Section blocks for real pages
- Install with the shadcn CLI or copy the source
- MIT licensed, for personal and commercial projects
- Updates as the library grows
Pro
Coming soon$149
Launch price for the first 30 days
More motion, more depth, and new components every month. Pay once, keep it forever.
Get the launch price- More animated and complex components
- New, on-trend components every month
- An AI skill that customizes components for your project
- Full-page blocks and complete templates
- Lifetime updates and priority support
Build something that moves.