A premium, open-source library of copy-paste React components modeled after physical objects (like CD players, tactile selectors, and audio visualizers). Built with Next.js, Tailwind CSS v4, and Framer Motion spring physics. You own the code.
No reviews yetBe the first to leave a review for Sora UI
Maker
📌
Hey Product Hunt! 📀
I’m Karan, the creator of Sora UI.
I missed the era when digital interfaces had texture, depth, and physical satisfying clicks. Today, everything is flat, generic, and monochromatic. I wanted to bring that tactile magic back—but modern, accessible, and fully compatible with React, Tailwind CSS v4, and Framer Motion.
That's why I built Sora UI.
🔮 What is Sora UI?
A collection of skeuomorphic components that you can copy-paste directly into your code. No bloated NPM packages, no rigid styling locks. You own the code.
💿 Key Features:
- Zero Dependency Lock-in: Copy the code or install automatically using the Shadcn CLI registry (`npx soraui-cli add`).
- Rich Aesthetics: Glassmorphic panels, rotating CD players, frequency visualizers, glowing date strips.
- Tailwind CSS v4 + React 19: Built on the bleeding edge of modern web tech.
- Open for Contributions: We are open-source and welcoming new skeuomorphic widgets!
I’d love to hear your feedback on the components, and what other physical devices we should mimic next (dials, tapes, knobs, sliders)?
Thanks for checking it out! ⭐
Report
How are the Framer Motion springs tuned for these components, is there a preset system or do I need to tweak stiffness and damping by hand for each one?
Report
Maker
@ufuk386838 Great question! Right now the components use tween-based transitions (duration + custom cubic-bézier easing), not spring physics — so there's no stiffness/damping to fiddle with. Each component's
motion is defined inline (e.g. the player's morph is { duration: 0.7, ease: [0.76, 0, 0.24, 1] }), and since it's copy-paste you own the code, tweaking is a one-line change. There's no shared preset
system yet, but a documented set of motion presets is a great idea — noting it for the roadmap... 🙏
Report
how does this handle accessibility for the more tactile components like the rotary selectors, do they have keyboard fallbacks or is that left up to whoever implements them
Report
Maker
@aligndoduz2fn it's partial today. Anything built on a native (date selector, play/pause) is keyboard-accessible out of the box. But the really tactile stuff — the scroll-wheel track/volume selectors and the drag-to-rotate sphere — is pointer-driven right now and doesn't ship keyboard fallbacks or ARIA, so that's on you until I add it. It's high on my list — arrow-key support and proper ARIA roles for the wheel/rotary selectors are exactly the kind of thing that should be baked in, not left to the user. Thanks for pushing on it. 🙏
Report
The physical-object metaphor actually works here, especially with the spring physics making those tactile selectors feel weighted instead of floaty. Really thoughtful execution on a library that could have easily ended up as another generic component pack.
Report
Maker
@kymetrayw Thank you, this means a lot. 🙏 That "weighted, not floaty" feel was the entire obsession — I kept tuning the motion asking "would a real object move like this?" until it stopped feeling decorative
and started feeling physical. "Another generic component pack" was exactly the fate I was trying to dodge, so this really lands. Appreciate you. 🖤
How are the Framer Motion springs tuned for these components, is there a preset system or do I need to tweak stiffness and damping by hand for each one?
@ufuk386838 Great question! Right now the components use tween-based transitions (duration + custom cubic-bézier easing), not spring physics — so there's no stiffness/damping to fiddle with. Each component's
motion is defined inline (e.g. the player's morph is { duration: 0.7, ease: [0.76, 0, 0.24, 1] }), and since it's copy-paste you own the code, tweaking is a one-line change. There's no shared preset
system yet, but a documented set of motion presets is a great idea — noting it for the roadmap... 🙏
how does this handle accessibility for the more tactile components like the rotary selectors, do they have keyboard fallbacks or is that left up to whoever implements them
@aligndoduz2fn it's partial today. Anything built on a native (date selector, play/pause) is keyboard-accessible out of the box. But the really tactile stuff — the scroll-wheel track/volume selectors and the drag-to-rotate sphere — is pointer-driven right now and doesn't ship keyboard fallbacks or ARIA, so that's on you until I add it. It's high on my list — arrow-key support and proper ARIA roles for the wheel/rotary selectors are exactly the kind of thing that should be baked in, not left to the user. Thanks for pushing on it. 🙏
The physical-object metaphor actually works here, especially with the spring physics making those tactile selectors feel weighted instead of floaty. Really thoughtful execution on a library that could have easily ended up as another generic component pack.
@kymetrayw Thank you, this means a lot. 🙏 That "weighted, not floaty" feel was the entire obsession — I kept tuning the motion asking "would a real object move like this?" until it stopped feeling decorative
and started feeling physical. "Another generic component pack" was exactly the fate I was trying to dodge, so this really lands. Appreciate you. 🖤