naive-ui
Naive UI is a Vue 3 component library written entirely in TypeScript, offering 90+ tree-shakable components with a JS-based, type-safe theming system that requires no separate CSS imports or build-loader configuration.
Embed badge
[](https://opensources.dev/resource/naive-ui)MITPermissive — free to use in commercial and proprietary software, with attribution.View license →
Production readiness
5/5- Actively maintainedCommits in the last 6 months
- No known vulnerabilitiesNo OSV advisories
- Clear, usable licenseMIT (permissive)
- Proven adoptionWidely used
- Has documentationDocumentation indexed
npm install naive-uiOur analysis
A comprehensive Vue 3 UI component library built in TypeScript, emphasizing a JS-driven theme system and zero-CSS-import usage. It bundles 90+ components including data-heavy ones backed by virtual scrolling.
When to use naive-ui
Choose it for new Vue 3 + TypeScript projects that want a broad set of components out of the box, strong type safety, and runtime theme customization without configuring Sass/Less or webpack loaders. Good for admin dashboards and data-heavy interfaces thanks to default virtual lists.
When not to
Not suitable for Vue 2 projects, React/Angular/Svelte stacks, or teams that prefer SSR-friendly atomic CSS approaches or established design-language compliance (e.g. strict Ant Design or Material guidelines). If you need a battle-tested enterprise standard with the largest hiring pool, Element Plus or Ant Design Vue may be safer.
Strengths
- Fully typed in TypeScript with type-safe theme overrides
- No CSS import or build-tool loader setup required; styles are runtime-injected
- Large component count (90+) and all tree-shakable
- Virtual list by default for data components, aiding performance
- Active and reasonably popular with good documentation
Trade-offs
- Vue 3 only — no Vue 2 or other framework support
- Runtime CSS-in-JS theming can complicate SSR and increase client-side overhead vs. static CSS
- Smaller ecosystem and English-resource depth compared to Element Plus / Ant Design Vue
- Some community channels (DingTalk groups) are at capacity, hinting at China-centric support
- Casual/informal docs tone may leave edge cases under-documented
Maturity
Mature and widely adopted (18k+ stars), maintained by tusen-ai with an active Discord and contributor base. MIT-licensed and stable for production Vue 3 use, though its ecosystem is younger than the largest Vue libraries.
Documentation
Community
DingTalk Group 1 (Member limit reached) 33482509
DingTalk Group 2 (Member limit reached) 35886835
DingTalk Group 3 (Member limit reached) 32377370
DingTalk Group 4 (Member limit reached) 8165002788
DingTalk Group 5 (Member limit reached) 31205022250
DingTalk Group 6 (Member limit reached) 62720001971
DingTalk Group 7 172000005810
Features
Fairly Complete
There are more than 90 components. Hope they can help you write less code.
What's more, they are all treeshakable.
Theme Customizable
We provide an advanced type safe theme system built using TypeScript. All you need is to provide a theme overrides object in JS. Then all the stuff will be done by us.
What's more, no less/sass/css variables, no webpack loaders are required.
Uses TypeScript
All the stuff in Naive UI is written in TypeScript. It can work with your typescript project seamlessly.
What's more, you don't need to import any CSS to use the components.
Fast
I try to make it not rather slow. All data components works with virtual list by default.
What's more, ..., no more. Just enjoy it.
Installation
npm
Use npm to install.
npm i -D naive-ui
Fonts
npm i -D vfonts
Icons
Naive UI recommends using xicons as icon library.
Design Resources
Contributing
Please see CONTRIBUTING.md.
License
Naive UI is licensed under the MIT license.
Graphics resources of result component is licensed under the CC-BY 4.0. The graphics resources come from Twemoji.