You can mix any size, color, animation and icon.
It’s about 40000000+ possible variations 🙂
[st_icon st_to_color=”#81d742″ st_size_icon=”box-icon-large” st_animation=”top-to-bottom” st_icon=”fa-bug” st_color_icon=”#1e73be” st_round=”round” st_tooltip=”Tooltip” st_pos_tooltip=”none” st_aligment=”box-icon-left”]
- Icon: Bug
- Size: Large
- Color: Info
- To Color: Success
- Shape: Round
- Animation: Top to bottom
[st_icon st_to_color=”#1e73be” st_size_icon=”box-icon-big” st_animation=”border-fadeout” st_icon=”fa-cogs” st_color_icon=”#000000″ st_tooltip=”Tooltip” st_pos_tooltip=”none” st_aligment=”box-icon-left”]
- Icon: Cogs
- Size: Big
- Color: Black
- To color: Inverse
- Animation: Border Fade out
[st_icon st_to_color=”#dd3333″ st_size_icon=”box-icon-sm” st_animation=”shake” st_icon=”fa-heart” st_color_icon=”#dd3333″ st_tooltip=”Tooltip” st_pos_tooltip=”none” st_aligment=”box-icon-left” st_round=”round” st_border=”box-icon-border”]
- Icon: Heart
- Size: Normal
- Color: Danger
- Shape: Border, round
- Animation: Shake
[st_icon st_to_color=”#dd3333″ st_size_icon=”box-icon-large” st_animation=”border-fadein” st_icon=”fa-fire” st_color_icon=”#dd9933″ st_tooltip=”Tooltip” st_pos_tooltip=”none” st_aligment=”box-icon-left” st_border=”box-icon-border”]
- Icon: Fire
- Size: Large
- Color: Warning
- To Color: Danger
- Animation: Border Fadein
[st_icon st_size_icon=”box-icon-big” st_animation=”left-to-right” st_icon=”fa-gift” st_color_icon=”#1e73be” st_tooltip=”Tooltip” st_pos_tooltip=”none” st_aligment=”box-icon-left” st_round=”round”]
- Icon: Gift
- Size: Big
- Color: Inverse
- To color: Normal
- Shape: Round
- Animation: Left to Right
[st_icon st_size_icon=”box-icon-sm” st_animation=”bounce” st_icon=”fa-tag” st_color_icon=”#969696″ st_tooltip=”Tooltip” st_pos_tooltip=”none” st_aligment=”box-icon-left”]
- Icon: Tag
- Size: Normal
- Color: Gray
- To color: Normal
- Animation: Bounce
[st_icon st_to_color=”#1e73be” st_size_icon=”box-icon-large” st_animation=”tada” st_icon=”fa-gear” st_color_icon=”#81d742″ st_tooltip=”Tooltip” st_pos_tooltip=”none” st_aligment=”box-icon-left” st_border=”box-icon-border” st_round=”round”]
- Icon: Gear
- Size: Large
- Color: Success
- To Color: Inverse
- Shape: Round, dashed
- Animation: Tada
[st_icon st_to_color=”#dd3333″ st_size_icon=”box-icon-big” st_animation=”flash” st_icon=”fa-glass” st_tooltip=”Tooltip” st_pos_tooltip=”none” st_aligment=”box-icon-left”]
- Icon: Glass
- Size: Big
- Color: Normal
- To color: Danger
- Animation: Flash
[st_icon st_size_icon=”box-icon-sm” st_animation=”border-rise” st_icon=”fa-globe” st_color_icon=”#1e73be” st_tooltip=”Tooltip” st_pos_tooltip=”none” st_aligment=”box-icon-left” st_round=”round” st_to_color=”#1e73be”]
- Icon: Globe
- Size: Normal
- Color: Info
- Shape: Round
- Animation: Border Rise
Sizes
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-center” st_size_icon=”box-icon-huge” st_icon=”fa-bolt”]
Huge
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-large” st_icon=”fa-bolt”]
Large
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt”]
Big
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-md” st_icon=”fa-bolt”]
Normal
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-sm” st_icon=”fa-bolt”]
Small
Colors
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt”]
Normal
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_color_icon=”#000000″]
Black
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_color_icon=”#848484″]
Gray
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_color_icon=”#127cdc”]
Inverse
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_color_icon=”#2f96b4″]
Info
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_color_icon=”#51a351″]
Success
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_color_icon=”#f89406″]
Warning
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_color_icon=”#bd362f”]
Danger
You can set any transition between colors
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_color_icon=”#000000″]
Black to Normal
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_color_icon=”#eeee22″ st_to_color=”#dd3333″]
Warning Danger
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_to_color=”#1e73be”]
Normal Inverse
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_color_icon=”#a5a5a5″ st_to_color=”#81d742″]
Gray Success
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_color_icon=”#4184bf” st_to_color=”#000000″]
Info Black
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_color_icon=”#1e73be” st_to_color=”#8e8e8e”]
Inverse Gray
Shape
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_round=”round”]
Round
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_border=”box-icon-border”]
Border
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_round=”round” st_border=”box-icon-border”]
Border Round
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_border=”box-icon-border-dashed”]
Border Dashed
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_round=”round” st_border=”box-icon-border-dashed”]
Dashed Round
Animations
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”flash”]
Flash
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”shake”]
Shake
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”bounce”]
Bounce
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”tada”]
Tada
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”swing”]
Swing
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”pulse”]
Pulse
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”border-rise”]
Border Rise
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”border-rise-alt”]
Border Rise Alt
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”border-fadeout”]
Border Fade out
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”border-fadein”]
Border Fade in
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”left-to-right”]
Left to Right
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”right-to-left”]
Right to Left
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”top-to-bottom”]
Top to Bottom
[st_icon st_pos_tooltip=”none” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”bottom-to-top”]
Bottom to Top
Aligment
Normal
Dictumst viverra libero justo tempus urna eleifend morbi
Center
Dictumst viverra libero justo tempus urna eleifend morbi
Left
Dictumst viverra libero justo tempus urna eleifend morbi
Right
Dictumst viverra libero justo tempus urna eleifend morbi
Tooltips
[st_icon st_pos_tooltip=”top” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”left-to-right” st_tooltip=”Tooltip top”]
Top
[st_icon st_pos_tooltip=”bottom” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_animation=”right-to-left” st_tooltip=”Tooltip Bottom”]
Bottom
[st_icon st_pos_tooltip=”left” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_tooltip=”Tooltip left”]
Left
[st_icon st_pos_tooltip=”right” st_aligment=”box-icon-none” st_size_icon=”box-icon-big” st_icon=”fa-bolt” st_tooltip=”Tooltip right”]
Right
