Style properties in UI Designer
Shadow
In a nutshell The Shadow property applies a box shadow to an element to create a sense of depth and elevation. You can choose from five elevation presets, each progressively larger and more diffuse, or remove the shadow if not required. 1. ...
Tab styling
In a nutshell Tab styling lets you control the visual appearance of each layer within a tab element including its outer container and the panel that displays the active tab's content. The outer container's styling also includes styling properties for ...
Icon styling
1. Description Once an icon glyph is chosen from the icon picker*link to elements page*, the Icon property controls how that glyph is rendered on the page: Each subproperty defines: Size - How large the glyph appears Style - Whether it is drawn as an ...
Stack styling
In a nutshell Stack controls how child elements are arranged inside a Canvas container or directly on a portal page when they are a stacked next to each other. You can set the stack direction (horizontal or vertical), how the child elements are ...
Margin
In a nutshell Margin controls the outer spacing between an element's boundary and its surrounding elements or parent container. You can apply a single value to all four sides at once, or set each side, top, right, bottom, and left, independently to ...
Layout
In a nutshell Layout controls the size and position of an element on the building space. You can set the element's width and height independently as well as define the space outside the element's container. 1. Description Layout defines how large an ...
Corner Radius
In a nutshell Corner Radius controls how rounded the corners of an element are to provide a visual softness to it. Corner rounding ranges from sharp edges to subtle curves, more pronounced arcs, or a fully circular and oval appearance depending on ...
Font
In a nutshell Font controls the visual appearance of text, within a Text element or any text within an advanced element, such as its typeface, size, weight, and color. It also includes text alignment, which determines how the text is positioned ...
Background
In a nutshell Background controls what appears behind an element's content, either a solid color fill or an image. You can choose from preset color palettes, enter a custom hex value, or upload an image to fill the element's surface. 1. Description ...
Padding
In a nutshell Padding controls the inner spacing between an element's boundary and its content. You can apply a single value to all four sides at once, or set each side, top, right, bottom, and left, independently to control its visual density. 1. ...
Opacity
In a nutshell The Opacity property controls how transparent an element's content is. While the value of 100% makes the element fully visible, lower values fade it progressively until it becomes completely invisible at 0%. 1. Description Opacity sets ...
Border
In a nutshell The Border property adds a solid outline around an element. You can choose the border variation, control its thickness through preset values, and set its color independently to define the element's visual boundary. 1. Description Border ...
Alignment
In a nutshell Alignment controls where an element's*link* content is positioned within a portal page's screen layout, a canvas, H-Stack, or V-Stack element*link*. 1. Description Alignment defines the position of an element*link to elements ...