Creating Beautiful Content With Simple Code

Typography is a fundamental part of a template, providing you with the tools to characterise your content and bring it to life. There is a vast array of typography available with the template, as is with our previous releases, from list styles, notice blocks and a diverse number of other elements.

To replicate, use the following format: <span class="icon-name"></span> or [span class="icon-name"]...[/span] (ROKCANDY). The icons name are listed below, such as "icon-signal".

Web Icons

icon-adjust

icon-asterisk

icon-ban-circle

icon-bar-chart

icon-barcode

icon-beaker

icon-bell

icon-bolt

icon-book

icon-bookmark

icon-bookmark-empty

icon-briefcase

icon-bullhorn

icon-calendar

icon-camera

icon-camera-retro

icon-certificate

icon-check

icon-check-empty

icon-cloud

icon-cog

icon-cogs

icon-comment

icon-comment-alt

icon-comments

icon-comments-alt

icon-credit-card

icon-dashboard

icon-download

icon-download-alt

icon-edit

icon-envelope

icon-envelope-alt

icon-exclamation-sign

icon-external-link

icon-eye-close

icon-eye-open

icon-facetime-video

icon-film

icon-filter

icon-fire

icon-flag

icon-folder-close

icon-folder-open

icon-gift

icon-glass

icon-globe

icon-group

icon-hdd

icon-headphones

icon-heart

icon-heart-empty

icon-home

icon-inbox

icon-info-sign

icon-key

icon-leaf

icon-legal

icon-lemon

icon-lock

icon-unlock

icon-magic

icon-magnet

icon-map-marker

icon-minus

icon-minus-sign

icon-money

icon-move

icon-music

icon-off

icon-ok

icon-ok-circle

icon-ok-sign

icon-pencil

icon-picture

icon-plane

icon-plus

icon-plus-sign

icon-print

icon-pushpin

icon-qrcode

icon-question-sign

icon-random

icon-refresh

icon-remove

icon-remove-circle

icon-remove-sign

icon-reorder

icon-resize-horizontal

icon-resize-vertical

icon-retweet

icon-road

icon-rss

icon-screenshot

icon-search

icon-share

icon-share-alt

icon-shopping-cart

icon-signal

icon-signin

icon-signout

icon-sitemap

icon-sort

icon-sort-down

icon-sort-up

icon-star

icon-star-empty

icon-star-half

icon-tag

icon-tags

icon-tasks

icon-thumbs-down

icon-thumbs-up

icon-time

icon-tint

icon-trash

icon-trophy

icon-truck

icon-umbrella

icon-upload

icon-upload-alt

icon-user

icon-user-md

icon-volume-off

icon-volume-down

icon-volume-up

icon-warning-sign

icon-wrench

icon-zoom-in

icon-zoom-out

Text Editor Icons

icon-file

icon-cut

icon-copy

icon-paste

icon-save

icon-undo

icon-repeat

icon-paper-clip

icon-text-height

icon-text-width

icon-align-left

icon-align-center

icon-align-right

icon-align-justify

icon-indent-left

icon-indent-right

icon-font

icon-bold

icon-italic

icon-strikethrough

icon-underline

icon-link

icon-columns

icon-table

icon-th-large

icon-th

icon-th-list

icon-list

icon-list-ol

icon-list-ul

icon-list-alt

Directional Icons

icon-arrow-down

icon-arrow-left

icon-arrow-right

icon-arrow-up

icon-chevron-down

icon-circle-arrow-down

icon-circle-arrow-left

icon-circle-arrow-right

icon-circle-arrow-up

icon-chevron-left

icon-caret-down

icon-caret-left

icon-caret-right

icon-caret-up

icon-chevron-right

icon-hand-down

icon-hand-left

icon-hand-right

icon-hand-up

icon-chevron-up

Video Player Icons

icon-play-circle

icon-play

icon-pause

icon-stop

icon-step-backward

icon-fast-backward

icon-backward

icon-forward

icon-fast-forward

icon-step-forward

icon-eject

icon-fullscreen

icon-resize-full

icon-resize-small

Social Icons

icon-phone

icon-phone-sign

icon-facebook

icon-facebook-sign

icon-twitter

icon-twitter-sign

icon-github

icon-github-sign

icon-linkedin

icon-linkedin-sign

icon-pinterest

icon-pinterest-sign

icon-google-plus

icon-google-plus-sign

icon-sign-blank

<ul> List Styles (Icons)

To replicate, use the following format: <ul class="list-icon icon_name"><li>....</li><li>....</li>...</ul> (HTML) or [list class="list-icon icon_name"][li]....[/li][li....[/li][/list] (ROKCANDY). The icon names are listed below, such as "cart".

A list item using the list-icon email class.

A list item using the list-icon email class.

A list item using the list-icon phone class.

A list item using the list-icon phone class.

A list item using the list-icon quote class.

A list item using the list-icon quote class.

A list item using the list-icon twitter class.

A list item using the list-icon twitter class.

A list item using the list-icon youtube class.

A list item using the list-icon youtube class.

A list item using the list-icon facebook class.

A list item using the list-icon facebook class.

A list item using the list-icon cart class.

A list item using the list-icon cart class.

A list item using the list-icon tags class.

A list item using the list-icon tags class.

A list item using the list-icon write class.

A list item using the list-icon write class.

A list item using the list-icon info class.

A list item using the list-icon info class.

A list item using the list-icon sound class.

A list item using the list-icon sound class.

A list item using the list-icon rightarrow class.

A list item using the list-icon rightarrow class.

A list item using the list-icon skype class.

A list item using the list-icon skype class.

A list item using the list-icon rss class.

A list item using the list-icon rss class.

A list item using the list-icon leftarrow class.

A list item using the list-icon leftarrow class.

A list item using the list-icon circlearrow class.

A list item using the list-icon circlearrow class.

A list item using the list-icon dropbox class.

A list item using the list-icon dropbox class.

A list item using the list-icon vimeo class.

A list item using the list-icon vimeo class.

A list item using the list-icon downarrow class.

A list item using the list-icon downarrow class.

A list item using the list-icon video class.

A list item using the list-icon video class.

A list item using the list-icon like class.

A list item using the list-icon like class.

A list item using the list-icon uparrow class.

A list item using the list-icon uparrow class.

A list item using the list-icon person class.

A list item using the list-icon person class.

A list item using the list-icon calendar class.

A list item using the list-icon calendar class.

A list item using the list-icon bulb class.

A list item using the list-icon bulb class.

A list item using the list-icon paypal class.

A list item using the list-icon paypal class.

A list item using the list-icon doc class.

A list item using the list-icon doc class.

<ul> List Styles (CSS3)

These list styles are based on the latest CSS3 techniques and are designed to work in modern browsers (will not display properly in IE6-IE8).

To replicate, use the following format: <ul class="class name"><li>....</li><li>....</li>...</ul> (HTML) or [list class="class name"][li]....[/li][li....[/li][/list] (ROKCANDY). The class names are listed below, such as "checkmark red".