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

[st_icon st_pos_tooltip=»none» st_aligment=»box-icon-none» st_size_icon=»box-icon-big» st_icon=»fa-bolt»]

Dictumst viverra libero justo tempus urna eleifend morbi

Center

[st_icon st_pos_tooltip=»none» st_aligment=»box-icon-center» st_size_icon=»box-icon-big» st_icon=»fa-bolt»]

Dictumst viverra libero justo tempus urna eleifend morbi

Left

[st_icon st_pos_tooltip=»none» st_aligment=»box-icon-left» st_size_icon=»box-icon-big» st_icon=»fa-bolt»]

Dictumst viverra libero justo tempus urna eleifend morbi

Right

[st_icon st_pos_tooltip=»none» st_aligment=»box-icon-right» st_size_icon=»box-icon-big» st_icon=»fa-bolt»]

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