Hello


<p class=" font-7 fa-max-150 fa-silver-light fa-scale-inverse fa-inline-block"> Hello </p>
CSS3 ADD-ONS

White Glow out

<p class="fa-max-50 font-7 fa-glow-white-out ">White Glow out</p>

White Glow in

<p class="fa-max-50 font-7 fa-glow-white-in">White Glow in</p>

White Glow

<p class="fa-max-50 font-7 fa-glow-white">White Glow</p>

BlackGlow out

<p class="fa-max-50 fa-bb font-7 fa-glow-black-out">BlackGlow out</p>

Black Glow in

<p class="fa-max-50 font-7 fa-glow-black-in">Black Glow in</p>

Black Glow

<p class="fa-max-50 font-7 fa-glow-black">Black Glow</p>
2X codes

Text - Span
<span class="fa-max-50 fa-shadow-black-thin">Text - Span</span>

The "Span" code is the best if you need a responsive title inside a text block ( in line). However some transforms ( like fa-scale and fa-glow...) are not correctly supported in certain browser. You can mix some styles and check the result online.

Text - Paragraph

<p class='fa-max-50 fa-shadow-black-thin'>Text - Paragraph</p>

The "Paragraph" code ( p) allow you to write single line of text. Use this cose for titles ( like Classes H1, H2 and so on).

You can add a further code to put the text inline. We provide 3 codes:

fa-inline   fa-inline-block   fa-inline-table


With the fa-inline-block all animations ( like fa-scale) works.

WEBFONT codes


Make your Website great

<span class="font-5 fa-max-50 fa-shadow-black-thin">Make </span> <span class="font-7 fa-max-50 fa-shadow-black-thin">your </span><span class="font-3 fa-max-50 fa-shadow-black-thin">Website </span> <span class="font-6 fa-max-50 fa-shadow-black-thin">great</span>

With this classes list (font-1, font-2, font-3..) you can apply the WebFont style to a single line of text, also a single word.

Icon + Text

Icon code + Text Code


Hello
Icon + text
<i class="fa fa-comment fa-3x"></i> <span class="fa-3x"> Hello </span>

Hello
styled Icon + styled text
<i class="fa fa-comment fa-3x fa-silver-light"></i> <span class=" fa-3x fa-silver-light"> Hello </span>

Hello
Icon + web font (using font-1 ..2,3,4…)
<i class="fa fa-comment fa-3x"></i> <span class="font-3 fa-3x"> Hello </span>

Hello


Icon with shadow + Text with Pulse effect
<i class="fa fa-comment fa-3x fa-shadow-black-big"> </i> <p class=" f fa-3x fa-inline-block fa-pulse-loop "> Hello </p>

Examples

With our code you can add the animation to icons, text and images

DEMO TEXT: We use cookies to ensure that we give you the best experience on our Addons website. Click here for more info.