Skip to main content

label

Description​

Optional. Sets a label above the slider bar

Usage​

label?: string;

Example​

import { useState } from "react";

function Example() {
  const [value, setValue] = useState(50);

  return (
    <Slider
      label={`Progress: ${value}`}
      value={value}
      onChange={(v) => setValue(v.value)}
    />
  );
}

Details​

By default, a label is placed above the slider. It is also possible to put a label to the left of a slider with the help of the <Field> component. Read the details in the related article.

Related article: Adding a label

Related sample: Slider