> For the complete documentation index, see [llms.txt](https://ds5.gitbook.io/documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://ds5.gitbook.io/documentation/components/button-slider.md).

# Bouton slider

{% hint style="info" icon="figma" %}
Nom du composant : **buttonSliderControler**
{% endhint %}

***

{% embed url="<https://www.figma.com/proto/wBkSm4I4jUASOuNVQr9xA9/DSVUV5---Previews?content-scaling=fixed&hotspot-hints=0&node-id=4655-6892&page-id=4600:1093&scaling=min-zoom&starting-point-node-id=4655:6892&t=oDwIwnvX5P2rMhq4-1&viewport=327,307,0.82>" %}

***

### Principes

#### Accompagné

Le bouton slider est toujours accompagné d'un dégradé de la couleur du fond. Le dégradé suit le sens du bouton.

#### Affichage

Le bouton slider peut être affiché ou non en fonction de l'état du slider dans lequel il est utilisé.

***

### À faire, ne pas faire

<table data-card-size="large" data-view="cards"><thead><tr><th></th><th></th></tr></thead><tbody><tr><td><mark style="color:green;">À faire</mark></td><td>Utiliser le bouton de contrôle de slider uniquement dans les sliders</td></tr><tr><td><mark style="color:red;">À ne pas faire</mark></td><td>Utiliser d'autres types de boutons pour contrôler le défilement dans un slider.</td></tr></tbody></table>

***

### Composant lié

{% content-ref url="/pages/X5jVI1da8wv0fY4tcExg" %}
[Bouton](/documentation/components/button.md)
{% endcontent-ref %}

{% content-ref url="/pages/R4VSddInHlPRn59nXayV" %}
[Slider](/documentation/components/slider.md)
{% endcontent-ref %}