Icons

Table of contents

Overview

The Fugue icon set was created by Yusuke Kamiyamane. Fugue has over 3,400 icons, however only commonly used icons have been incorporated into WET.

An icon is attached to an empty span: 

<span class="wb-icon-alarm"></span>

Since the icons are CSS background images, they cannot have an alt attribute. Therefore, the icon must be accompanied by actual text to ensure that there is no loss of information for the visually impaired user. For example: 

<p><span class="wb-icon-calendar"></span><a href="#">View the events calendar</a></p>

Icon options

Time and place

  • wb-icon-alarm
  • wb-icon-calendar
  • wb-icon-calendar-day
  • wb-icon-calendar-list
  • wb-icon-calendar-month
  • wb-icon-clock
  • wb-icon-compass
  • wb-icon-direction
  • wb-icon-globe
  • wb-icon-home
  • wb-icon-hourglass
  • wb-icon-mail
  • wb-icon-marker
  • wb-icon-user

Navigation

  • wb-icon-compass
  • wb-icon-cone
  • wb-icon-construction
  • wb-icon-desktop
  • wb-icon-direction
  • wb-icon-folder
  • wb-icon-folder-alt
  • wb-icon-folder-open
  • wb-icon-light
  • wb-icon-light-exclamation
  • wb-icon-light-green
  • wb-icon-light-red
  • wb-icon-light-yellow
  • wb-icon-marker
  • wb-icon-nav
  • wb-icon-nav-alt
  • wb-icon-nav-090
  • wb-icon-nav-090-alt
  • wb-icon-nav-180
  • wb-icon-nav-180-alt
  • wb-icon-nav-270
  • wb-icon-nav-270-alt
  • wb-icon-sitemap

Alerts

  • wb-icon-alarm
  • wb-icon-bulb
  • wb-icon-bulb-off
  • wb-icon-clipboard-exclamation
  • wb-icon-comment
  • wb-icon-cone
  • wb-icon-construction
  • wb-icon-direction
  • wb-icon-exclamation
  • wb-icon-exclamation-alt
  • wb-icon-exclamation-alt2
  • wb-icon-gavel
  • wb-icon-gear
  • wb-icon-hourglass
  • wb-icon-info
  • wb-icon-info-alt
  • wb-icon-light
  • wb-icon-light-exclamation
  • wb-icon-light-green
  • wb-icon-light-red
  • wb-icon-light-yellow
  • wb-icon-lock
  • wb-icon-lock-unlock
  • wb-icon-magnifier
  • wb-icon-marker
  • wb-icon-megaphone
  • wb-icon-prohibit
  • wb-icon-question
  • wb-icon-question-alt
  • wb-icon-safe
  • wb-icon-scale
  • wb-icon-tick
  • wb-icon-tick-alt
  • wb-icon-tick-alt2
  • wb-icon-tool
  • wb-icon-toolbox
  • wb-icon-x
  • wb-icon-x-alt
  • wb-icon-x-alt2

Document products

  • wb-icon-book
  • wb-icon-book-alt
  • wb-icon-book-open
  • wb-icon-box
  • wb-icon-calculator
  • wb-icon-calculator-arrow
  • wb-icon-calculator-exclamation
  • wb-icon-calculator-minus
  • wb-icon-calculator-plus
  • wb-icon-chart
  • wb-icon-chart-down
  • wb-icon-chart-pie
  • wb-icon-chart-up
  • wb-icon-clip
  • wb-icon-clipboard
  • wb-icon-clipboard-exclamation
  • wb-icon-direction
  • wb-icon-disk
  • wb-icon-document
  • wb-icon-envelope
  • wb-icon-film
  • wb-icon-folder
  • wb-icon-folder-alt
  • wb-icon-folder-open
  • wb-icon-image
  • wb-icon-mail
  • wb-icon-newspaper
  • wb-icon-note
  • wb-icon-note-pencil
  • wb-icon-paper
  • wb-icon-paper-pencil
  • wb-icon-pencil
  • wb-icon-picture
  • wb-icon-printer
  • wb-icon-table

All icons

  • wb-icon-alarm
  • wb-icon-book
  • wb-icon-book-alt
  • wb-icon-book-open
  • wb-icon-box
  • wb-icon-bulb
  • wb-icon-bulb-off
  • wb-icon-calculator
  • wb-icon-calculator-arrow
  • wb-icon-calculator-exclamation
  • wb-icon-calculator-minus
  • wb-icon-calculator-plus
  • wb-icon-calendar
  • wb-icon-calendar-day
  • wb-icon-calendar-list
  • wb-icon-calendar-month
  • wb-icon-chart
  • wb-icon-chart-down
  • wb-icon-chart-pie
  • wb-icon-chart-up
  • wb-icon-clip
  • wb-icon-clipboard
  • wb-icon-clipboard-exclamation
  • wb-icon-clock
  • wb-icon-comment
  • wb-icon-compass
  • wb-icon-cone
  • wb-icon-construction
  • wb-icon-desktop
  • wb-icon-direction
  • wb-icon-disk
  • wb-icon-document
  • wb-icon-envelope
  • wb-icon-exclamation
  • wb-icon-exclamation-alt
  • wb-icon-exclamation-alt2
  • wb-icon-film
  • wb-icon-folder
  • wb-icon-folder-alt
  • wb-icon-folder-open
  • wb-icon-gavel
  • wb-icon-gear
  • wb-icon-globe
  • wb-icon-home
  • wb-icon-hourglass
  • wb-icon-image
  • wb-icon-info
  • wb-icon-info-alt
  • wb-icon-light
  • wb-icon-light-exclamation
  • wb-icon-light-green
  • wb-icon-light-red
  • wb-icon-light-yellow
  • wb-icon-lock
  • wb-icon-lock-unlock
  • wb-icon-magnifier
  • wb-icon-mail
  • wb-icon-marker
  • wb-icon-megaphone
  • wb-icon-monitor
  • wb-icon-nav
  • wb-icon-nav-alt
  • wb-icon-nav-090
  • wb-icon-nav-090-alt
  • wb-icon-nav-180
  • wb-icon-nav-180-alt
  • wb-icon-nav-270
  • wb-icon-nav-270-alt
  • wb-icon-newspaper
  • wb-icon-note
  • wb-icon-note-pencil
  • wb-icon-paper
  • wb-icon-paper-pencil
  • wb-icon-pencil
  • wb-icon-picture
  • wb-icon-printer
  • wb-icon-prohibit
  • wb-icon-question
  • wb-icon-question-alt
  • wb-icon-rss
  • wb-icon-safe
  • wb-icon-scale
  • wb-icon-sitemap
  • wb-icon-table
  • wb-icon-tick
  • wb-icon-tick-alt
  • wb-icon-tick-alt2
  • wb-icon-tool
  • wb-icon-toolbox
  • wb-icon-user
  • wb-icon-x
  • wb-icon-x-alt
  • wb-icon-x-alt2