Sync UI - Animated UI Kit with MUI + Framer Motion + Next.js (Vercel)

New in Sync UI: Hero sections :rocket:

Left-aligned, centered, and search-focused layouts — ready to drop into your landing page.

→ Left-aligned
→ Centered
→ Search variant

Build a strong first impression, fast.

Explore → Sync UI // React Component Library for Design Engineers

Open source · 85+ GitHub stars

New in Sync UI: Pricing sections :credit_card:

Flexible pricing layouts for different product needs.

→ Three-tier
→ Two-tier
→ Row layout

Perfect for SaaS, tools, and landing pages.

Explore → Sync UI // React Component Library for Design Engineers

Open source · 85+ GitHub stars

125+ animated UI components.

Built for real products.

Copy. Customize. Ship faster.

Explore → syncui.design/components

Open source · :star: 85+ GitHub stars

Build landing pages in minutes.

Hero, CTA, and pricing blocks… ready to drop in.

Try it → Sync UI // React Component Library for Design Engineers

Open source · :star: 85+ GitHub stars

Stop starting from scratch.

Startup, SaaS, and portfolio templates… fully customizable.

Check it → syncui.design/templates

Open source · :star: 85+ GitHub stars

Amazing work @abhivarde! Can we add your UI components to our video creation app, Ozor.ai? It would be great for people to be able to build videos with your components in them. Thanks!

1 Like

Thanks a lot, really appreciate it!

Yes, you’re welcome to use Sync UI components, blocks in Ozor.ai.

Would love to know where they’re being used, feel free to share it here once it’s live so others can see it in action.

1 Like

Thanks! We’ll definitely share this here so others can see them in our videos.

Also, we’ll be adding Sync UI to our documentation so people can learn more about your components.

1 Like

Hey Vercel community!

Sync UI got featured in the community showcase a while back. Just posted an update on LinkedIn about hitting 90+ stars.

Would appreciate any feedback or support from the community:

Thanks for the ongoing support :folded_hands:

Hey community! Sync UI is now also available in the Next.js Discord showcase, check it out there too!
Discord

Just shipped a Stats block for Sync UI :arrow_down:

3 variants. One metric. Maximum impact.

→ Simple
→ With Icons
→ Cards

Animated. Copy-paste ready.
Built with Next.js + MUI + motion.dev

↓ Try it
syncui.design/docs/blocks/stats

New to Sync UI? Start here:

• Install → syncui.design/docs/installation
• 13+ Blocks → syncui.design/blocks
• 125+ Components → syncui.design/components
• 3+ Templates → syncui.design/templates

Free & open source · 85+ :star: on GitHub

just shipped the Showcase page for Sync UI

syncui.design/showcase

→ built with Next.js 16.2, powered by GitHub Discussions API
→ every url submitted auto fetches the og image and title
→ first community project is already live by Next Icons

submit yours and get featured

1 Like

:tada: Sync UI v0.4.0 now works natively with AI coding tools

You can now install Sync UI as an agent skill. Claude Code, Cursor, Copilot, Windsurf, and 10+ other tools will know every component, variant, and animation pattern without pasting docs into chat.

npx skills add AbhiVarde/syncui

The skill covers 125+ animated components, 13+ blocks, motion patterns, and setup for Next.js, Vite, and React Router. Similar approach shadcn recently added to their repo.

If you already use Sync UI, this update makes it work much better with how most developers build today.

Skills: syncui — abhivarde/syncui
GitHub: GitHub - AbhiVarde/syncui: UI system for Design Engineers. Components, blocks, and templates built with MUI and Motion. · GitHub
Web: https://syncui.design

1 Like

Fantastic work, @abhivarde!

1 Like

thanks so much for the support, amy! always grateful :raising_hands:t3:

shared it on x as well.

honestly, a lot of inspiration came from malte ubl sir’s idea around agent tooling. i just tried to apply it in the best way i could for sync ui so developers can use it naturally with ai tools.

1 Like