loading
Choose Icon
Icon Styles
Apply

Align Element

Align your titles relative to the title wrapper.

icon styles

Icon normal state.

Icon color

Select a color for your icon for normal state.

Icon Font Size

Specify your icon size.

Icon Font Size Mobile

Specify your icon size for small screens (under 767px of screen width).

Icon hover state.

Icon color hover

Select a color for your icon for hover state. Hover effects will only apply if a link has been set for the icon.

box styles

Use Box around icon

Toggle this on to create a box around the icon.

box normal state.

box background

Select a color for your box background for normal state.

box border color

Select a color for your box border for normal state.

border width

Specify the border width of your box.

border radius box

Make the corners of your box rounder by increasing the radius value.

Vertical padding box

Increase the vertical space around the icon.

Horizontal padding box

Increase the horizontal spacing around the icon.

box hover state.

box background

Select a color for your box background for hover state. This will only be applied if a link has been added.

box border color hover

Select a color for your box border for normal state. This will only be applied if a link has been added.

Link

Create a link for icon (box)

Toggle this on in order to be able to link your icon (box).

Add URL to link to specific page.

Grab the URL string from the address bar in your browser from the page you want to link to.

Open link in new window/tab

Toggle this on if you would like to open the link in a new window/tab.

Additional text

Font size text

Select font size for your additional text.

Font size text mobile

Select font size for your additional text for small devices.

use default font

Toggle this on if you would like to use the default font from our settings (Helvetica with fallback Arial). If not toggled on it will inherit the font from your theme used on Weebly.

use right positioned text

Toggle this on if you would like your icon to show text on the right of the icon.

use left positioned text

Toggle this on if you would like your icon to show text on the left of the icon.

use top positioned text

Toggle this on if you would like your icon to show text on the top of the icon.

use bottom positioned text

Toggle this on if you would like your icon to show text on the bottom of the icon.

Hover Effects

Transition duration

Specify the transition duration of your hover animation.

Transition animation

Select the animation you would like to use for your hover effect.

None
Rotate
Grow
Shrink
Move Up
Move Down
Move Left
Move Right
Use Icon