Icons

Attributes

Attribute Description Values Default
icon Define the icon See all the available icons here N/A
icon_size Define the icon size fa-2x, fa-3x, fa-4x, fa-5x fa-2x
set_custom_icon_size Enable the use of a custom icon size true, false false
custom_icon_size Define the custom icon size pixels, pt, em, % N/A
custom_icon_margin Define the spacing between icon and text pixels, pt, em, % N/A
image Set the url of the image if you don’t want to use the Font Awesome Icons library URL N/A
icon_type Define the icon type normal, circle, square normal
icon_position Define the icon position top, left, left_from_title left_from_title
icon_margin Define the icon position margin pixels, pt, em, % N/A
icon_border_color Define the icon border color. (Only for square and circle type) HEX or RGB value N/A
icon_color Define the icon color HEX or RGB value N/A
icon_background_color Define the icon background color. (Only for square and circle type) HEX or RGB value N/A
title Define the title Text N/A
title_tag Define the title tag h2, h3, h4, h5, h6 h6
title_color Define the title color HEX or RGB value N/A
text Define the text Text N/A
text_color Define the text color HEX or RGB value N/A
link Define the link url if any URL N/A
link_text Define the link text Text Read more
link_color Define the link text color HEX or RGB value N/A
target Define the link target _self, _blank _self
Demo
[row wrap=”false” padding=”0 0 48px 0″]
[icon_text icon=”fa-git” icon_type=”circle” icon_position=”top” icon_size=”fa-4x” icon_background_color=”#fcf751″ icon_border_color=”#fcf751″ icon_color=”#000″ title=”About us” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.” link=”#” link_text=”Learn more”]
[icon_text icon=”fa-codepen” icon_type=”circle” icon_position=”top” icon_size=”fa-4x” icon_background_color=”#fcf751″ icon_border_color=”#fcf751″ icon_color=”#000″ title=”Services” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.” link=”#” link_text=”Learn more”]
[icon_text icon=”fa-header” icon_type=”circle” icon_position=”top” icon_size=”fa-4x” icon_background_color=”#fcf751″ icon_border_color=”#fcf751″ icon_color=”#000″ title=”Development” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.” link=”#” link_text=”Learn more”]
[code] [icon_text icon=”fa-git” icon_type=”circle” icon_position=”top” icon_size=”fa-4x” icon_background_color=”#fcf751″ icon_border_color=”#fcf751″ icon_color=”#000″ title=”About us” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.” link=”#” link_text=”Learn more”] [/code] [/row] [row wrap=”false” padding=”0 0 48px 0″]
[icon_text icon=”fa-desktop” icon_type=”circle” icon_position=”left” icon_size=”fa-3x” use_custom_icon_size=”no” title=”Beautiful design” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.”]
[icon_text icon=”fa-heart” icon_type=”circle” icon_position=”left” icon_size=”fa-3x” use_custom_icon_size=”no” title=”100% Responsive” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.”]
[icon_text icon=”fa-fire” icon_type=”circle” icon_position=”left” icon_size=”fa-3x” use_custom_icon_size=”no” title=”Interactive Elements” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.”]
[icon_text icon=”fa-key” icon_type=”circle” icon_position=”left” icon_size=”fa-3x” use_custom_icon_size=”no” title=”Fully Customizible” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.”]
[code] [icon_text icon=”fa-desktop” icon_type=”circle” icon_position=”left” icon_size=”fa-3x” use_custom_icon_size=”no” title=”Beautiful design” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.”] [/code] [/row] [row wrap=”false” padding=”0 0 48px 0″]
[icon_text icon=”fa-desktop” icon_type=”normal” icon_position=”left_from_title” icon_size=”fa-2x” use_custom_icon_size=”no” title=”Beautiful design” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.”]
[icon_text icon=”fa-eye” icon_type=”normal” icon_position=”left_from_title” icon_size=”fa-2x” use_custom_icon_size=”no” title=”Minimalist” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.”]
[icon_text icon=”fa-heart” icon_type=”normal” icon_position=”left_from_title” icon_size=”fa-2x” use_custom_icon_size=”no” title=”100% Responsive” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.”]
[icon_text icon=”fa-dashboard” icon_type=”normal” icon_position=”left_from_title” icon_size=”fa-2x” use_custom_icon_size=”no” title=”Interactive Stuff” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.”]
[icon_text icon=”fa-globe” icon_type=”normal” icon_position=”left_from_title” icon_size=”fa-2x” use_custom_icon_size=”no” title=”Google Web Fonts” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.”]
[icon_text icon=”fa-key” icon_type=”normal” icon_position=”left_from_title” icon_size=”fa-2x” use_custom_icon_size=”no” title=”Fully Customizible” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.”]
[code] [icon_text icon=”fa-key” icon_type=”normal” icon_position=”left_from_title” icon_size=”fa-2x” use_custom_icon_size=”no” title=”Fully Customizible” text=”Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.”] [/code] [/row]