# Steps API Reference

See Source

See Output

  * Account Created
  * Profile Setup
  * Verification

[code]

    def ex_steps2():
        return Steps(
            LiStep("Account Created", cls=StepT.primary),
            LiStep("Profile Setup", cls=StepT.neutral),
            LiStep("Verification", cls=StepT.neutral),
            cls="w-full")
    
[/code]

See Source

See Output

  * Project Planning
  * Design Phase
  * Development
  * Testing
  * Deployment

[code]

    def ex_steps3():
        return Steps(
        LiStep("Project Planning", cls=StepT.success, data_content="📝"),
        LiStep("Design Phase", cls=StepT.success, data_content="💡"),
        LiStep("Development", cls=StepT.primary, data_content="🛠️"),
        LiStep("Testing", cls=StepT.neutral, data_content="🔎"),
        LiStep("Deployment", cls=StepT.neutral, data_content="🚀"),
        cls=(StepsT.vertical, "min-h-[400px]"))
    
[/code]

# API Docs

### Steps

Source

[code]

    Steps(*li, cls='', **kwargs) -> fastcore.xml.FT
[/code]

> Creates a steps container

**Params**

  * `li` Each `Li` represent a step (generally use `LiStep`)

  * `cls` class for Steps (generally a `StepsT` option)

  * `kwargs`

**Returns:** Ul(..., cls='steps')

* * *

### StepsT

_Options for Steps_

Option | Value | Option | Value  
---|---|---|---  
vertical | steps-vertical | horizonal | steps-horizonal  
  
### LiStep

Source

[code]

    LiStep(*c, cls='', data_content=None, **kwargs) -> fastcore.xml.FT
[/code]

> Creates a step list item

**Params**

  * `c` Description for Step that goes next to bubble (often text)

  * `cls` Additional step classes (generally a `StepT` component)

  * `data_content` Content for inside bubble (defaults to number, often an emoji)

  * `kwargs`

**Returns:** Li(..., cls='step')

* * *

### StepT

_Step styles for LiStep_

Option | Value | Option | Value | Option | Value  
---|---|---|---|---|---  
primary | step-primary | secondary | step-secondary | accent | step-accent  
info | step-info | success | step-success | warning | step-warning  
error | step-error | neutral | step-neutral |  |