Button

The button represents the foundational HTML button, enhanced with a cohesive design theme and additional customizable options.

Example

Below is an example of the button component.

Props

Property	Type	Default	Description
visible	boolean	true	Determines whether the button is rendered. If `false`, the button is hidden from the interface.
position	number[]	0 0 0	Defines the button’s position in 3D space as an array of coordinates.
size	enum (small, medium, large, extra-large)	medium	Controls the overall button size, including padding, font size, and layout density.
opacity	number	1	Specifies the button's opacity.
color	string (blue, #fff)	#00BA92	Defines the primary button color, affecting the background, text, and icon styling.
mode	string (light, dark)	""	Applies a light or dark visual theme to the button for consistent appearance within different UI themes.
content	string	""	Specifies the label text displayed inside the button (e.g., “Open dialog”, “Close”).
icon	string	""	Defines the icon displayed within the button.
iconpos	string(left, right)	"left"	Determines whether the icon is displayed to the left or right of the button text.
textcolor	string	black	Sets the color of the button's text. If the contrast with the background is insufficient, the text color will not be applied.
textonly	boolean	false	When set to `true`, it renders the button as text-only, removing the background.
uppercase	boolean	false	Displays the button label in uppercase letters when enabled.
elevated	boolean	true	Adds a shadow effect to create a raised, three-dimensional appearance.
rounded	boolean	false	Applies rounded corners to the button.
roundedsides	string(full, left, right)	"full"	Defines which sides of the button are `rounded` when rounded is enabled (full, left, or right).
tile	boolean	false	Removes rounded styling and renders the button with square edges.
outlined	boolean	false	When `true`, displays the button with an outline.