Skip to content

mtrl. /Components

Components Styles Examples Documentation GitHub ↗

Components Styles Documentation GitHub ↗

Components

Overview

Actions

Button Icon button Button group Split button FAB Extended FAB

Selection & input

Checkbox Switch Radio buttons Chips Slider Text field Select Search Date picker Time picker

Navigation

Navigation rail Drawer Tabs Menu Top app bar Bottom app bar

Containment

Card List Carousel Divider Dialog Bottom sheet Side sheet

Communication

Badge Progress Loading indicator Snackbar Tooltip

mtrl · Material Design 3
MIT license
Icons: Material Symbols by Google, Apache 2.0
Type: Roboto by Google, OFL 1.1

SELECTION & INPUT / SLIDERDocumentation ↗

Slider

Choose a value or a range. Explore track sizes, steps, colors, and value indicators.

Theme

Light Dark

Loading preview… 9.7 KB gzip11.0 KB gzip

CONFIGURATION

Appearance

Size

XSSMLXL

Orientation

horizontalvertical

Color

Tick marks Value indicator

Content

Label

Value

40

Range end

80

Inset icon

Behavior

Variant

standardcenteredrange

Step

510

Disabled

↑↓navigate ↵open escclose