Element UI: A Vue 2.0 Component Library
Element UI is a Vue 2.0 component library that ships a full set of form, table, dialog, and navigation components styled and ready to drop into a Vue app. Reach for it if you're stuck on Vue 2 and want a complete component set without hand-rolling dropdowns and date pickers yourself. Skip it if you're starting a new project on Vue 3 — the README itself points you to Element Plus instead.
A Vue 2.0 Component Library for the Web
Element UI is a Vue.js 2.0 UI toolkit for the web from the ElemeFE team, covering forms, tables, dialogs, navigation, and layout components for building app interfaces. It installs as an npm package and registers globally with Vue.use(Element), or you can import components individually to trim bundle size. Docs ship in English, Chinese, Spanish, and French.
Core Component Categories
- ✓Form components — inputs, selects, checkboxes, radios, and date pickers — with built-in validation hooks
- ✓A Table component with sorting, plus layout primitives (Container, Row, Col) for building dashboard-style pages
- ✓Overlay and feedback components — Dialog, Message, Notification — for modals, alerts, and toasts
- ✓Navigation components — Menu, Tabs, Breadcrumb, Pagination — for app chrome and multi-page flows
- ✓A theming system with an online theme preview/generator tool (theme-chalk-preview) for customizing the look before you ship it
- ✓A companion FAQ document and an awesome-element list of community resources for extending the base component set
What You Can Build
- •Internal admin panels and back-office dashboards that need a table, a form, and a modal working quickly
- •Vue 2 SaaS product UIs that need consistent form and data-entry components without custom-building each one
- •Quick prototypes and MVPs where hand-building date pickers and validation would eat too much time
Installing Element UI
Install Element UI as an npm package: `npm install element-ui -S`. That's the only install path documented in the README — no separate CLI, scaffolding tool, or CDN snippet is mentioned there.
Importing and Using Components
Import Vue and Element UI, then call `Vue.use(Element)` to register every component globally — three lines and you have access to the whole set. If bundle size matters more than convenience, import individual components instead, e.g. `import { Select, Button } from 'element-ui'`, then register each one with `Vue.component(Select.name, Select)`. The README points to a longer Quick Start guide on the docs site for the rest.
Strengths
- ✓One npm install gets you a full component set — forms, tables, dialogs, navigation — instead of assembling five separate libraries
- ✓On-demand imports (`import { Select, Button } from 'element-ui'`) let you register only the components you actually use instead of the whole library
- ✓An online theme preview/generator tool makes restyling less of a guessing game than editing Sass variables blind
- ✓Documentation and community support exist in four languages — English, Chinese, Spanish, French — including translated contributing guides
Vue 2 Only — No Vue 3 Support
- △Vue 2 only — the README says plainly that Element will stay on Vue 2.x and sends Vue 3 projects to Element Plus instead, so there's no in-repo upgrade path
- △MiniProgram developers are redirected to a separate project, MorJS, rather than getting first-party support here
- △The React and Angular ports (element-react, element-angular) live in separate repos with their own maintenance status, not covered by this review
- △Browser support tops out at IE10+ per the README — a sign the codebase predates modern-only browser targets
Element UI vs Element Plus and Other Options
Frequently Asked Questions
Element UI is released under the MIT license, which permits commercial use, modification, and redistribution without royalties.
Element UI supports only Vue 2 — the README states the project will stay on Vue 2.x and directs Vue 3 projects to Element Plus, a separate community-developed library.
Element UI ships a custom-theme guide in its documentation plus an online theme preview and generator tool (theme-chalk-preview) for adjusting the look before you apply it to your project.
Element UI targets Vue 2 and is maintained by the original ElemeFE team, while Element Plus is a separate, community-developed library built for Vue 3 — the README recommends switching for new Vue 3 projects.
Import the components you need directly, e.g. `import { Select, Button } from 'element-ui'`, then register each with `Vue.component(Select.name, Select)` instead of calling `Vue.use(Element)` for the whole library.
Element UI supports modern browsers and Internet Explorer 10 and above, according to the README.
The problem it solves
Vue 2 projects need a consistent set of form, table, and dialog components without every team building its own date picker and validation logic from scratch. Element UI packages that whole surface — components, theming, and multi-language docs — into one npm install, which matters specifically for teams stuck maintaining Vue 2 apps that can't or won't migrate to Vue 3 yet.
Who should try it — and who should skip
Reach for Element UI if you're maintaining or extending an existing Vue 2 codebase and want a complete, consistent component set without stitching together several smaller libraries. Skip it for greenfield Vue 3 apps — the README sends new Vue 3 work straight to Element Plus. Teams needing MiniProgram support should look at MorJS instead, since Element UI doesn't cover that target.
Related repositories
Curious whether element is right for you?
Let ChatGPT, Claude, or Perplexity look into it — click below and see what AI actually says about element.
