In this guide, we’ll show you how to add the “Icon Box Hover Effect widget” to your Elementor website. This engaging widget lets you display icons and content with eye-catching hover animations, making your site more interactive and visually appealing. Perfect for showcasing features and services, the Icon Box Hover Effect widget helps highlight key content while enhancing user experience with smooth, customizable effects.
Let’s explore the customization options available in the “Icon Box Hover Effect widget” for Elementor below.
Add an Icon Box Hover Effect to Elementor
This widget requires Unlimited Elements Pro version installed and activated on your WordPress website.
Add an Animated Icon Box Widget to an Elementor Page
Elementor Icon Box Hover Effect Widget General Settings
Title
Enter the main title displayed in the icon box.
Link
Input a URL that the entire icon box will link to.
Text
Add a descriptive paragraph or additional text content in a rich text area.
Icon
Select or upload an icon to display within the icon box.
Text Align
Set the horizontal alignment of the text (Left, Center, or Right).
Elementor Icon Box Hover Effect Widget Style Settings
Background
Set a background color or gradient for the entire icon box.
Box Radius
Controls corner curvature with individual values for Top, Right, Bottom, and Left.
Box Border
Defines border widths for each side of the box (Top, Right, Bottom, Left).
Box Shadow
Adds a shadow effect to the box for visual depth.
Background Hover
Sets a different background color or gradient when the icon box is hovered.
Box Radius Hover
Controls corner curvature on hover with individual values for Top, Right, Bottom, and Left.
Box Border Hover
Defines border widths for each side of the box when hovered.
Box Shadow Hover
Adds or modifies the shadow effect on hover for dynamic visual impact.
Icon Box Hover Effect Widget Design Examples For Elementor
Here are some live use cases for the Icon Box Hover Effect widget.
Smoke Background Effect with Icon Box Hover Effect.
Icon Box Hover Effect for travel website.
Thank you for using the Icon Box Hover Effect widget for Elementor! This interactive tool lets you showcase icons and content with smooth, customizable hover animations, adding movement and style to your design. Perfect for highlighting features and services, it enhances visual appeal and draws attention to key content with engaging effects. For ideas, support, or further inspiration, feel free to reach out or check out our live demo.