Buttons provide clickable elements used in forms or anywhere where simple, standard button functionality is required.
Being the most popular component, the Button component can be used to navigate to a page or link, copy a property to a local storage variable or set the other component’s property, open and close popups, invoke a service, or run JavaScript. It may display text, icons, or both.

🚧
Important Note!
This document lists the properties that are specific to this particular UI component.
To check for the properties common for most UI components, please check the General components document.

Ionic Button

If the button's type is set to Ionic Button (default) under the PROPERTIES panel (Common tab), the component will feature the following common properties:

Property Name	Property Description
Comp. Type	Use this property to change the button role for interaction with Menu (Ionic Menu Button) or Routing (Ionic Back Button): Ionic Button Ionic Menu Button Ionic Back Button. Navigation with Routinghas higher priority thanHref*.
Button Type	Click to select between Button (default) or Bar Button.
Icon	Make a button look like an icon. This property converts the button to an icon by changing its Style property and ignoring the Text property. Style- clickNo icon* to change the icon style by selecting a needed icon. Name* allows changing Ionic icon style dynamically by property binding to "2-0. Color- the color to use from your application's color palette. Select from the predefined value types (primary,secondary,tertiary,success,warning,danger,light,mediumanddark) or enter your custom color name. Slot- position inside the button:Icon only,Start,End*. SVG Icon- used to select an`svg` file. This path will be added as the `src` attribute. Click the Changebutton to select the uploaded image fromMedia Manager**.
Routing	Route Name- define the list of routes names from theRouting* panel. Route Params- the field used to add values forRoute Paramsdescribed in theRouting* panel. Router Direction- when using a router, it specifies the transition direction (back,forwardorroot) when navigating to another page usinghref*.
Link Features	Options for the component to be used as a link: Href* - this property contains a URL or a URL fragment that the hyperlink points to. If this property is set, an anchor tag will be rendered. Typeof theButton:Submit,Reset,Button. Target- specify where to display the linked URL. Only applies when anHrefis provided:Blank,Self,Parent, orTop* Rel* - specify the relationship of the target object to the link object.
(click)	Action to be triggered on button click.

Styles Properties

Under the Styles tab, buttons can be styled with several attributes to look like in a specific way:

Property Name	Property Description
Button Color	Select button color from the available colors: Primary, Secondary, Tertiary, Success, Warning, Danger, Light, Medium, Dark, and Custom or use the Color-picker.
Expand	Set to Block for a full-width button or to Full for a full-width button without left and right borders.
Fill	Set to Solid or select Clear for a transparent button, or Outline for a transparent button with a border.
Shape	Setting to Round makes the button rounded.
Size	Select the preferred button size: Small, Defaultor Large.
Strong	If set to True, activates a button with a heavier font weight.
Text Color	Select button text color from the available colors: Primary, Secondary, Tertiary, Success, Warning, Danger, Light, Medium, Dark, and Custom or use the Color-picker.

Ionic Menu Button

Menu Button is a component that automatically creates the icon and functionality to open a menu on a page.
If you define the button Comp. Type property as Ionic Menu Button, the component will have the additional Menu Button properties under its Common tab:

Auto Hide - automatically hides the menu button when the corresponding menu is not active (set to true).
SVG Icon - used to select an svg file. This path will be added as the src attribute. Click the Change button to select the uploaded image from Media Manager.
Menu - an optional property that maps to a Menu's menuId property. It can also be start or end for the menu side. It is used to find the correct menu to toggle.
Type - type of the menu button (Submit, Reset, or Button):

If you switch to the Styles tab, you will get access to modifying the component's Class, Margin, Mode, and Button Color properties similar to how it's done for the default Ionic Button.

Ionic Back Button

With the button Comp. Type property set to as Ionic Back Button, the component will have the additional Back Button properties under its Common tab:

Icon - icon name to use for the back button. Click the Default icon button to select an icon, or leave it to default.
SVG Icon - used to select an svg file. This path will be added as the src attribute. Click the Change button to select the uploaded image from Media Manager.
Text - text to display in the back button.
Type - the type of the back button (Submit, Reset, or Button).
Default Href - the URL to navigate back to by default when there is no history:

You can also check the Ionic documentation to read more about Button.