Classic
Tagging
Examples
Custom Button

Creating a custom button

Learn how to create a custom button with best design practices. Then tag it and apply hover effects and actions.

  1. Draw a button by creating a frame and applying styling to it

  2. Then add your text inside of the frame

Note: Avoid using a rectangle with text on top of it as this creates uneccesary lines of code during code generation.

Tag, add hover effects and actions

  1. Select the button frame and tag it as a button. For custom buttons, select “none” for the UI library
  1. In the Styling & Layout settings, click the “hover” tab and change the fill colour.
  1. In the Actions settings, you can choose an action to be taken when the button is clicked.
  1. You have successfully created a custom button
Creating an Input with LabelCustom Input