# Range Value

Blazor Edition provides a set of native UI controls built for Blazor such as FlexGrid, Chart, ListView, and input controls including AutoComplete and ComboBox.

## Content



In RangeSlider, by default, the lower and the upper magnitudes of range values are set to 0 and 100, respectively. However, you can change these range values according to your requirements by using [LowerValue](/componentone/api/blazor/online-blazor/dotnet-api/C1.Blazor.Input/C1.Blazor.Input.C1RangeSlider.LowerValue.html) and [UpperValue](/componentone/api/blazor/online-blazor/dotnet-api/C1.Blazor.Input/C1.Blazor.Input.C1RangeSlider.UpperValue.html) properties of the [C1RangeSlider](/componentone/api/blazor/online-blazor/dotnet-api/C1.Blazor.Input/C1.Blazor.Input.C1RangeSlider.html) class. The **LowerValue** property sets the current lower magnitude for the range which denotes the start of the range and the **UpperValue** property sets the current upper magnitude for the range which denotes the end of the range. These start and end range values are represented through the LowerValue and UpperValue thumbs in the RangeSlider control's UI.

The following image shows the lower and upper magnitudes set at 10 and 80, respectively, as the range values.

![Represents thumb values in RangeSlider](https://cdn.mescius.io/document-site-files/images/f5b600ba-f1a7-4f89-a20c-aa6c0c35880d/images/rangeslider-rangevalue.png)

To set the lower and the upper magnitudes of range values in RangeSlider, use the following code. This example uses the sample created in the [Range](/componentone/docs/blazor/online-blazor/controls/input-controls/rangeslider/rangeslider-range) topic.

```razor
<C1RangeSlider LowerValue=10 UpperValue=80 Minimum=-10 Maximum=100 ></C1RangeSlider>
```