create a wide variety of Icon boxes with customizable options, allowing you to match your unique design vision.
Add Icon Box #
Click the ‘+’ icon in the top-left corner to access a wide range of blocks for building your content.
Content #
The General tab provides comprehensive control over every aspect of the icon box, allowing you to create custom designs tailored to your specific needs.
icon #
– Choose the icon from our icon library or upload an SVG or image.
– Control the icon potions in the box and the gap between the icon & text.
Title & description #
– Add your content.
– Choose the Title Tag to optimize your website for search engines.
Button #
It encourages exploration of your site.
– add button text and link.
– the ability to show/hide the button icon & control its position.
Global Link #
Activate “Use Link as Global” ” and use Button Link to create clickable icon boxes that direct users to specific pages or sections of your website.
Styling Tab #
Provides options for customizing the appearance of each item in the icon box.
Box #
- Border:
– Choose a border style
– set the Border Width
– Border color(First color for normal & second for Hover) - Border Radius:
This is used to create rounded corners of the box. - Padding:
Used for the inner spacing between the edges and the content. - Normal & Hover:
Customize your box colors for normal and hover states using our intuitive interface. Easily switch between options in the Normal and Hover tabs. - Box Shadow:
Create an easy box shadow effect.
- Background:
Add a solid background or a stunning gradient effect to your box for a visually striking design.
Icon #
- Container Size:
Add width of the icon container. - Icon Size :
Specify the icon size in PX, EM, or Rem. - Border & Border radius:
Set them to get a circle shape on the icon. - Padding:
Used for the inner spacing between the icon and the borders. - Margin:
Used for the outer spacing between the icon and the content. - Normal & Hover:
Customize your box colors for normal and hover states using our intuitive interface. Easily switch between options in the Normal and Hover tabs. - icon Color:
Use the color picker tool to assign a color to the icon. - Background:
Add a solid background or a stunning gradient effect to the icon.
Title & description #
- Typography: Set font family, size, weight, transform, style, decoration, line height, letter spacing, and word spacing.
- Margin: Used for the outer spacing between the item and other content.
Button #
- Typography:
Set font family, size, weight, transform, style, decoration, line height, letter spacing, and word spacing. - Border & Border radius:
Set them to get a button with a rounded or circled shape. - Padding:
Used for the inner spacing between the Button and the borders. - Margin:
Used for the outer spacing between the Button and other content. - Color:
Use the color picker tool to assign a color to the Text. - Background:
Add a solid background or a stunning gradient effect to the Button.
Button Icon #
- Gap:
Space Between text and icon. - Size:
Specify the icon size in PX, EM, or Rem. - Border & Border radius:
Set them to get a button with a rounded or circled shape - Padding:
Used for the inner spacing. - Color:
Use the color picker tool to assign a color to the icon. - Background:
Add a solid background or a stunning gradient effect to the icon Background.
