Enables the user's ability to check the widget's basic properties and styles using a quick preview. The user can apply values to the property and style and see how it behaves.
Use dynamic Layers
When the user works with multiple widgets, this option lets the user rearrange the widgets up and down for easier access and convenience.
Property Type
Shows the list of actions and styles - the user can pick one of them, provide the corresponding value and click 'Apply Action' to see the result on the widget.
Action
Description
Hide Component
Sets whether the widget has to be displayed on the screen when the program is loaded.
Value - true / false
Disable Component
Makes the widget read-only, and denies users any action over the element.
Value - true / false
Margin
Set in terms of "px" number which creates the space between the border and the content of the widget.
Padding
Set in terms of "px" number which creates the space between the border and outer elements.
Border Radius
Sets the radius of the widget's corners, enabling rounded corners on the widget. This value is defined in "px" terms.
Border Width
Set the thickness of the border of the widget using this value. It is defined using "px" terms.
Font Size
Set the size of the text in "px" value - 12px
Font Weight
Increase or decrease the thickness of the font using the list of numbers from 100-800.
Font Family
Type the name of the font family. The reference to the list of font families can be found here: MDN web docs
Background Color
This setting defines the background color of the widget. Users can specify a precise color value using the RGB selection tool provided in the interface.
Border Color
This attribute sets the color for the widget's border lines. Applying this setting ensures consistent visual framing of the component.
Text Color
This function allows for the modification of the widget's text color, ensuring optimal legibility and visual alignment with the overall interface design.