Box Customization

The elements can be placed in a box.

They will move and animate together.

Basic shapes

The shape library includes 13 different types of shapes.

Limitations:

• For all shapes except the square, the corner radius cannot be changed individually for each corner. The radius changes uniformly for all corners through the Border Radius setting.
• For these types of shapes, the radius cannot be changed.
  
• Shadow - the shadow size adjustment setting is unavailable for all types except the square.

Background

Background color - select from solid or gradient color.

To set the solid background color click on the color picker. Use the slider to adjust the opacity.

To set the gradient background color click on the color picker for each color. Use the slider to adjust the opacity.

You can add 4 gradient layers and up to 5 colors. 

Border

Border width (px)  - to adjust the width of the border from 0px to 50px.

 

 

Border color  - to adjust the border color click on the color picker. Use the slider to adjust the opacity.

 

 

Radius is used to adjust the rounded edges of the border from 0px to 999px.
Adjust edges together or separately from each other.

 

 

Effects Settings 

Element Background Type

• Blur: This effect applies a blur to the background of the element. The intensity of the blur can be adjusted using a slider.

Backdrop Background Type

• Glass Effect: Creates a blurred background for the element, giving the impression that the element is "made of glass," allowing blurred content behind it to be visible. The intensity of the blur can be adjusted using a slider.
• Invert Effect: Alters the color scheme of the background to its opposite colors.
• Grayscale Effect: Converts the background to shades of gray. The intensity can be adjusted using a slider

Note

All these effects influence the visibility and appearance of elements or content positioned underneath them.

 

Shadow Box

Angle - adjust the angle of the direction of the shadow.

Distance (px) - adjust the distance of the shadow from the text from 0px to 100px.

Size (px) - to adjust the size of button shadow from 0px to 100px. 

Blur (px) - a visual effect that makes the shadow appear fuzzy or out of focus.

Shadow color - to set the shadow color click on the color picker. Use the slider to adjust the opacity.