---
meta:
title: Range
description: Ranges allow the user to select a single value within a given range using a slider.
layout: component
---
```html:preview
```
```jsx:react
import SlRange from '@shoelace-style/shoelace/dist/react/range';
const App = () => ;
```
:::tip
This component works with standard `