Skip to main content

​
Labs Components

Labs components are experimental and may have breaking changes between minor versions. Use them at your own risk in production applications.
Labs components are experimental features that are under active development. These components provide cutting-edge functionality but may undergo significant changes before being promoted to stable status.

​
What are Labs Components?

Labs components are:
  • Experimental - APIs may change without following semver
  • Community-driven - Often developed based on user feedback
  • Pre-release - Testing ground for new features
  • Opt-in - Must be explicitly imported from vuetify/labs

​
Using Labs Components

Labs components must be imported separately from the main Vuetify library: 
// Using individual imports
import { VDateInput } from 'vuetify/labs/VDateInput'
import { VColorInput } from 'vuetify/labs/VColorInput'

export default {
  components: {
    VDateInput,
    VColorInput
  }
}
Or register them globally: 
import { createVuetify } from 'vuetify'
import * as labs from 'vuetify/labs/components'

export default createVuetify({
  components: {
    ...labs,
  },
})

​
Available Components

​
Input Components

​
VColorInput
A text field with integrated color picker for selecting colors. View Documentation
​
VDateInput
A text field with integrated date picker for selecting dates. View Documentation
​
VMaskInput
A text field with input masking functionality. View Documentation

​
User Interface

​
VCommandPalette
A command palette for keyboard-driven navigation and actions. View Documentation
​
VFileUpload
A drag-and-drop file upload component with preview. View Documentation
​
VAvatarGroup
Display a group of avatars with overflow handling. View Documentation
​
VIconBtn
An icon button component with enhanced features. View Documentation

​
Other Components

Additional labs components include:
  • VPicker - Base picker component
  • VPie - Pie chart component
  • VPullToRefresh - Pull-to-refresh functionality
  • VStepperVertical - Vertical stepper component
  • VVideo - Video player component

​
Migration Path

When a labs component graduates to stable:
  1. The component moves from vuetify/labs to the main vuetify package
  2. A deprecation warning is added to the labs export
  3. The labs version is removed in the next major release

​
Providing Feedback

Your feedback helps improve these components:

​
Important Considerations

  • Labs components may have incomplete documentation
  • Breaking changes can occur in minor releases
  • Some props and events may not be finalized
  • TypeScript types may change
  • Not all features may be fully tested

​
Best Practices

  1. Pin your Vuetify version when using labs components
  2. Test thoroughly before deploying to production
  3. Monitor release notes for breaking changes
  4. Provide feedback to help shape the final API
  5. Have a migration plan for when APIs change

Build docs developers (and LLMs) love

Get started for freeTalk to us