There are two types of buttons available, each with a different purpose.
Basic buttons are used to perform an action such as unblocking a token to move forward in the process, sending an OTP, and opening a new tab.
When configuring a basic button, you can customize the button’s settings by using the following options:
Sections that can be configured regarding general settings:
Here, you can define the UI action that the button will trigger.
CLICK
More details on how to configure UI actions can be found here.
This section enables you to select the type of button using the styling tab in the UI Designer. There are four types available:
For more information on valid CSS properties, click here.
To further enhance the Button UI element with icons, you can include the following properties:
When setting the color, the entire icon is filled with that color, the SVG’s fill. Avoid changing colors for multicolor icons.
When selecting the center position for an icon, the button will display the icon only.
By utilizing these properties, you can create visually appealing Button UI elements with customizable icons, colors, and positions to effectively communicate their purpose and enhance the user experience.
This button will be used to select a file and do custom validation on it. Only the Flowx props will be different.
When configuring a file upload button, you can customize the button’s settings by using the following options:
Sections that can be configured regarding general settings:
Value | Defintion |
---|---|
audio/* | Indicates that sound files are accepted |
image/* | Indicates that image files are accepted |
video/* | Indicates that video files are accepted |
MIME type with no params | Indicates that files of the specified type are accepted |
string starting with U+002E FULL STOP character (.) (for example, .doc, .docx, .xml) | Indicates that files with the specified file extension are accepted |
Example of an upload file button that accepts image files:
Here, you can define the UI action that the button will trigger.
CLICK
More details on how to configure UI actions can be found here.
The file upload button can be styled using valid CSS properties (more details here).
There are two types of buttons available, each with a different purpose.
Basic buttons are used to perform an action such as unblocking a token to move forward in the process, sending an OTP, and opening a new tab.
When configuring a basic button, you can customize the button’s settings by using the following options:
Sections that can be configured regarding general settings:
Here, you can define the UI action that the button will trigger.
CLICK
More details on how to configure UI actions can be found here.
This section enables you to select the type of button using the styling tab in the UI Designer. There are four types available:
For more information on valid CSS properties, click here.
To further enhance the Button UI element with icons, you can include the following properties:
When setting the color, the entire icon is filled with that color, the SVG’s fill. Avoid changing colors for multicolor icons.
When selecting the center position for an icon, the button will display the icon only.
By utilizing these properties, you can create visually appealing Button UI elements with customizable icons, colors, and positions to effectively communicate their purpose and enhance the user experience.
This button will be used to select a file and do custom validation on it. Only the Flowx props will be different.
When configuring a file upload button, you can customize the button’s settings by using the following options:
Sections that can be configured regarding general settings:
Value | Defintion |
---|---|
audio/* | Indicates that sound files are accepted |
image/* | Indicates that image files are accepted |
video/* | Indicates that video files are accepted |
MIME type with no params | Indicates that files of the specified type are accepted |
string starting with U+002E FULL STOP character (.) (for example, .doc, .docx, .xml) | Indicates that files with the specified file extension are accepted |
Example of an upload file button that accepts image files:
Here, you can define the UI action that the button will trigger.
CLICK
More details on how to configure UI actions can be found here.
The file upload button can be styled using valid CSS properties (more details here).