UI Components

Table

Tables / data grids

• vue-cheetah-grid - A high-performance grid engine that work on a canvas for Vue.js.

Notification

Toaster / snackbar — Notify the user with a modeless temporary little popup

• vue-toaster - Vue.js toast notification plugin for Vue 3
• vue-notification-ui - A simple push the notification UI with Vue.js
• vue-my-toasts - Provide your component and let us toast the rest
• @kyvg/vue3-notification - Vue 3 notification library

Loader

Loaders / spinners / progress bars — Let the user know that something is loading

• vue-wait-for - A loader manager for Vue.js 3 with reactive method
• vue-content-loader - SVG component to create placeholder loading, like Facebook cards loading
• vue3-circle-progress - Highly customizable Vue.js 3 circular progress bar component

Progress Bar

A slim progress bar at the top of the page

• vue-next-progressbar - Slim progress bars (1KB gzipped) for Vue 3
• vue3-progress - Fully customizable Vue 3 plugin to display a progress bar while waiting for something, e.g. HTTP requests

Tooltip

Tooltips / popovers

• v-tooltip - Easy tooltips with Vue 2.x.
• @adamdehaven/vue-custom-tooltip - Vue 2 & 3 customizable, reactive, and reusable tooltip component that supports plugin options, props, and multiple use-cases. Also works with SSR (e.g. VuePress, Nuxt) and includes TypeScript types. (Vue 3 is available on next branch/npm tag)
• vue-use-popperjs - Vue 2 & 3 Popper hook powered by Popper.js
• vue-follow-tooltip - Tiny tooltip directive for Vue 3
• Tippy.vue - Nesting-free Tippy.js directive/component for Vue 3. A drop-in addition with no structural or style changes required. Supports both individual and singleton tooltips

Overlay

Overlay / modal / alert / dialog / lightbox / popup

• vue-final-modal - Tailwind-friendly, highly customizable, stackable modal component
• vuesence-modal-window - Simple Modal window Vue.js component that takes care of overlay, centering, animation, outside click/Escape key/X-mark closing and allows you to concentrate on its content only
• vue-it-bigger - A simple image / (YouTube) video lightbox component for Vue.js
• v3confirm - A plugin dedicated for Vue 3 to show confirm dialog modal
• vue3-promise-dialog - Let's you create promise based dialogs in Vue 3 (Composition or Options API) with ease

Icons

• vue-feather - Feather icons component for Vue 3
• eos-icons-vue - Eos icons npm package for Vue 3, eos-icons-vue2 for Vue 2
• vue-icomoon - With vue-icomoon you can easily use the icons you have selected or created in icomoon

Marquee

• vue3-marquee - A simple and responsive marquee component for Vue 3 applications with 0 dependencies

Menu

• vue-file-toolbar-menu - UI file/toolbar menus for Vue apps
• vue-bottom-sheet - A swipeable bottom sheet component for Vue.js created with Hammer.js
• SDropdown - Highly customizable, simple and modern Vue 3 dropdown component

Minus Plus Input

• vue-numeric-input - Number input component with controls.

Carousel

• slither-slider - Carousel for images, videos, or components. Throw pretty much anything you want at it
• vue-slick-carousel - A carousel with slick features & SSR support written for faster Luxstay
• @jfm/vue-carousel - A Vue carousel component
• vue-snap - Lightweight Carousel based on Scroll Snap CSS
• vuerollr - Mouseover gallery plugin for Vue.js. Supports image and video
• vue-splide - Splide is a free lightweight but powerful slider and carousel, written in pure JavaScript without any dependencies. It supports a thumbnail slider, nested slide
• swiper - Official Swiper component for Vue 3. Tree shakable, SSR support, typing, a11y and a lot more
• vue-split-carousel - A carousel component meanwhile display several carousel item, supports Vue 2 and Vue 3
• vue-concise-carousel - Vue Concise Carousel with True SSR. Works for Vue 2 & 3

Charts

• vue-echarts - The official Vue.js wrapper component for Apache ECharts
• jscharting-vue - Vue chart component offering a complete set of chart types and engaging data visualizations with JSCharting
• flowchart-vue - Flowchart & Flowchart designer component for Vue.js
• vue-d3-barchart - Small component to draw charts using d3
• vue3-highcharts - A Highcharts.JS wrapper component for Vue 3
• echarts-for-vue - ECharts Wrapper Component For Vue 3 and 2
• vue3-chart-v2 - Vue wrapper component base on Chart.js for Vue 3
• vue-gauge - Vue.js component to create animated SVG gauge charts

Time

Display time / date / age

• vue-horizontal-timeline - Just a simple horizontal timeline component made with Vue.js
• vue-timer-hook - Vue 3 Timer module inspired by react-timer-hook
• vue3-flip-countdown - Customize countdown timer with flip animation for Vue 3.x

Map

• vue-cesium - Vue 2.x & Vue 3.x components for Cesium
• vue3-openlayers - Vue 3 components to work with OpenLayers
• vue-mars3d - Vue 2.x 3D earth visualization JS development platform
• vue-leaflet-custom-marker - Vue leaflet for OpenStreetMap custom marker component

Audio / Video

• vue-use-sound - A Vue Hook for playing sound effects
• vue-flv-player - An HTML5 Flash Video (FLV) Player component for Vue 2.x, based on flv.js
• vue-audio-tapir - Audio recorder component for Vue 3 that enables to record, play and send audio messages to a server.

PDF

• vue-pdf-embed - PDF embed component for Vue 2 and Vue 3

Tree

• vue-finder - A component to display hierarchical data, with selection, filtering and drag & drop
• vue3-router-tree - This component is based on Vue.js 3, it represents your routes or items as a tree view
• object-visualizer - Vue 3 JSON inspector with Chrome-like theme
• vue-virtual-tree - Tree component for large amount of data, base on Vue 3

Graphs

• vnodes - General purpose components to create SVG interactive graphs, diagrams or node based visual tools
• v-network-graph - An interactive SVG based network-graph visualization component for Vue 3
• coya - Diagram drawing library (Vue 3 only)

Social Sharing

• vue-socials - Social media share buttons and counts for Vue.js

QR Code

• vue3-qr-reader - A Vue 3 QR reader component. Refactor vue-qrcode-reader for Vue 3 compatibility

Search

• vue-json-search - Headless Vue 3.x component for easy and simple JSON-based search

Miscellaneous UI Components

• vue-copy-to-clipboard - Vue.js 3 plugin to copy text to clipboard (Vue 3)
• vue-advanced-chat - Feature-rich and fully customisable chat rooms component. Support files, images, videos, audio, emojis, customised actions, etc.
• vue-visual-filter - An unopinionated advanced visual filtering component for Vue 2 and 3
• vue-easter-egg-trigger - This packages makes it nice and easy to add Easter Egg triggers to your Vue site
• vue-word-highlighter - The word highlighter library for Vue 2 and Vue 3
• vue3-emoji-picker - Simple and powerful emoji picker for Vue 3

Tabs

• vue3-tabs - A touch swipe tabs component for vue 3
• vue3-tabs-chrome - A Vue 3 component for Chrome-like tabs

Form

Let the user create & edit data

Phone Number Input Formatter

• vue-tel-input - International Telephone Input with Vue

Picker

• vue3-scroll-picker - A scroll picker component for Vue 3

Generator

• vue3-otp-input - A fully customizable, OTP (one-time-password) input component built with Vue 3.x and Vue Composition API

Date Picker

Date / datetime / time Picker

• vue-datepicker - The most complete date picker solution for Vue 3
• vue-datepicker-next - Vue 3.x component for datepicker / timepicker / datetimepicker / calendar

Select

• vue-selectize - A Vue.js component wrapper around Selectize.js, a vanilla JS select component
• @vueform/multiselect - Vue 3 multiselect component with single select, multiselect and tagging options

Slider

• @vueform/slider - Vue 3 slider component with multihandles, tooltips merging and formatting

Drag and Drop

• vuedraggable - Vue component allowing drag-and-drop sorting in sync with View-Model. Based on Sortable.js.

Color Picker

• vue-color-input – Vue 3 color picker component whose goal is to replace <input type="color">

Switch

Switch / on/off toggle / checkbox

• @vueform/toggle - Vue 3 toggle component with labels, custom slots and styling options

Rich Text Editing

• vue-quill - A Vue 3 rich text editor component based on Quill Editor

Image Manipulation

Edit images

• vue-picture-cut - Image cropper：scale, flip, rotate, edge check, rectangle clip, ellipse clip
• vue-img-cutter - A vue plugin for image cutting tool,it's very convenient to use

Display images

• vue-image-kit - Vue.js Image Kit Component with Lazy Load built in and Responsive Images

File Upload

• vue-dropify - A simple image dropzone component for Vue.js

Miscellaneous Form Components

• vue-paycard - Credit card component made with Vue.js
• vue-list-picker - Just a simple list picker component made with Vue.js
• v-use-places-autocomplete - Vue composable for Google Maps Places Autocomplete

Canvas

• vue3-signature - An electronic signature component for Vue 3
• v-perfect-signature - Pressure-sensitive signature drawing for Vue 2 and 3