Slider
Content
Codesnippets

Slider

Content
Codesnippets

Sliders allow the selection of a value or a value range on a given scale. The scale can contain steps or allow continuously variable selection. Values for selection on the scale can be communicated numerically or else by means of a text label.

The size of the slider depends on the basic type size used, which can adapt to the viewport width in question. As such, the size of the sliders is flexible. Sliders are available in black and white.

HTML
<div class="aui-slider aui-js-slider" data-min="0" data-max="100">
  <input type="hidden" class="aui-slider__hidden-field" value="50.00">
</div>
Audi UI Kit Sketch
Version 1.4 (Releases: <a href="https://github.com/audi/audi-templates/releases" target="_blank">https://github.com/audi/audi-templates/releases</a>)
ZIP
76.3 MB

Examples

Don’ts

Don't place sliders against a red background.