Range slider

A slider control for selecting numeric values within a defined range.

The Range field displays a visual slider that users can drag to select a value. This provides an intuitive way to set numeric values within specific boundaries. It’s particularly useful for values like opacity, ratings, or percentages where you want to limit the range and provide visual feedback. The slider makes it easy for users to find the right value without typing.

Preview in Attributes Manager

Fancoolo fields range slider

Range slider field. Preview in Gutenberg Editor

Fancoolo fields in gutenberg range slider

Technical Information:

PropertyValue
Gutenberg UISlider control
Data Typenumber
Default Value0
Min Value0 (set by default)
Max ValueRequired – you set this in Attributes Manager
Best ForConstrained numeric values
Common UsesRatings (1-5), opacity (0-100), volume, brightness