# Progress linear

The v-progress-linear component is used to convey data visually to users. It supports both indeterminate amounts, such as loading or processing, and finite amounts of progress (including separate buffer values).

# Usage

In its simplest form, v-progress-linear displays a horizontal progress bar. Use the value prop to control the progress.

# API

v-progress-linear

# Examples

# Props

# Buffering

The primary value is controlled by v-model, whereas the buffer is controlled by the buffer-value prop.

# Colors

You can set the colors of the progresss bar using the props color and background-color.

# Indeterminate

Using the indeterminate prop, v-progress-linear continuously animates.

# Reversed

Displays reversed progress. The component also has RTL support, such that a progress bar in right-to-left mode with reverse prop enabled will display left-to-right.

# Rounded

The rounded prop is used to apply a border radius to the v-progress-linear component.

Use the rounded-bar property to add a border-radius to the inner edges of value bar. By default, the value bar’s border-radius is equal to the default border-radius of your application unless a different value is provided by the rounded prop or SASS variable.

# Stream

The stream property works with buffer-value to convey to the user that there is some action taking place.

# Striped

This applies a striped background over the value portion of the v-progress-linear. This prop has no effect when using inderminate.

# Slots

# Default

The v-progress-linear component will be responsive to user input when using v-model. You can use the default slot or bind a local model to display inside of the progress. If you are looking for advanced features on a linear type component, check out v-slider.

# Misc

# Determinate

The progress linear component can have a determinate state modified by v-model.

# File loader

The v-progress-linear component is good for communicating to the user that they are waiting for a response.