New in version 2: You can use an icon font!

Icon playground

This pages shows you some possibilities how to code and use the included icon font. Have fun!

Buttons with icons!

This is an alert button Download button

A quote with icons!

This is a styled quote. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis tempor. Nullam tortor. Nulla vel dui. Curabitur et metus. This is a quote. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis tempor. Nullam tortor. Nulla vel dui. Curabitur et metus. John Doe (1900 - 2000)

Alert boxes with icons!

Yes of course you can! (alert-box icon-lightbulb). ×
This is an success message. (alert-box success icon-ok-circled). ×
This is a warning message. (alert-box warning icon-attention). ×
Note: Eve doesn´t claim to be perfect (me too)! (alert-box alert icon-block). ×
It is prohibited to turn this design into a fixed layout! (alert-box secondary icon-info-circled). ×

Icon Lists

  • Lorem ipsum dolor sit amet, consectetuer.
  • Aliquam tincidunt mauris eu risus.
  • Vestibulum auctor dapibus neque.

More Lists

  • Lorem ipsum dolor sit amet, consectetuer.
  • Aliquam tincidunt mauris eu risus.
  • Vestibulum auctor dapibus neque.

 How to use

To keep it slick, I have included only a small amount of icons created with Fontello. You can create your own set or - if you need a lot of them - use the BootstrapCDN instead.

Note: The social icons in Eve v.2 are also iconfont symbols this time, so requests are reduced, you can easily change font and hover color and the icons will scale fine.
See all the included icons on the Icon demo page (= folder "fontello")

Green iconbox

You can use iconboxes everywhere, they will adjust to the width of their parent container (they look better if you use the grid though). As you see, you can also combine them with the green and grey boxes.

This is an iconbox

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam tincidunt mauris eu risus. Vestibulum auctor dapibus neque.

This is an iconbox

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam tincidunt mauris eu risus. Vestibulum auctor dapibus neque.

This is an iconbox

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam tincidunt mauris eu risus. Vestibulum auctor dapibus neque.

Drive attention to your services!

Lorem ipsum dolor sit amet, consectetuer adipiscing elit.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit.