# Progress

Progress through a task: ink filling a groove, never a coloured bar.

Kit part · With the Kit · https://tactileui.dev/parts/progress

> The code and styling for this part come with the Tactile UI Kit, which is in the Founder Pass. Sign in if you have it. Sign in: https://tactileui.dev/auth/sign-in The price: https://tactileui.dev/pricing

## Anatomy

The groove is the kit’s recess, shallow. Printing, not a colour.

## Variants

- With a scale
- With a working lamp

## States

- Empty
- Under way
- Done

## Props and options

| Name | Kind | Description |
| - | - | - |
| data-follow | attribute | For a value that moves all the time (a reading position, a scrub): the fill takes it at once instead of easing after it. |
| aria-valuenow | attribute | So assistive tech reads the progress. |

## Usage notes

Move the fader to fill the slot.

## Accessibility

- For work with no known length, use a blinking amber lamp with words, or the Spinner, a ring of lamps: never a rotating arc.

## Related parts

- [Ladder](https://tactileui.dev/parts/ladder): An LED ladder for levels and load: green, then amber, then red, the way a recording level has always been read.
- [Lamp](https://tactileui.dev/parts/lamp): The only colour in the kit: a lamp that is on. Green is on, amber is waiting, red is recording or failing, blue is linked, white is standing by. Always next to words.
- [Toast](https://tactileui.dev/parts/toast): A confirmation after an action.