Icon Lists

Using the icons provided in the theme you can build nice styled icon lists. Bellow you can see the styles provided in the theme.

Simple Icon Lists

  • Aenean eget mi eget
  • Sed arcu eros lacinia
  • Duis dictum purus
  • Integer sodales justo
  • Etiam in sem et lectus
  • Aenean eget mi eget
  • Sed arcu eros lacinia
  • Duis dictum purus
  • Integer sodales justo
  • Etiam in sem et lectus
  • Aenean eget mi eget
  • Sed arcu eros lacinia
  • Duis dictum purus
  • Integer sodales justo
  • Etiam in sem et lectus
{list class="list-default fa-ul"}
  {listing}{icon-fa name="fa-thumbs-up fa-li"}Aenean eget mi eget{/listing}
  ...
  ...
{/list}

{list class="list-default fa-ul"}
  {listing}{icon-avendor name="camera-2 fa-li"}Aenean eget mi eget{/listing}
  ...
  ...
{/list}

{list class="list-default fa-ul"}
  {listing}{icon-livicon name="sun" size="20" color="#778899" colorhover="#f7505a" animate="true" loop="false" iteration="3" duration="auto" onparent="true"}Aenean eget mi eget{/listing}
  ...
  ...
{/list}

Custom Color Icon Lists

  • Aenean eget mi eget
  • Sed arcu eros lacinia
  • Duis dictum purus
  • Integer sodales justo
  • Etiam in sem et lectus
  • Aenean eget mi eget
  • Sed arcu eros lacinia
  • Duis dictum purus
  • Integer sodales justo
  • Etiam in sem et lectus
  • Aenean eget mi eget
  • Sed arcu eros lacinia
  • Duis dictum purus
  • Integer sodales justo
  • Etiam in sem et lectus
{list class="list-default fa-ul"}
  {listing}{icon-fa name="fa-thumbs-up fa-li" color="color-info"}Aenean eget mi eget{/listing}
  ...
  ...
{/list}

{list class="list-default fa-ul"}
  {listing}{icon-avendor name="camera-2 fa-li" color="color-info"}Aenean eget mi eget{/listing}
  ...
  ...
{/list}

{list class="list-default fa-ul"}
  {listing}{icon-livicon name="sun" size="20" color="#22d2d2" colorhover="#f7505a" animate="true" loop="false" iteration="3" duration="auto" onparent="true"}Aenean eget mi eget{/listing}
  ...
  ...
{/list}

Divider Icon Lists

  • Aenean eget mi eget
  • Sed arcu eros lacinia
  • Duis dictum purus
  • Integer sodales justo
  • Etiam in sem et lectus
  • Aenean eget mi eget
  • Sed arcu eros lacinia
  • Duis dictum purus
  • Integer sodales justo
  • Etiam in sem et lectus
  • Aenean eget mi eget
  • Sed arcu eros lacinia
  • Duis dictum purus
  • Integer sodales justo
  • Etiam in sem et lectus
{list class="list-default divider-list fa-ul"}
  {listing}{icon-fa name="fa-thumbs-up fa-li"}Aenean eget mi eget{/listing}
  ...
  ...
{/list}

{list class="list-default divider-list fa-ul"}
  {listing}{icon-avendor name="camera-2 fa-li" color="color-info"}Aenean eget mi eget{/listing}
  ...
  ...
{/list}

{list class="list-default divider-list fa-ul"}
  {listing}{icon-livicon name="sun" size="20" color="#22d2d2" colorhover="#f7505a" animate="true" loop="false" iteration="3" duration="auto" onparent="true"}Aenean eget mi eget{/listing}
  ...
  ...
{/list}

Big Icon Lists

  • Aenean eget mi eget
  • Sed arcu eros lacinia
  • Duis dictum purus
  • Integer sodales justo
  • Etiam in sem et lectus
  • Aenean eget mi eget
  • Sed arcu eros lacinia
  • Duis dictum purus
  • Integer sodales justo
  • Etiam in sem et lectus
  • Aenean eget mi eget
  • Sed arcu eros lacinia
  • Duis dictum purus
  • Integer sodales justo
  • Etiam in sem et lectus
{list class="list-default divider-list biglist fa-ul"}
  {listing}{icon-fa name="fa-thumbs-up fa-li"}Aenean eget mi eget{/listing}
  ...
  ...
{/list}

{list class="list-default divider-list biglist fa-ul"}
  {listing}{icon-avendor name="camera-2 fa-li" color="color-info"}Aenean eget mi eget{/listing}
  ...
  ...
{/list}

{list class="list-default divider-list biglist fa-ul"}
  {listing}{icon-livicon name="sun" size="20" color="#22d2d2" colorhover="#f7505a" animate="true" loop="false" iteration="3" duration="auto" onparent="true"}Aenean eget mi eget{/listing}
  ...
  ...
{/list}

IconBox Icon Lists

100% Responsive Layout

Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.

Clean HTML5 and CSS3

Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.

Interactive Elements

Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.

100% Responsive Layout

Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.

Clean HTML5 and CSS3

Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.

Interactive Elements

Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.

100% Responsive Layout

Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.

Clean HTML5 and CSS3

Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.

Interactive Elements

Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.

{iconbox}
  {icon-round-full bgcolor="color-grey" color="color-text" class="animation bounceIn"}
    {icon-fa name="fa-desktop"}
  {/icon}
  {iconbox-content}
  {h5 class="bold"}100% Responsive Layout{/h5}
  {p}Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.{/p}
{/iconbox}

Please look the Shortcodes for the Icon Boxes

IconBox Icon Lists

100% Responsive Layout

Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.

Clean HTML5 and CSS3

Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.

Interactive Elements

Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.

100% Responsive Layout

Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.

Clean HTML5 and CSS3

Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.

Interactive Elements

Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.

{iconbox class="animation fadeInLeft"}
  {icon-round-border color="color-text" size="2x" class="pull-right"}
    {icon-fa name="fa-desktop"}
  {/icon}
  {iconbox-content}
  {h5 class="bold text-right"}100% Responsive Layout{/h5}
  {p class="text-right"}Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.{/p}
{/iconbox}

{iconbox class="animation fadeInRight"}
  {icon-round-full bgcolor="color-default" color="color-white" size="2x"}
    {icon-fa name="fa-desktop"}
  {/icon}
  {iconbox-content}
  {h5 class="bold"}100% Responsive Layout{/h5}
  {p}Turpis venenatis at laoreet. Etiam lorem nulla fuviverra minim sed metus egestas.{/p}
{/iconbox}

Please look also the Shortcodes for the Icon Boxes