<vaadin-progress-bar>
`<vaadin-progress-bar>` is a Web Component for progress bars.
- Category
- Feedback
- Built with
Lit- Library
Vaadin
- Author
Vaadin
- Package
-
@vaadin/progress-bar - Component size
- 1.5 kB JS (minified + gzipped, JS includes dependencies beyond the library)
- Library size
- 19.9 kB JS (shared by every Vaadin component, loaded once per page)
- Popular
- 3 out of 5
- Downloads
- 64,963/week · jsDelivr 2,349 hits/month (whole @vaadin/progress-bar package)
- Latest stable version
25.3.2- Last published
- Component last changed
- (in
25.3.0) - License
- Apache-2.0
<vaadin-progress-bar> is a Web Component for progress bars.
<vaadin-progress-bar min="0" max="1" value="0.5">
</vaadin-progress-bar>
Styling
The following shadow DOM parts are available for styling:
| Part name | Description |
|---|---|
bar |
Progress-bar's background |
value |
Progress-bar's foreground |
The following custom CSS properties are available for styling:
| Custom CSS property |
|---|
--vaadin-progress-bar-animation-duration |
--vaadin-progress-bar-background |
--vaadin-progress-bar-border-color |
--vaadin-progress-bar-border-radius |
--vaadin-progress-bar-border-width |
--vaadin-progress-bar-height |
--vaadin-progress-bar-padding |
--vaadin-progress-bar-value-background |
--vaadin-progress-value |
The following state attributes are available for styling:
| Attribute | Description |
|---|---|
indeterminate |
Set to an indeterminate progress bar |
See Styling Components documentation.
Attributes
indeterminatemaxminthemevalue