In this guide, we’ll show you how to add a “Social Icons With Circle Fill Effect widget” to your Elementor website. The Social Icons With Circle Fill Effect widget allows you to display social media icons with a stylish circular fill effect, creating a modern and eye-catching design. This unique hover effect draws attention to your social links and enhances the overall visual appeal of your website. With its sleek design and interactive styling, this free widget is perfect for making your social media buttons stand out and improving user engagement.
Let’s explore the customization options available in the “Social Icons With Circle Fill Effect widget” for Elementor below.
Add a Social Icons With Circle Fill Effect to Elementor
This widget requires Unlimited Elements Pro version installed and activated on your WordPress website
Go to Unlimited Elements and click "Widgets".
Search for "Social Icons With Circle Fill Effect" in the widget library.
Hover over the widget and click Install.
Add a Social Icons With Circle Fill Effect Widget to an Elementor Page
Click "Add Element" in Elementor
Search for "Social Icons With Circle Fill Effect" in the widget panel.
Drag and drop the “Social Icons With Circle Fill Effect” into the container.
Elementor Social Icons With Circle Fill Effect Widget General Settings
Align
Control the horizontal alignment of the social icons:
Start
Center
End
Gap
Adjust the spacing between the social icons.
Title
Set the display name for this social icon.
Link
Specify the URL the icon will navigate to.
Icon
Select the icon to display for this social link.
Background Color
Set the background color of the icon.
Color
Set the main color of the icon or its text.
Color Hover
Set the color of the icon or its text on hover.
Effect Color
Set the color of the icon’s hover or animation effect.
Add Item
Add more social media icons to the widget.
Elementor Social Icons With Circle Fill Effect Widget Style Settings
Size (Outer)
Control the overall size of the icon’s outer container or effect area.
Icon Size
Adjust the size of the social media icon within its container.
Background
Set the background color of the icon’s container.
Color
Set the color of the social media icon.
Color Hover
Define the color of the icon on hover.
Effect Color
Set the color for the circle fill effect.
Social Icons With Circle Fill Effect Design Examples For Elementor
Here are some live use cases for the Social Icons With Circle Fill Effect widget.
Product Box with Social Icons with Circle Fill Effect widget.
Icon Number Box with Social Icons with Circle Fill Effect widget.
Thank you for using the Social Icons With Circle Fill Effect widget for Elementor! This widget allows you to display social media icons with a unique circular fill effect, adding a stylish and eye-catching touch to your website. The smooth hover animation draws attention to your social links and enhances user interaction. With customizable design options, it’s perfect for creating visually appealing and engaging social media buttons. Need assistance? Feel free to reach out or check out our demo for ideas and inspiration.
