qodesign vs HeroUI
HeroUI (formerly NextUI) is a free, open-source React library built on React Aria and Tailwind CSS v4, meant to be the base of your whole app. qodesign doesn't try to be that base. It sells single animated flows, like a login, an OTP gate or a checkout, that you drop on top of whatever library you already use.
| qodesign | HeroUI | |
|---|---|---|
| Price | $3 each, or $29 once for all of them (the Shelf) | The library is free. HeroUI Pro is a one-time perpetual licence: Web Hero (React) $299, Mobile Hero (React Native) $299, Super Hero (both) $399. Updates after the first year are optional at $99/yr ($129/yr for Super Hero). Team plans sit on a separate tab of the same page |
| Free | 1 free component, no account needed | The full open-source component library for React and React Native |
| Size | 17 components, more added as they ship | A full set of app components (forms, date pickers, tables, modals, toasts and more), plus Pro templates such as dashboard, mail, chat, finances and CRM |
| What's in a download | React + Tailwind (TSX), PROMPT.md, HTML file | See their site |
| Licence | Personal, commercial and client projects; no reselling the source | Apache-2.0, as listed for heroui-inc/heroui on GitHub |
| Stack | React + TypeScript, Tailwind (most also use Framer Motion), HTML version included | React 19, Tailwind CSS v4 and React Aria Components (v3). It was called NextUI before; v3 dropped the Framer Motion dependency and animates with CSS transitions on data attributes |
| Best for | One memorable animated moment in your app (login, checkout, nav, dashboard) | A whole accessible design system for an app, with typed APIs and docs your coding agent can read (llms.txt, MCP server) |
Which one to pick
- Pick HeroUI if
- You're starting an app and want one accessible component set for every input, table and modal, with a migration path and an MCP server for your agent.
- Pick qodesign if
- Your app already has its basic components and you want one screen, like the login or the checkout, to have motion people remember.
qodesign pieces to look at first
Related reading: shadcn/ui animated components: add motion without breaking accessibility