Border properties control the visual line that surrounds a component, separating it from its Margin (space outside) and Padding (space inside). These properties give you precise control over the color, thickness, style, and corner shape of this boundary.

Border Color

This property controls the color of a component’s border.

• To set a color, click the color swatch icon to the left of the word "transparent" to open the Color Picker, or directly input a hex value to specify a color.

Width

This property allows you to specify a numeric value for how thick or thin a border is.

• Enter a single value to set a uniform thickness that applies to all four sides.
• To apply different thickness values to specific sides, click the link icon in the input field and enter separate values for top, right, bottom, and left.
• Entering a value of 0 will hide the border.

Corner Radius

This property allows you to control how round the corner of a component is displayed.

• Enter a single value to set a uniform roundness that applies to all four corners.
• To apply different radius values to specific corners, click the link icon in the input field and enter separate values for top, right, bottom, and left.
• Entering a value of 0 will display the corner with no roundness (a sharp, 90-degree corner).

Style

This property allows you to select a line style for how your border is displayed.

• Borders are set to solid by default.
• Available styles include dotted, dashed, or none (which hides the border).