Properties reference

Common

Generic properties

Properties shared by all widgets

widgetgeometrystylevalueoscscripting

property	type	default	description
lock	boolean	false	Set to true to prevent modifying this widget with the editor. This will not prevent deleting the widget or moving it from a container to another.
type	string	"auto"	Widget type
id	string	"auto"	Widgets sharing the same id will act as clones and update each other's value(s) without sending extra osc messages (avoid doing so unless the widgets expect the exact same values).
visible	boolean	true	Set to false to hide the widget.
interaction	boolean	true	Set to false to disable pointer interactions.
comments	string	""	User comments.

property	type	default	description
left	number| string	"auto"	When both top and left are set to auto, the widget is positioned according to the normal flow of the page (from left to right, by order of creation). Otherwise, the widget will be positioned at absolute coordinates
top	number| percentage	"auto"	When both top and left are set to auto, the widget is positioned according to the normal flow of the page (from left to right, by order of creation). Otherwise, the widget will be positioned at absolute coordinates
width	number| percentage	"auto"	Widget width
height	number| percentage	"auto"	Widget height
expand	boolean| number	"false"	If parent's layout is vertical or horizontal, set this to true to stretch the widget to use available space automatically.

property	type	default	description
colorText	string	"auto"	Text color. Set to "auto" to inherit from parent widget.
colorWidget	string	"auto"	Widget's default accent color. Set to "auto" to inherit from parent widget.
colorStroke	string	"auto"	Stroke color. Set to "auto" to use colorWidget.
colorFill	string	"auto"	Fill color. Set to "auto" to use colorWidget.
alphaStroke	number	"auto"	Stroke color opacity.
alphaFillOff	number	"auto"	Fill color opacity (off).
alphaFillOn	number	"auto"	Fill color opacity (on).
lineWidth	number	"auto"	Stroke width.
borderRadius	number| string	"auto"	Border radius expressed as a number or a css string. This property may not work for all widgets.
padding	number	"auto"	Inner spacing.
html	string	""	Custom html content to be inserted in the widget (before the widget's content). Elements are all unstyled by default, css should be used to customize their appearance. The code is automatically wrapped in <div class="html"></div> Allowed HTML tags:   h1-6, blockquote, p, a, ul, ol, nl, li,   b, i, strong, em, strike, code, hr, br, div,   table, thead, img, caption, tbody, tr, th, td, pre Allowed attributes:   <*>: class, style, title, name   <img>: src, width, height
css	string	""	CSS rules. See documentation. Some style-related properties can be set or read from css using css variables: - --color-background: colorBg - --color-widget: colorWidget - --color-fill: colorFill - --color-stroke: colorStroke - --color-text: colorText - --widget-padding: padding - --line-width: lineWidth - --border-radius: borderRadius - --alpha-fill-on: alphaFillOn - --alpha-fill-off: alphaFillOff - --alpha-stroke: alphaStroke

property	type	default	description
value	*	""	Define the widget's value depending on other widget's values / properties using the advanced property syntax
default	*	""	If set, the widget will be initialized with this value when the session is loaded.
linkId	string| array	""	Widgets sharing the same linkId update each other's value(s) AND send their respective osc messages. When prefixed with >>, the linkId will make the widget act as a master (sending but not receiving) When prefixed with <<, the linkId will make the widget act as a slave (receiving but not sending)

property	type	default	description
address	string	"auto"	OSC address for sending / receiving messages, it must start with a slash (/) By default ("auto"), the widget's id is used: /widget_id
preArgs	*| array	""	A value or array of values that will be prepended to the widget's value in the OSC messages it sends. Incoming messages must match these to affect by the widget.
typeTags	string	""	Defines the osc argument types, one letter per argument (including preArgs) - If empty, the types are inferred automatically from the values (with numbers casted to floats by default) - If there are more arguments than type letters, the last type is used for the extra arguments See OSC 1.0 specification for existing typetags
decimals	integer	2	Defines the number of decimals to send.
target	string| array| null	""	This defines the targets of the widget's OSC messages - A string or array of strings formatted as follow: ip:port or ["ip:portA", "ip:portB"] - If midi is enabled, targets can be midi:device_name - If no target is set, messages can still be sent if the server has default targets
ignoreDefaults	boolean	false	Set to true to ignore the server's default targets
bypass	boolean	false	Set to true to prevent the widget from sending any osc message

property	type	default	description
onCreate	script	""	Script executed when the widget (and its children) is created. See documentation.
onValue	script	""	Script executed when the widget's value updates. See documentation.

Basics

button

On / off button.

stylebuttonscripting

property	type	default	description
css	string	""	CSS rules. See documentation. Some style-related properties can be set or read from css using css variables: - --color-background: colorBg - --color-widget: colorWidget - --color-fill: colorFill - --color-stroke: colorStroke - --color-text: colorText - --widget-padding: padding - --line-width: lineWidth - --border-radius: borderRadius - --alpha-fill-on: alphaFillOn - --alpha-fill-off: alphaFillOff - --alpha-stroke: alphaStroke - --color-text-on: colorTextOn
colorTextOn	string	"auto"	Defines the widget's text color when active.
label	string| boolean	"auto"	Set to false to hide completely - Insert icons using the prefix ^ followed by the icon's name : ^play, ^pause, etc (see https://fontawesome.com/search?m=free&s=solid - Icons can be transformed with the following suffixes: .flip-[horizontal|vertical|both], .rotate-[90|180|270], .spin, .pulse. Example: ^play.flip-horizontal
vertical	boolean	false	Set to true to display the text vertically
wrap	boolean| string	false	Set to true to wrap long lines automatically. Set to soft to avoid breaking words. Choices: false, true, soft

property	type	default	description
on	*	1	Set to null to send send no argument in the osc message. Ignored if mode is momentary.
off	*	0	Set to null to send send no argument in the osc message. Must be different from on. Ignored if mode is momentary or tap.
mode	string	"toggle"	Interaction mode: - toggle (classic on/off switch) - push (press & release) - momentary (no release, no value sent with the address) - tap (no release, sends on as value) Choices: toggle, push, momentary, tap
doubleTap	boolean	false	Set to true to make the button require a double tap to be pushed instead of a single tap
decoupled	boolean	false	Set to true make the local feedback update only when it receives a value from an osc/midi message that matches the on or off property. When decoupled, the button's value is ambiguous: when interacted with, it will send the value that's requested (on or off for toggle and push modes, on for tap mode, null for momentary), otherwise it will return the value received from the feedback message (on or off property). From a script property, feedback messages can be simulated with: set("widget_id", value, {external: true})

property	type	default	description
onValue	script	""	Script executed when the widget's value updates. See documentation. Additional variables: - locals.touchCoords: [x, y] array representing the touch coordinates, normalized between 0 and 1. - locals.external: true if value was received from an osc/midi message, false otherwise.

switch

Value selector button.

styleswitch

property	type	default	description
css	string	""	CSS rules. See documentation. Some style-related properties can be set or read from css using css variables: - --color-background: colorBg - --color-widget: colorWidget - --color-fill: colorFill - --color-stroke: colorStroke - --color-text: colorText - --widget-padding: padding - --line-width: lineWidth - --border-radius: borderRadius - --alpha-fill-on: alphaFillOn - --alpha-fill-off: alphaFillOff - --alpha-stroke: alphaStroke - --color-text-on: colorTextOn
colorTextOn	string	"auto"	Defines the widget's text color when active.
layout	string	"vertical"	Defines how items should be laid out Choices: vertical, horizontal, grid
gridTemplate	string| number	""	If layout is grid, can be either a number of columns or a valid value for the css property "grid-template".
wrap	boolean| string	false	Set to true to wrap long lines automatically. Set to soft to avoid breaking words. Choices: false, true, soft

property	type	default	description
values	array| object	{  "Value 1": 1,  "Value 2": 2 }	Array of possible values to switch between : [1,2,3] Object of "label":value pairs. Numeric labels must be prepended or appended with a white space (or any other non-numeric character) otherwise the order of the values won't be kept {"labels": [], "values": []} object where labels and values arrays must be of the same length. This syntax allows using the same label for different values.
mode	string	"tap"	Interaction mode: - tap: activates when the pointer is down but prevents further scrolling - slide: same as tap but allows sliding between values - click: activates upon click only and allows further scrolling - flip: selects the next value upon click regardless of where the widget is touched Choices: tap, slide, click, flip

dropdown

Native dropdown menu.

styledropdown

property	type	default	description
label	string| boolean	"auto"	Displayed text (defaults to current value). Keywords %key and %value will be replaced by the widget's selected key/value.
icon	boolean	"true"	Set to false to hide the dropdown icon
align	string	"center"	Set to left or right to change text alignment (otherwise center) Choices: center, left, right

property	type	default	description
values	array| object	{  "Value 1": 1,  "Value 2": 2 }	Array of possible values to switch between : [1,2,3] Object of label:value pairs. Numeric labels must be prepended or appended with a white space (or any other non-numeric character) otherwise the order of the values won't be kept {"labels": [], "values": []} object where labels and values arrays must be of the same length. This syntax allows using the same label for different values.

menu

Drag and drop menu with a circular or grid layout.

geometrystylemenu

property	type	default	description
size	number| array	200	- If layout is circular: diameter (in px) - Else: square size or [width, height] array
ignoreTabs	boolean	false	Set to true to allow the menu overflowing its tab ancestors.

property	type	default	description
label	string| boolean	"auto"	Displayed text (defaults to current value). Keywords %key and %value will be replaced by the widget's selected key/value.
icon	boolean	"true"	Set to false to hide the dropdown icon
textAlign	string	"center"	Set to left or right to change text alignment (otherwise center) Choices: center, left, right
menuAlignV	string	"center"	Set to top or bottom to change menu alignment (otherwise center) Choices: center, top, bottom
menuAlignH	string	"center"	Set to left or right to change menu alignment (otherwise center) Choices: center, left, right
layout	string	"circular"	Defines whether the menu's layout should be rendered in a circle or in a box Choices: circular, horizontal, vertical, grid
gridTemplate	string| number	""	If layout is grid, can be either a number of columns or a valid value for the css property "grid-template".

property	type	default	description
mode	string	"default"	Interaction modes: - default: opens on touch, closes and changes value on release - toggle: opens on click, closes and changes value on next click - swipe: opens on touch, changes value when the pointer moves above items, closes on release - doubleTap: same as default but opens on double tap - doubleTap-toggle: same as toggle but opens on double tap Choices: default, toggle, swipe, doubleTap, doubleTap-toggle
values	array| object	[  1,  2,  3 ]	Array of possible values to switch between : [1,2,3] Object of label:value pairs. Numeric labels must be prepended or appended with a white space (or any other non-numeric character) otherwise the order of the values won't be kept {"labels": [], "values": []} object where labels and values arrays must be of the same length. This syntax allows using the same label for different values.
weights	array	""	Array of number defining the weights of each value in values Ignored when mode is grid

input

Text input.

styleinputscripting

property	type	default	description
css	string	""	CSS rules. See documentation. Some style-related properties can be set or read from css using css variables: - --color-background: colorBg - --color-widget: colorWidget - --color-fill: colorFill - --color-stroke: colorStroke - --color-text: colorText - --widget-padding: padding - --line-width: lineWidth - --border-radius: borderRadius - --alpha-fill-on: alphaFillOn - --alpha-fill-off: alphaFillOff - --alpha-stroke: alphaStroke - --alpha-pips: alphaPips - --alpha-pips-text: alphaPipsText Canvas-based widget have their computed width and height available as css variables (read-only): - --widget-width - --widget-height
align	string	"center"	Set to left or right to change text alignment (otherwise center) Choices: center, left, right
unit	string	""	Unit will be appended to the displayed widget's value (it doesn't affect osc messages)

property	type	default	description
asYouType	boolean	false	Set to true to make the input send its value at each keystroke
numeric	boolean| number	false	Set to true to allow numeric values only and display a numeric keyboard on mobile devices Can be a number to specify the stepping value for mousewheel interaction (only when the input is focused).
validation	string	""	Regular expression: if the submitted value doesn't match the regular expression, it will be reset to the last valid value. If leading and trailing slashes are omitted, they will be added automatically and the flag will be set to "gm" Examples: - ^[0-9]*$ accepts digits only, any number of them - /^[a-zs]{0,10}$/i accept between 0 and 10 alphabetic characters and spaces (case insensitive)
maxLength	number	""	Maximum number of characters allowed

property	type	default	description
onValue	script	""	Script executed when the widget's value updates. See documentation. Canvas-based widget have their computed width and height available as local variables: - locals.width - locals.height

textarea

Text area (multi line input). Tip: hit shift + enter for new lines.

file

File/Folder selector (server-side).

stylefile

property	type	default	description
align	string	"center"	Set to left or right to change text alignment (otherwise center) Choices: center, left, right
hidePath	boolean	false	Set to true to only display the filename (the whole path will still be used as value)
mode	string	"open"	File browser mode Choices: open, save

property	type	default	description
directory	string	"auto"	Default browsing directory
extension	string	"*"	Only display files with this extension
allowDir	boolean	false	Allow selecting a folder (by pressing "open" when no file is selected)

Containers

panel

Widgets or Tabs container.

stylepanelvaluechildren

property	type	default	description
colorBg	string	"auto"	Panel background color. Set to "auto" to inherit from parent widget.
layout	string	"default"	Defines how children are laid out. Choices: default, vertical, horizontal, grid
justify	string	"start"	If layout is vertical or horizontal, defines how widgets should be justified. Choices: start, end, center, space-around, space-between
gridTemplate	string| number	""	If layout is grid, can be either a number of columns or a valid value for the css property "grid-template".
contain	boolean	true	If layout is vertical or horizontal, prevents children from overflowing the panel.
scroll	boolean	true	Set to false to disable scrollbars
innerPadding	boolean	true	Set to false to make the padding property apply only between children and not at the container's inner boundaries.
tabsPosition	string	"top"	Defines the position of the navigation bar if the panel contains tabs Choices: top, bottom, left, right

property	type	default	description
variables	*	"@{parent.variables}"	Defines one or more arbitrary variables that can be inherited by children widgets
traversing	boolean	false	Set to true to enable traversing gestures in this widget. Set to smart to limit affected widgets by the type of the first touched widget Choices: false, true, smart

property	type	default	description
value	integer| array	""	If the panel contains tabs, its value defines which tab is selected selected (by index, starting with 0). If the panel contains widgets and scroll is true, its value is an array that contains the scrolling state between 0 and 1 for the x and y axis.

property	type	default	description
widgets	array	[]	Each element of the array must be a widget object. A panel cannot contain widgets and tabs simultaneously.
tabs	array	[]	Each element of the array must be a tab object. A panel cannot contain widgets and tabs simultaneously

modal

A toggle button that opens a popup panel. Cannot contain tabs directly.

geometrystylemodalvaluechildren

property	type	default	description
popupWidth	number| percentage	"80%"	Modal popup's size
popupHeight	number| percentage	"80%"	Modal popup's size
popupLeft	number| percentage	"auto"	Modal popup's position
popupTop	number| percentage	"auto"	Modal popup's position
relative	boolean	false	Set to true to make the modal's position relative to the button's position.
ignoreTabs	boolean	false	Set to true to allow the modal overflowing its tab ancestors.

property	type	default	description
colorBg	string	"auto"	Panel background color. Set to "auto" to inherit from parent widget.
layout	string	"default"	Defines how children are laid out. Choices: default, vertical, horizontal, grid
justify	string	"start"	If layout is vertical or horizontal, defines how widgets should be justified. Choices: start, end, center, space-around, space-between
gridTemplate	string| number	""	If layout is grid, can be either a number of columns or a valid value for the css property "grid-template".
contain	boolean	true	If layout is vertical or horizontal, prevents children from overflowing the panel.
scroll	boolean	true	Set to false to disable scrollbars
innerPadding	boolean	true	Set to false to make the padding property apply only between children and not at the container's inner boundaries.
tabsPosition	string	"top"	Defines the position of the navigation bar if the panel contains tabs Choices: top, bottom, left, right
label	string| boolean	"auto"	Set to false to hide completely - Insert icons using the prefix ^ followed by the icon's name : ^play, ^pause, etc (see https://fontawesome.com/icons?d=gallery&s=solid&m=free) - Icons can be transformed with the following suffixes: .flip-[horizontal|vertical|both], .rotate-[90|180|270], .spin, .pulse. Example: ^play.flip-horizontal
popupLabel	string| boolean	"auto"	Alternative label for the modal popup
popupPadding	number	"auto"	Modal's inner spacing.

property	type	default	description
variables	*	"@{parent.variables}"	Defines one or more arbitrary variables that can be inherited by children widgets
traversing	boolean	false	Set to true to enable traversing gestures in this widget. Set to smart to limit affected widgets by the type of the first touched widget Choices: false, true, smart
doubleTap	boolean	false	Set to true to make the modal require a double tap to open instead of a single tap

property	type	default	description
value	integer	""	Defines the modal's state:0 for closed, 1 for opened

property	type	default	description
widgets	array	[]	Each element of the array must be a widget object. A panel cannot contain widgets and tabs simultaneously.
tabs	array	[]	Each element of the array must be a tab object. A panel cannot contain widgets and tabs simultaneously

clone

Widget replication with overridable properties.

clone

property	type	default	description
widgetId	string	""	id of the widget to clone
props	object	{}	Cloned widget's properties to override

fragment

Embedded session or fragment file with overridable properties.

fragment

property	type	default	description
file	string	""	Fragment file path (relative to the session or theme file location by default, falling back to absolute path)
fallback	string	""	Fallack fragment file path, loaded if file can't be opened
props	object	{}	Fragment widget's properties to override

matrix

Generic matrix for creating rows/columns of widgets.

stylematrixvaluechildren

property	type	default	description
colorBg	string	"auto"	Panel background color. Set to "auto" to inherit from parent widget.
layout	string	"horizontal"	Defines how children are laid out. Choices: horizontal, vertical, grid
justify	string	"start"	If layout is vertical or horizontal, defines how widgets should be justified. Choices: start, end, center, space-around, space-between
gridTemplate	string| number	""	If layout is grid, can be either a number of columns or a valid value for the css property "grid-template".
contain	boolean	true	If layout is vertical or horizontal, prevents children from overflowing the panel.
scroll	boolean	true	Set to false to disable scrollbars
innerPadding	boolean	true	Set to false to make the padding property apply only between children and not at the container's inner boundaries.
tabsPosition	string	"top"	Defines the position of the navigation bar if the panel contains tabs Choices: top, bottom, left, right

property	type	default	description
variables	*	"@{parent.variables}"	Defines one or more arbitrary variables that can be inherited by children widgets
traversing	boolean	false	Set to true to enable traversing gestures in this widget. Set to smart to limit affected widgets by the type of the first touched widget Choices: false, true, smart
widgetType	string	"button"	Defines the type of the widgets in the matrix
quantity	number	4	Defines the number of widgets in the matrix
props	object	{}	Defines a set of property to override the widgets' defaults. JS{} and #{} blocks in this field are resolved with an extra variable representing each widget's index: $ (e.g. #{$}) Advanced syntax blocks (@{}, OSC{}, JS{}, VAR{} and #{}) are resolved at the matrix' scope (ie @{this.variables} returns the matrix' variables property) Advanced syntax blocks can be passed to children without being resolved at the matrix' scope by adding an underscore before the opening bracket. Note: unless overridden, children inherit from the matrix' id and osc properties (id and address are appended with /$)

property	type	default	description
value	integer| array	""	If the panel contains tabs, its value defines which tab is selected selected (by index, starting with 0). If the panel contains widgets and scroll is true, its value is an array that contains the scrolling state between 0 and 1 for the x and y axis.

property	type	default	description
widgets	array	[]	Each element of the array must be a widget object. A panel cannot contain widgets and tabs simultaneously.
tabs	array	[]	Each element of the array must be a tab object. A panel cannot contain widgets and tabs simultaneously

keyboard

Piano keyboard.

stylekeyboardvalue

property	type	default	description
colorWhite	string	"auto"	White keys color.
colorBlack	string	"auto"	Black keys color.

property	type	default	description
keys	number	25	Defines the number keys
start	number	48	MIDI note number to start with (default is C4) Standard keyboards settings are: [25, 48], [49, 36], [61, 36], [88, 21]
traversing	boolean	true	Set to false to disable traversing gestures
on	*	1	Set to null to send send no argument in the osc message
off	*	0	Set to null to send send no argument in the osc message
velocity	boolean	false	Set to true to map the touch coordinates between off (top) and on (bottom). Requires on and off to be numbers
mode	string	"push"	Interaction mode: - push (press & release) - toggle (on/off switches) - tap (no release) Choices: push, toggle, tap

property	type	default	description
value	array	""	The keyboard widget accepts the following values: - a [note, value] array to set the value of a single key where note is the note number and value depends on the on and off properties (any value different from off will be interpreted as on). - an array of values with one item per key in the keyboard

patchbay

Connect inputs to outputs.

stylepatchbayscripting

property	type	default	description
css	string	""	CSS rules. See documentation. Some style-related properties can be set or read from css using css variables: - --color-background: colorBg - --color-widget: colorWidget - --color-fill: colorFill - --color-stroke: colorStroke - --color-text: colorText - --widget-padding: padding - --line-width: lineWidth - --border-radius: borderRadius - --alpha-fill-on: alphaFillOn - --alpha-fill-off: alphaFillOff - --alpha-stroke: alphaStroke - --alpha-pips: alphaPips - --alpha-pips-text: alphaPipsText Canvas-based widget have their computed width and height available as css variables (read-only): - --widget-width - --widget-height

property	type	default	description
inputs	array| object	[  "input_1",  "input_2" ]	- Array of input names : ['input_1', 'input_2'] - Object of "label_1": "input_1" pairs (example: {"label a": "value 1", "label b": "value 2"}). Numeric labels must be prepended or appended with a white space (or any other non-numeric character) otherwise the order of the values won't be kept Patchbay inputs can be connected to one or more outputs and will send messages of the following form when they are connected/disconnected: /patchbay_address input_x output_x output_y etc If no output is connected to the input, the message will be /patchbay_address input_x The inputs values can be consumed with the property inheritance syntax: @{patchbay_id/input_1} returns an array of output names connected to input_1
outputs	array| object	[  "output_1",  "output_2" ]	List of output values the inputs can connect to (see inputs).
exclusive	string	false	- in: allows only one connection per input - out: allows only one connection per output - both: allows only one connection per input and output Choices: false, in, out, both

property	type	default	description
onValue	script	""	Script executed when the widget's value updates. See documentation. Canvas-based widget have their computed width and height available as local variables: - locals.width - locals.height

folder

Flat container that doesn't affect layout. Mostly useful for grouping widgets in the tree.

folderchildren

property	type	default	description
variables	*	"@{parent.variables}"	Defines one or more arbitrary variables that can be inherited by children widgets

property	type	default	description
widgets	array	[]	Each element of the array must be a widget object. A panel cannot contain widgets and tabs simultaneously.
tabs	array	[]	Each element of the array must be a tab object. A panel cannot contain widgets and tabs simultaneously

root

Main (unique) container

stylerootvaluescriptingchildren

property	type	default	description
colorBg	string	"auto"	Panel background color. Set to "auto" to inherit from parent widget.
layout	string	"default"	Defines how children are laid out. Choices: default, vertical, horizontal, grid
justify	string	"start"	If layout is vertical or horizontal, defines how widgets should be justified. Choices: start, end, center, space-around, space-between
gridTemplate	string| number	""	If layout is grid, can be either a number of columns or a valid value for the css property "grid-template".
contain	boolean	true	If layout is vertical or horizontal, prevents children from overflowing the panel.
scroll	boolean	true	Set to false to disable scrollbars
innerPadding	boolean	true	Set to false to make the padding property apply only between children and not at the container's inner boundaries.
tabsPosition	string	"top"	Defines the position of the navigation bar if the panel contains tabs Choices: top, bottom, left, right
hideMenu	boolean	false	Set to true to hide the main menu button.

property	type	default	description
variables	*	"@{parent.variables}"	Defines one or more arbitrary variables that can be inherited by children widgets
traversing	boolean	false	Set to true to enable traversing gestures in this widget. Set to smart to limit affected widgets by the type of the first touched widget Choices: false, true, smart

property	type	default	description
value	integer| array	""	If the panel contains tabs, its value defines which tab is selected selected (by index, starting with 0). If the panel contains widgets and scroll is true, its value is an array that contains the scrolling state between 0 and 1 for the x and y axis.

property	type	default	description
onPreload	script	""	Script executed before any other widget is created. See documentation.

property	type	default	description
widgets	array	[]	Each element of the array must be a widget object. A panel cannot contain widgets and tabs simultaneously.
tabs	array	[]	Each element of the array must be a tab object. A panel cannot contain widgets and tabs simultaneously

tab

Tabbed panel widget

styletabvaluechildren

property	type	default	description
colorBg	string	"auto"	Panel background color. Set to "auto" to inherit from parent widget.
layout	string	"default"	Defines how children are laid out. Choices: default, vertical, horizontal, grid
justify	string	"start"	If layout is vertical or horizontal, defines how widgets should be justified. Choices: start, end, center, space-around, space-between
gridTemplate	string| number	""	If layout is grid, can be either a number of columns or a valid value for the css property "grid-template".
contain	boolean	true	If layout is vertical or horizontal, prevents children from overflowing the panel.
scroll	boolean	true	Set to false to disable scrollbars
innerPadding	boolean	true	Set to false to make the padding property apply only between children and not at the container's inner boundaries.
tabsPosition	string	"top"	Defines the position of the navigation bar if the panel contains tabs Choices: top, bottom, left, right
label	string| boolean	"auto"	Set to false to hide completely - Insert icons using the prefix ^ followed by the icon's name : ^play, ^pause, etc (see https://fontawesome.com/icons?d=gallery&s=solid&m=free) - Icons can be transformed with the following suffixes: .flip-[horizontal|vertical|both], .rotate-[90|180|270], .spin, .pulse. Example: ^play.flip-horizontal

property	type	default	description
variables	*	"@{parent.variables}"	Defines one or more arbitrary variables that can be inherited by children widgets
traversing	boolean	false	Set to true to enable traversing gestures in this widget. Set to smart to limit affected widgets by the type of the first touched widget Choices: false, true, smart

property	type	default	description
value	integer| array	""	If the panel contains tabs, its value defines which tab is selected selected (by index, starting with 0). If the panel contains widgets and scroll is true, its value is an array that contains the scrolling state between 0 and 1 for the x and y axis.

property	type	default	description
widgets	array	[]	Each element of the array must be a widget object. A panel cannot contain widgets and tabs simultaneously.
tabs	array	[]	Each element of the array must be a tab object. A panel cannot contain widgets and tabs simultaneously

Frames

frame

Embed a web page in a frame.

value

property	type	default	description
value	string	""	External web page URL.

svg

Svg parser.

svg

property	type	default	description
svg	string	""	Svg xml definition (will be wrapped in a < svg /> element)

html

Simple HTML parser.

image

Load a image (url or base64-encoded).

styleimagevalue

property	type	default	description
size	string	"cover"	CSS background-size Choices: cover, contain, auto
position	string	"center"	CSS background-position Choices: center, left, right, top, bottom, left top, left bottom, right top, right bottom
repeat	string	"no-repeat"	CSS background-repeat Choices: no-repeat, repeat, repeat-x, repeat-y, space, round

property	type	default	description
cache	boolean	true	Set to false to disable image caching (forces file reload when updating or editing the widget). When true, sending reload to the widget reloads its image without changing its value

property	type	default	description
value	string	""	- File url or path (relative to the session or theme file location by default, falling back to absolute path) - Base64 encoded image : data:image/... - Enter "qrcode" to display the server's address QR code

Graphs

plot

XY coordinates plot.

styleplotvaluescripting

property	type	default	description
css	string	""	CSS rules. See documentation. Some style-related properties can be set or read from css using css variables: - --color-background: colorBg - --color-widget: colorWidget - --color-fill: colorFill - --color-stroke: colorStroke - --color-text: colorText - --widget-padding: padding - --line-width: lineWidth - --border-radius: borderRadius - --alpha-fill-on: alphaFillOn - --alpha-fill-off: alphaFillOff - --alpha-stroke: alphaStroke - --alpha-pips: alphaPips - --alpha-pips-text: alphaPipsText Canvas-based widget have their computed width and height available as css variables (read-only): - --widget-width - --widget-height
dots	boolean	false	Draw dots on the line
bars	boolean	false	Set to true to use draw bars instead (disables logScaleX and forces x axis even spacing)
pips	boolean	true	Set to false to hide the scale

property	type	default	description
rangeX	object	{  "min": 0,  "max": 1 }	Defines the min and max values for the x axis
rangeY	object	{  "min": 0,  "max": 1 }	Defines the min and max values for the y axis
logScaleX	boolean| number	false	Set to true to use logarithmic scale for the x axis. Set to -1 for exponential scale.
logScaleY	boolean| number	false	Set to true to use logarithmic scale for the y axis. Set to -1 for exponential scale.
origin	number| boolean	"auto"	Defines the y axis origin. Set to false to disable it

property	type	default	description
value	array| string	""	- Array of y values: [y1, y2, ...] - Array of [x, y] array values: [[x1 , y1], [x2, y2], ...] - String array: "[y1, y2, ...]" or "[[x1 , y1], [x2, y2], ...]" - String object to update specific coordinates only: "{0: y1, 1: y2}" or "{0: [x1, y1], 1: [x2, y2]}"

property	type	default	description
onValue	script	""	Script executed when the widget's value updates. See documentation. Canvas-based widget have their computed width and height available as local variables: - locals.width - locals.height

eq

Draws logarithmic frequency response from an array of filter objects.

styleeqvaluescripting

property	type	default	description
css	string	""	CSS rules. See documentation. Some style-related properties can be set or read from css using css variables: - --color-background: colorBg - --color-widget: colorWidget - --color-fill: colorFill - --color-stroke: colorStroke - --color-text: colorText - --widget-padding: padding - --line-width: lineWidth - --border-radius: borderRadius - --alpha-fill-on: alphaFillOn - --alpha-fill-off: alphaFillOff - --alpha-stroke: alphaStroke - --alpha-pips: alphaPips - --alpha-pips-text: alphaPipsText Canvas-based widget have their computed width and height available as css variables (read-only): - --widget-width - --widget-height
dots	boolean	false	Draw dots on the line
bars	boolean	false	Set to true to use draw bars instead (disables logScaleX and forces x axis even spacing)
pips	boolean	true	Set to false to hide the scale

property	type	default	description
rangeX	object	{  "min": 20,  "max": 22000 }	Defines the min and max values for the x axis (in Hz, logarithmic scale)
rangeY	object	{  "min": -6,  "max": 6 }	Defines the min and max values for the y axis (in dB)
logScaleX	boolean| number	false	Set to true to use logarithmic scale for the x axis. Set to -1 for exponential scale.
logScaleY	boolean| number	false	Set to true to use logarithmic scale for the y axis. Set to -1 for exponential scale.
origin	number| boolean	"auto"	Defines the y axis origin. Set to false to disable it
filters	array	""	Each item must be an object with the following properties - type: string ("highpass", "highshelf", "lowpass", "lowshelf", "peak", "bandpass" or "notch", default: "peak") - freq: number (filter's resonant frequency, default: 1000) - q: number (Q factor, default: 1) - gain: number (default: 0) - on: boolean (default: true) See https://developer.mozilla.org/en-US/docs/Web/API/BiquadFilterNode
pips	boolean	true	Set to false to hide the scale

property	type	default	description
value	array| string	""	- Array of y values: [y1, y2, ...] - Array of [x, y] array values: [[x1 , y1], [x2, y2], ...] - String array: "[y1, y2, ...]" or "[[x1 , y1], [x2, y2], ...]" - String object to update specific coordinates only: "{0: y1, 1: y2}" or "{0: [x1, y1], 1: [x2, y2]}"

property	type	default	description
onValue	script	""	Script executed when the widget's value updates. See documentation. Canvas-based widget have their computed width and height available as local variables: - locals.width - locals.height

visualizer

Display its value over time.

stylevisualizervaluescripting

property	type	default	description
css	string	""	CSS rules. See documentation. Some style-related properties can be set or read from css using css variables: - --color-background: colorBg - --color-widget: colorWidget - --color-fill: colorFill - --color-stroke: colorStroke - --color-text: colorText - --widget-padding: padding - --line-width: lineWidth - --border-radius: borderRadius - --alpha-fill-on: alphaFillOn - --alpha-fill-off: alphaFillOff - --alpha-stroke: alphaStroke - --alpha-pips: alphaPips - --alpha-pips-text: alphaPipsText Canvas-based widget have their computed width and height available as css variables (read-only): - --widget-width - --widget-height
pips	boolean	true	Set to false to hide the scale

property	type	default	description
rangeX	object	{  "min": 0,  "max": 1 }	Defines the min and max values for the x axis
rangeY	object	{  "min": 0,  "max": 1 }	Defines the min and max values for the y axis
logScaleX	boolean| number	false	Set to true to use logarithmic scale for the x axis. Set to -1 for exponential scale.
logScaleY	boolean| number	false	Set to true to use logarithmic scale for the y axis (base 10). Set to a number to define the logarithm's base.
origin	number	"auto"	Defines the y axis origin. Set to false to disable it
duration	number	1	Defines visualization duration in seconds
framerate	number	30	Defines visualization framerate
freeze	boolean	false	Set to true to freeze current view and ignore incoming values

property	type	default	description
value	array| string	""	- Array of y values: [y1, y2, ...] - Array of [x, y] array values: [[x1 , y1], [x2, y2], ...] - String array: "[y1, y2, ...]" or "[[x1 , y1], [x2, y2], ...]" - String object to update specific coordinates only: "{0: y1, 1: y2}" or "{0: [x1, y1], 1: [x2, y2]}"

property	type	default	description
onValue	script	""	Script executed when the widget's value updates. See documentation. Canvas-based widget have their computed width and height available as local variables: - locals.width - locals.height

Indicators

led

Intensity display.

ledvalue

property	type	default	description
mode	string	"intensity"	Defines how value is interpreted (see value) Choices: intensity, color
range	object	{  "min": 0,  "max": 1 }	Value range
alphaRange	object	{  "min": 0,  "max": 1 }	Alpha range (if mode is color)
logScale	boolean	false	If mode is intensity, set to true to use logarithmic scale.

property	type	default	description
value	number| array| string	""	If mode is intensity: - Number: intensity between range.min and range.max If mode is color: - Array: [r, g, b] (r, g and b between range.min and range.max) - Array: [r, g, b, alpha] (alpha between alphaRange.min and alphaRange.max) - String: CSS color

text

Display text.

style

property	type	default	description
vertical	boolean	false	Set to true to display the text vertically
wrap	boolean| string	false	Set to true to wrap long lines automatically. Set to soft to avoid breaking words. Choices: false, true, soft
align	string	"center"	Text alignment. Choices: center, left, right, top, bottom, left top, left bottom, right top, right bottom

Pads

xy

Two-dimensional slider.

stylexyscripting

property	type	default	description
css	string	""	CSS rules. See documentation. Some style-related properties can be set or read from css using css variables: - --color-background: colorBg - --color-widget: colorWidget - --color-fill: colorFill - --color-stroke: colorStroke - --color-text: colorText - --widget-padding: padding - --line-width: lineWidth - --border-radius: borderRadius - --alpha-fill-on: alphaFillOn - --alpha-fill-off: alphaFillOff - --alpha-stroke: alphaStroke - --alpha-pips: alphaPips - --alpha-pips-text: alphaPipsText Canvas-based widget have their computed width and height available as css variables (read-only): - --widget-width - --widget-height
pointSize	integer	20	Defines the points' size
ephemeral	boolean	false	When set to true, the point will be drawn only while touched.
pips	boolean	true	Set to false to hide the scale

property	type	default	description
snap	boolean	false	By default, the points are dragged from their initial position. If set to true, touching anywhere on the widget's surface will make them snap to the touching coordinates
spring	boolean	false	When set to true, the widget will go back to its default value when released
rangeX	object	{  "min": 0,  "max": 1 }	Defines the min and max values for the x axis
rangeY	object	{  "min": 0,  "max": 1 }	Defines the min and max values for the y axis
logScaleX	boolean| number	false	Set to true to use logarithmic scale for the x axis. Set to -1 for exponential scale.
logScaleY	boolean| number	false	Set to true to use logarithmic scale for the y axis. Set to -1 for exponential scale.
axisLock	string	""	Restrict movements to one of the axes only unless Shift is held. When left to the default value, holding Shift while dragging will lock the pad according the first movement. Choices: `,x,y`
doubleTap	boolean| string	false	Set to true to make the fader reset to its default value when receiving a double tap. Can also be an osc address, which case the widget will just send an osc message: /<doubleTap> <preArgs>
sensitivity	number	1	Defines the pad's sensitivity when snap is false

property	type	default	description
onValue	script	""	Script executed when the widget's value updates. See documentation. Canvas-based widget have their computed width and height available as local variables: - locals.width - locals.height
onTouch	script	""	Script executed when the widget is touched and released. See documentation.

rgb

Color picker with optional alpha slider.

rgbscripting

property	type	default	description
snap	boolean	false	By default, the points are dragged from their initial position. If set to true, touching anywhere on the widget's surface will make them snap to the touching coordinates
spring	boolean	false	When set to true, the widget will go back to its default value when released
range	object	{  "min": 0,  "max": 255 }	Defines the widget's output scale.
alpha	boolean	false	Set to true to enable alpha channel
rangeAlpha	object	{  "min": 0,  "max": 1 }	Defines the widget's output scale for the alpha channel.

property	type	default	description
onTouch	script	""	Script executed when the widget is touched and released. See documentation.

multixy

Multi-point XY pad.

stylemultixyscripting

property	type	default	description
css	string	""	CSS rules. See documentation. Some style-related properties can be set or read from css using css variables: - --color-background: colorBg - --color-widget: colorWidget - --color-fill: colorFill - --color-stroke: colorStroke - --color-text: colorText - --widget-padding: padding - --line-width: lineWidth - --border-radius: borderRadius - --alpha-fill-on: alphaFillOn - --alpha-fill-off: alphaFillOff - --alpha-stroke: alphaStroke - --alpha-pips: alphaPips - --alpha-pips-text: alphaPipsText Canvas-based widget have their computed width and height available as css variables (read-only): - --widget-width - --widget-height
pointSize	integer	20	Defines the points' size
ephemeral	boolean	false	When set to true, the points will be drawn only while touched.
pips	boolean	true	Set to false to hide the scale

property	type	default	description
points	integer| array	2	Defines the number of points on the pad Can be an array of strings that will be used as labels for the points (ex: ['A', 'B'])
snap	boolean	false	By default, the points are dragged from their initial position. If set to true, touching anywhere on the widget's surface will make them snap to the touching coordinates
spring	boolean	false	When set to true, the widget will go back to its default value when released
rangeX	object	{  "min": 0,  "max": 1 }	Defines the min and max values for the x axis
rangeY	object	{  "min": 0,  "max": 1 }	Defines the min and max values for the y axis
logScaleX	boolean| number	false	Set to true to use logarithmic scale for the x axis. Set to -1 for exponential scale.
logScaleY	boolean| number	false	Set to true to use logarithmic scale for the y axis. Set to -1 for exponential scale.
axisLock	string	""	Restrict movements to one of the axes only. When left to the default value, holding Shift while dragging will lock the pad according the first movement. Choices: `,x,y`
doubleTap	boolean| string	false	Set to true to make the fader reset to its default value when receiving a double tap. Can also be an osc address, which case the widget will just send an osc message: /<doubleTap> <preArgs>
sensitivity	number	1	Defines the pad's sensitivity when snap is false

property	type	default	description
onValue	script	""	Script executed when the widget's value updates. See documentation. Canvas-based widget have their computed width and height available as local variables: - locals.width - locals.height
onTouch	script	""	Script executed when the widget is touched and released. See documentation.

canvas

Multitouch canvas widget with user-defined drawing functions and touch reactions.

stylecanvasscripting

property	type	default	description
css	string	""	CSS rules. See documentation. Some style-related properties can be set or read from css using css variables: - --color-background: colorBg - --color-widget: colorWidget - --color-fill: colorFill - --color-stroke: colorStroke - --color-text: colorText - --widget-padding: padding - --line-width: lineWidth - --border-radius: borderRadius - --alpha-fill-on: alphaFillOn - --alpha-fill-off: alphaFillOff - --alpha-stroke: alphaStroke - --alpha-pips: alphaPips - --alpha-pips-text: alphaPipsText Canvas-based widget have their computed width and height available as css variables (read-only): - --widget-width - --widget-height

property	type	default	description
valueLength	number	1	Defines the number of values accepted by the widget (minimum 1). Incoming messages that don't comply will be ignored When calling set() from a script, submitted value should be an array only if valueLength is greater than 1.
autoClear	boolean	true	If set to false, the canvas context won't be cleared automatically and ctx.clear() will need to be called in onDraw.
continuous	boolean| number	false	If set to true, onDraw will be called at each frame, otherwise it will be called only when the widget is touched and when it receives a value. Can be a number between 1 and 60 to specify the framerate (default: 30 fps).

property	type	default	description
onCreate	script	""	Script executed when the widget is created. See documentation.
onValue	script	""	Script executed whenever the widget's value updates. See documentation.
onTouch	script	""	Script executed when the widget is touched and released, and when the pointer moves when the widget is touched. See documentation.
onDraw	script	""	Script executed when the widget is redrawn. See documentation.
onResize	script	""	Script executed when the widget is resized. See documentation.

Sliders

fader

Vertical / horizontal slider.

stylefaderscripting

property	type	default	description
css	string	""	CSS rules. See documentation. Some style-related properties can be set or read from css using css variables: - --color-background: colorBg - --color-widget: colorWidget - --color-fill: colorFill - --color-stroke: colorStroke - --color-text: colorText - --widget-padding: padding - --line-width: lineWidth - --border-radius: borderRadius - --alpha-fill-on: alphaFillOn - --alpha-fill-off: alphaFillOff - --alpha-stroke: alphaStroke - --alpha-pips: alphaPips - --alpha-pips-text: alphaPipsText Canvas-based widget have their computed width and height available as css variables (read-only): - --widget-width - --widget-height
design	string	"default"	Design style Choices: default, round, compact
knobSize	number	"auto"	Fader knob size
colorKnob	string	"auto"	Fader knob color
horizontal	boolean	false	Set to true to display the fader horizontally
pips	boolean	false	Set to true to show range breakpoints (ignored if design is compact)
dashed	boolean| array	false	Set to true to display a dashed gauge. Can be set as an array of two numbers : [dash_size, gap_size]
gradient	array| object	[]	When set, the meter's gauge will be filled with a linear color gradient - each item must be a CSS color string. - as an object: each key must be a number between 0 and 1 - each item must be a CSS color string. Examples: ['blue', 'red'],

property	type	default	description
snap	boolean	false	By default, dragging the widget will modify it's value starting from its last value. Setting this to true will make it snap directly to the mouse/touch position
spring	boolean	false	When set to true, the widget will go back to its default value when released
doubleTap	boolean	false	Set to true to make the fader reset to its default value when receiving a double tap. Can also be an osc address, in which case the widget will just send an osc message (/<doubleTap> <preArgs>)
range	object	{  "min": 0,  "max": 1 }	Defines the breakpoints of the fader's scale: - keys can be percentages and/or min / max - values can be number or object if a custom label is needed Example: ({min:{"-inf": 0}, "50%": 0.25, max: {"+inf": 1}})
logScale	boolean| number	false	Set to true to use logarithmic scale. Set to -1 for exponential scale.
sensitivity	number	1	Defines the fader's sensitivity when snap is false
steps	number| array| string	""	Restricts the widget's value: - number: define a number of evenly spaced steps - array of numbers: use arbitrary values as steps - auto: use values defined in range
origin	number	"auto"	Defines the starting point's value of the fader's gauge

property	type	default	description
onValue	script	""	Script executed when the widget's value updates. See documentation. Canvas-based widget have their computed width and height available as local variables: - locals.width - locals.height
onTouch	script	""	Script executed when the widget is touched and released. See documentation.

knob

Rotative knob slider.

styleknobscripting

property	type	default	description
css	string	""	CSS rules. See documentation. Some style-related properties can be set or read from css using css variables: - --color-background: colorBg - --color-widget: colorWidget - --color-fill: colorFill - --color-stroke: colorStroke - --color-text: colorText - --widget-padding: padding - --line-width: lineWidth - --border-radius: borderRadius - --alpha-fill-on: alphaFillOn - --alpha-fill-off: alphaFillOff - --alpha-stroke: alphaStroke - --alpha-pips: alphaPips - --alpha-pips-text: alphaPipsText Canvas-based widget have their computed width and height available as css variables (read-only): - --widget-width - --widget-height
design	string	"default"	Design style Note: "solid" design uses "colorStroke" for the central knob color. Choices: default, solid, line
colorKnob	string	"auto"	Knob color
pips	boolean	false	Set to true to show the scale's breakpoints
dashed	boolean| array	false	Set to true to display a dashed gauge. Can be set as an array of two numbers : [dash_size, gap_size]
angle	number	270	Defines the angle's width of the knob, in degrees

property	type	default	description
mode	string	"vertical"	- vertical: relative move in vertical motion - circular: relative move in circular motion - snap: snap to touch position - snap-alt: alternative snap mode that allow jumping from range.min to range.max. sensitivity is ignored with this mode. Choices: vertical, circular, snap, snap-alt
spring	boolean	false	When set to true, the widget will go back to its default value when released
doubleTap	boolean	false	Set to true to make the knob reset to its default value when receiving a double tap. Can also be an osc address, in which case the widget will just send an osc message (/<doubleTap> <preArgs>)
range	object	{  "min": 0,  "max": 1 }	Defines the breakpoints of the fader's scale: - keys can be percentages and/or min / max - values can be number or object if a custom label is needed Example: ({min:{"-inf": 0}, "50%": 0.25, max: {"+inf": 1}})
logScale	boolean| number	false	Set to true to use logarithmic scale. Set to -1 for exponential scale.
sensitivity	number	1	Defines the knob's sensitivity when mode is not snap
steps	string| number| array	""	Restricts the widget's value: - number: define a number of evenly spaced steps - array of numbers: use arbitrary values as steps - auto: use values defined in range
origin	number	"auto"	Defines the starting point's value of the knob's gauge

property	type	default	description
onValue	script	""	Script executed when the widget's value updates. See documentation. Canvas-based widget have their computed width and height available as local variables: - locals.width - locals.height
onTouch	script	""	Script executed when the widget is touched and released. See documentation.

encoder

A knob that sends a relative direction information instead of an absolute value.

styleencoderscripting

property	type	default	description
css	string	""	CSS rules. See documentation. Some style-related properties can be set or read from css using css variables: - --color-background: colorBg - --color-widget: colorWidget - --color-fill: colorFill - --color-stroke: colorStroke - --color-text: colorText - --widget-padding: padding - --line-width: lineWidth - --border-radius: borderRadius - --alpha-fill-on: alphaFillOn - --alpha-fill-off: alphaFillOff - --alpha-stroke: alphaStroke - --alpha-pips: alphaPips - --alpha-pips-text: alphaPipsText Canvas-based widget have their computed width and height available as css variables (read-only): - --widget-width - --widget-height

property	type	default	description
mode	string	"circular"	- circular: relative move in circular motion - snap: snap to touch position and move in vertical motion - vertical: relative move in vertical motion Choices: circular, snap, vertical
doubleTap	boolean	false	Set to true to make the fader reset to its default value when receiving a double tap. Can also be an osc address, in which case the widget will just send an osc message (/<doubleTap> <preArgs>)
range	object	{  "min": 0,  "max": 1 }	Defines the breakpoints of the fader's scale: - keys can be percentages and/or min / max - values can be number or object if a custom label is needed Example: ({min:{"-inf": 0}, "50%": 0.25, max: {"+inf": 1}})
logScale	boolean| number	false	Set to true to use logarithmic scale. Set to -1 for exponential scale.
sensitivity	number	1	When set between 0 and 1, reduces the encoder's verbosity
ticks	number	""	Defines the granularity / verbosity of the encoder (number of step for a 360° arc)
back	*	-1	Defines which value is sent when rotating the encoder anticlockwise
forth	*	1	Defines which value is sent when rotating the encoder clockwise
release	number	""	Defines which value is sent when releasing the encoder: - Set to null to send send no argument in the osc message - Can be an object if the type needs to be specified

property	type	default	description
onValue	script	""	Script executed when the widget's value updates. See documentation. Canvas-based widget have their computed width and height available as local variables: - locals.width - locals.height Additional variables: - locals.speed: encoder's speed (reduce sensitivity to increase averaging) - locals.angle: encoder's angle in degrees
onTouch	script	""	Script executed when the widget is touched and released. See documentation.

range

A fader with two heads for setting a range.

stylerangescripting

property	type	default	description
css	string	""	CSS rules. See documentation. Some style-related properties can be set or read from css using css variables: - --color-background: colorBg - --color-widget: colorWidget - --color-fill: colorFill - --color-stroke: colorStroke - --color-text: colorText - --widget-padding: padding - --line-width: lineWidth - --border-radius: borderRadius - --alpha-fill-on: alphaFillOn - --alpha-fill-off: alphaFillOff - --alpha-stroke: alphaStroke - --alpha-pips: alphaPips - --alpha-pips-text: alphaPipsText Canvas-based widget have their computed width and height available as css variables (read-only): - --widget-width - --widget-height
design	string	"default"	Design style Choices: default, round, compact
knobSize	number	"auto"	Fader knob size
colorKnob	string	"auto"	Fader knob color
horizontal	boolean	false	Set to true to display the fader horizontally
pips	boolean	false	Set to true to show range breakpoints (ignored if design is compact)
dashed	boolean| array	false	Set to true to display a dashed gauge. Can be set as an array of two numbers : [dash_size, gap_size]
gradient	array| object	[]	When set, the meter's gauge will be filled with a linear color gradient - each item must be a CSS color string. - as an object: each key must be a number between 0 and 1 - each item must be a CSS color string. Examples: ['blue', 'red'],

property	type	default	description
snap	boolean	false	By default, dragging the widget will modify it's value starting from its last value. Setting this to true will make it snap directly to the mouse/touch position
spring	boolean	false	When set to true, the widget will go back to its default value when released
doubleTap	boolean	false	Set to true to make the fader reset to its default value when receiving a double tap. Can also be an osc address, in which case the widget will just send an osc message (/<doubleTap> <preArgs>)
range	object	{  "min": 0,  "max": 1 }	Defines the breakpoints of the fader's scale: - keys can be percentages and/or min / max - values can be number or object if a custom label is needed Example: ({min:{"-inf": 0}, "50%": 0.25, max: {"+inf": 1}})
logScale	boolean| number	false	Set to true to use logarithmic scale. Set to -1 for exponential scale.
sensitivity	number	1	Defines the fader's sensitivity when snap is false
steps	number| array| string	""	Restricts the widget's value: - number: define a number of evenly spaced steps - array of numbers: use arbitrary values as steps - auto: use values defined in range

property	type	default	description
onValue	script	""	Script executed when the widget's value updates. See documentation. Canvas-based widget have their computed width and height available as local variables: - locals.width - locals.height
onTouch	script	""	Script executed when the widget is touched and released. See documentation.

Scripts

script

Scripting widget utility with keyboard bindings

scripting

property	type	default	description
onCreate	script	""	Script executed when the widget is created. See documentation.
onKeyboard	script	""	Script executed whenever the widget receives a keyboard event if keyBinding is set). See documentation.
keyBinding	string| array	""	Key combo string or array of strings (see KeyboardJS documentation). If the editor is enabled, some keys / combos will not work. To process all keystroke events, write ['']
keyRepeat	boolean	true	Set to false to prevent keydown repeats when holding the key combo pressed
keyType	string	"keydown"	Determines which key event trigger the script's execution Choices: keydown, keyup, both

variable

Receives / stores a value, to be used in scripts (using the get function) or in properties (using the @{} syntax).