import { CProgress } from '@coreui/react'// orimport CProgress from '@coreui/react/src/components/progress/CProgress'| Property | Description | Type | Default |
|---|---|---|---|
| animated | Use to animate the stripes right to left via CSS3 animations. | boolean | - |
| className | A string of all className you want applied to the component. | string | - |
| color | Sets the color context of the component to one of CoreUI’s themed colors. | {'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'dark' | 'light' | 'primary-gradient' | 'secondary-gradient' | 'success-gradient' | 'danger-gradient' | 'warning-gradient' | 'info-gradient' | 'dark-gradient' | 'light-gradient' | string } | - |
| height | Sets the height of the component. If you set that value the inner <CProgressBar> will automatically resize accordingly. | number | - |
| progressBarClassName 4.9.0+ | A string of all className you want applied to the <CProgressBar/> component. | string | - |
| thin | Makes progress bar thinner. | boolean | - |
| value | The percent to progress the ProgressBar (out of 100). | number | - |
| variant | Set the progress bar variant to optional striped. | 'striped' | - |
| white | Change the default color to white. | boolean | - |
On this page