Streamline the Laravel SaaS Starter Kit - Launch Your Next SaaS Today

Progress

Show progress indicators

Tag: x-turbine-ui-progress
50%
50%
50%
50%
50%
50%
50% 
<x-turbine-ui-progress
    label="Progress Default"
    percentage="50"
    gradient
/>
 
<x-turbine-ui-progress
    label="Progress Brand"
    percentage="50"
    variant="brand"
/>
 
<x-turbine-ui-progress
    label="Progress Primary"
    percentage="50"
    variant="primary"
/>
 
<x-turbine-ui-progress
    label="Progress Secondary"
    percentage="50"
    variant="secondary"
/>
 
<x-turbine-ui-progress
    label="Progress Success"
    percentage="50"
    variant="success"
/>
 
<x-turbine-ui-progress
    label="Progress Warning"
    percentage="50"
    variant="warning"
/>
 
<x-turbine-ui-progress
    label="Progress Danger"
    percentage="50"
    variant="danger"
/>

Attributes

Name Type Options Description
accent boolean Adds an accent
border boolean Adds a border
gradient boolean Adds a gradient
label string Adds a text label
percentage string Display the percentage amount
ring boolean Adds a ring
rounded boolean Adds a rounded corner
shadow boolean Adds a shadow
size string Size is used to control styles such as margin, padding and font size. Extensible via the theme.
variant string A variant is like a colour palette
Theme