> This page is for Flowkit CSS Framework, version v2 (default).
> For other versions, use one of these documentation indexes:
> - v2 (default): https://developers.webflow.com/flowkit/v2.0.0/llms.txt
> - v1: https://developers.webflow.com/flowkit/v1.0.0/llms.txt

> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://developers.webflow.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://developers.webflow.com/_mcp/server.

# Slider

> Sliders are interactive components that allow users to select a value from a range.

## Class Naming

| Class        | Description                                                |
| ------------ | ---------------------------------------------------------- |
| slider       | The main wrapper element for the slider                    |
| slider_mask  | A container that clips and holds the visible slide content |
| slider_arrow | Navigation button used to go to the next/previous slide    |

## Navigation

Sliders use arrows for navigation. These arrows are styled using a base class, and surface modifiers can be added to adapt to different backgrounds.

The base class is slider_arrow.

### Directional Modifiers

This can be extended with directional modifiers for navigation:

* slider_arrow is-previous
* slider_arrow is-next

## Surface Modifiers

Use these to adapt the slider arrows to dark backgrounds.

slider_arrow is-inverse