We have a wonderful progress bars for you!

    1. <vuestic-progress-bar
    2.             :value="75"
    3.             text="circle"
    4.             type="circle"
    5.             theme="Info"
    6.             :animated="true"
    7.             background-theme="White"
    8.           />

    Props

    • value - Number - defines level of scale filling. This number is also displayed in progress bar label, if 'text' property is not mounted directly.
    • text - String - name, that displayed in progress bar label
    • type - String (default: horizontal) - vertical, horizontal or circle bar
    • size - String (default: basic) - thin, thick or basic height of horizontal progress bar and width of vertical progress bar
    • theme - String (default: Primary) - name of theme, that sets color of progress bar scale. All list of themes contains there.
    • backgroundTheme - String (default: White) - name of theme, that sets background color of circle progress bar.
    • disabled - Boolean - defines if progress bar disabled or not.
    • animated - Boolean - defines if progress bar scale mounted at once or gradually.
      Find DEMOs here!