{
    "name": "border_width",
    "label": "Border Width",
    "required": false, // optional
    "help": "Set the border width in pixels", // optional
    "type": "slider",
    "max": 20,
    "min": 0,
    "step": 1,
    "default": 2,
    "suffix": "px", // optional
    "dependencies": [
      {
          "field": "dependent_field",
          "value": "dependent_value" //optional
      }
    ] // optional
  }
  {
    "settings": {
      "border_width": 5
      // ...additional plugin settings
    }
    // ...plugin-specific additional data
  }
The slider provides creators with an intuitive way to select numerical values through a visual slider interface combined with a numerical input box. It’s perfect for precise control over design properties like corner radius, border width, pixel dimensions, or quantities. The dual interface allows creators to either drag the slider for quick adjustments or type exact values for precision. example slider
Fields cannot be dependent on sliders as they always have a value.

Compatibility

Plugin typeAvailabilityAdditional notes
Content blocks
Media source

Properties

type
string
required
slider - the type of the component
name
string
required
A unique internal-only identifier that is posted to an app’s plugin server to share values inputted by the creator
label
string
required
Creator-facing identifier that is shown in the plugin environment (64 character limit)
max
number
required
Maximum value allowed on the slider
min
number
required
Minimum value allowed on the slider
step
number
required
Increment value for slider movement and input validation
default
number
required
Default value when the component first loads
required
boolean
Determines whether the creator must set a value before proceeding, defaults to false
help
string
Brief creator-facing explanation that clarifies the component’s purpose and usage (64 character limit)
suffix
string
Unit or label displayed after the value (3 character limit, defaults to null). If null or absent, the suffix won’t show
dependencies
object array
Allows for the field to be shown conditionally. dependent on other fields. See dependencies page for more details.
  {
    "name": "border_width",
    "label": "Border Width",
    "required": false, // optional
    "help": "Set the border width in pixels", // optional
    "type": "slider",
    "max": 20,
    "min": 0,
    "step": 1,
    "default": 2,
    "suffix": "px", // optional
    "dependencies": [
      {
          "field": "dependent_field",
          "value": "dependent_value" //optional
      }
    ] // optional
  }
  {
    "settings": {
      "border_width": 5
      // ...additional plugin settings
    }
    // ...plugin-specific additional data
  }