7957 行
582 KiB
HTML
7957 行
582 KiB
HTML
{% extends 'base/base.html' %}
|
|
{% block content %}
|
|
<div class="main ui container segment">
|
|
|
|
<div class="ui active tab" data-tab="icon">
|
|
|
|
|
|
<h2 class="ui header">图标集</h2>
|
|
<p>An icon set contains an arbitrary number of glyphs</p>
|
|
<p>点击图标进行复制</p>
|
|
|
|
<iconSearch class="ui right aligned search">
|
|
<div class="ui icon fluid input">
|
|
<input class="prompt" type="text" placeholder="Search icons...">
|
|
<i class="search icon"></i>
|
|
</div>
|
|
<!-- <div class="results">
|
|
</div> -->
|
|
</iconSearch>
|
|
<div class="results">
|
|
</div>
|
|
<input class="copy-input" hidden />
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Accessibility</h4>
|
|
<p>Icons can represent accessibility standards</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="accessible icon"
|
|
data-search-terms="accessibility, handicap, person, wheelchair, wheelchair-alt"></i>accessible
|
|
</div>
|
|
<div class="column"><i class="american sign language interpreting icon"
|
|
data-search-terms="asl, deaf, finger, hand, interpret, speak"></i>american sign language
|
|
interpreting</div>
|
|
<div class="column"><i class="assistive listening systems icon"
|
|
data-search-terms="amplify, audio, deaf, ear, headset, hearing, sound"></i>assistive listening
|
|
systems</div>
|
|
<div class="column"><i class="audio description icon"
|
|
data-search-terms="blind, narration, video, visual"></i>audio description</div>
|
|
<div class="column"><i class="blind icon" data-search-terms="cane, disability, person, sight"></i>blind
|
|
</div>
|
|
<div class="column"><i class="braille icon"
|
|
data-search-terms="alphabet, blind, dots, raised, vision"></i>braille</div>
|
|
<div class="column"><i class="closed captioning icon"
|
|
data-search-terms="cc, deaf, hearing, subtitle, subtitling, text, video"></i>closed captioning
|
|
</div>
|
|
<div class="column"><i class="closed captioning outline icon"
|
|
data-search-terms="cc, deaf, hearing, subtitle, subtitling, text, video"></i>closed captioning
|
|
outline</div>
|
|
<div class="column"><i class="deaf icon" data-search-terms="ear, hearing, sign language"></i>deaf</div>
|
|
<div class="column"><i class="low vision icon" data-search-terms="blind, eye, sight"></i>low vision
|
|
</div>
|
|
<div class="column"><i class="phone volume icon"
|
|
data-search-terms="call, earphone, number, sound, support, telephone, voice, volume-control-phone"></i>phone
|
|
volume</div>
|
|
<div class="column"><i class="question circle icon"
|
|
data-search-terms="help, information, support, unknown"></i>question circle</div>
|
|
<div class="column"><i class="question circle outline icon"
|
|
data-search-terms="help, information, support, unknown"></i>question circle outline</div>
|
|
<div class="column"><i class="sign language icon"
|
|
data-search-terms="Translate, asl, deaf, hands"></i>sign language</div>
|
|
<div class="column"><i class="tty icon"
|
|
data-search-terms="communication, deaf, telephone, teletypewriter, text"></i>tty</div>
|
|
<div class="column"><i class="universal access icon"
|
|
data-search-terms="accessibility, hearing, person, seeing, visual impairment"></i>universal
|
|
access</div>
|
|
<div class="column"><i class="wheelchair icon"
|
|
data-search-terms="accessible, handicap, person"></i>wheelchair</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Alert</h4>
|
|
<p>Icons which can alert users to an action or information</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="bell icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell</div>
|
|
<div class="column"><i class="bell outline icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell outline</div>
|
|
<div class="column"><i class="bell slash icon"
|
|
data-search-terms="alert, cancel, disabled, notification, off, reminder"></i>bell slash</div>
|
|
<div class="column"><i class="bell slash outline icon"
|
|
data-search-terms="alert, cancel, disabled, notification, off, reminder"></i>bell slash outline
|
|
</div>
|
|
<div class="column"><i class="exclamation icon"
|
|
data-search-terms="alert, danger, error, important, notice, notification, notify, problem, warning"></i>exclamation
|
|
</div>
|
|
<div class="column"><i class="exclamation circle icon"
|
|
data-search-terms="alert, danger, error, important, notice, notification, notify, problem, warning"></i>exclamation
|
|
circle</div>
|
|
<div class="column"><i class="exclamation triangle icon"
|
|
data-search-terms="alert, danger, error, important, notice, notification, notify, problem, warning"></i>exclamation
|
|
triangle</div>
|
|
<div class="column"><i class="radiation icon"
|
|
data-search-terms="danger, dangerous, deadly, hazard, nuclear, radioactive, warning"></i>radiation
|
|
</div>
|
|
<div class="column"><i class="radiation alternate icon"
|
|
data-search-terms="danger, dangerous, deadly, hazard, nuclear, radioactive, warning"></i>radiation
|
|
alternate</div>
|
|
<div class="column"><i class="skull crossbones icon"
|
|
data-search-terms="Dungeons & Dragons, alert, bones, d&d, danger, dead, deadly, death, dnd, fantasy, halloween, holiday, jolly-roger, pirate, poison, skeleton, warning"></i>skull
|
|
crossbones</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Animals</h4>
|
|
<p>Icons can represent animals</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="cat icon"
|
|
data-search-terms="feline, halloween, holiday, kitten, kitty, meow, pet"></i>cat</div>
|
|
<div class="column"><i class="crow icon"
|
|
data-search-terms="bird, bullfrog, fauna, halloween, holiday, toad"></i>crow</div>
|
|
<div class="column"><i class="dog icon"
|
|
data-search-terms="animal, canine, fauna, mammal, pet, pooch, puppy, woof"></i>dog</div>
|
|
<div class="column"><i class="dove icon" data-search-terms="bird, fauna, flying, peace, war"></i>dove
|
|
</div>
|
|
<div class="column"><i class="dragon icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, fire, lizard, serpent"></i>dragon
|
|
</div>
|
|
<div class="column"><i class="feather icon"
|
|
data-search-terms="bird, light, plucked, quill, write"></i>feather</div>
|
|
<div class="column"><i class="feather alternate icon"
|
|
data-search-terms="bird, light, plucked, quill, write"></i>feather alternate</div>
|
|
<div class="column"><i class="fish icon" data-search-terms="fauna, gold, seafood, swimming"></i>fish
|
|
</div>
|
|
<div class="column"><i class="frog icon"
|
|
data-search-terms="amphibian, bullfrog, fauna, hop, kermit, kiss, prince, ribbit, toad, wart"></i>frog
|
|
</div>
|
|
<div class="column"><i class="hippo icon"
|
|
data-search-terms="animal, fauna, hippopotamus, hungry, mammal"></i>hippo</div>
|
|
<div class="column"><i class="horse icon"
|
|
data-search-terms="equus, fauna, mammmal, mare, neigh, pony"></i>horse</div>
|
|
<div class="column"><i class="horse head icon"
|
|
data-search-terms="equus, fauna, mammmal, mare, neigh, pony"></i>horse head</div>
|
|
<div class="column"><i class="kiwi bird icon" data-search-terms="bird, fauna, new zealand"></i>kiwi bird
|
|
</div>
|
|
<div class="column"><i class="otter icon"
|
|
data-search-terms="animal, badger, fauna, fur, mammal, marten"></i>otter</div>
|
|
<div class="column"><i class="paw icon" data-search-terms="animal, cat, dog, pet, print"></i>paw</div>
|
|
<div class="column"><i class="spider icon"
|
|
data-search-terms="arachnid, bug, charlotte, crawl, eight, halloween"></i>spider</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Arrows</h4>
|
|
<p>Icons can be used to indicate a direction</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="angle double down icon"
|
|
data-search-terms="arrows, caret, download, expand"></i>angle double down</div>
|
|
<div class="column"><i class="angle double left icon"
|
|
data-search-terms="arrows, back, caret, laquo, previous, quote"></i>angle double left</div>
|
|
<div class="column"><i class="angle double right icon"
|
|
data-search-terms="arrows, caret, forward, more, next, quote, raquo"></i>angle double right
|
|
</div>
|
|
<div class="column"><i class="angle double up icon"
|
|
data-search-terms="arrows, caret, collapse, upload"></i>angle double up</div>
|
|
<div class="column"><i class="angle down icon"
|
|
data-search-terms="arrow, caret, download, expand"></i>angle down</div>
|
|
<div class="column"><i class="angle left icon"
|
|
data-search-terms="arrow, back, caret, less, previous"></i>angle left</div>
|
|
<div class="column"><i class="angle right icon"
|
|
data-search-terms="arrow, care, forward, more, next"></i>angle right</div>
|
|
<div class="column"><i class="angle up icon"
|
|
data-search-terms="arrow, caret, collapse, upload"></i>angle up</div>
|
|
<div class="column"><i class="arrow alternate circle down icon"
|
|
data-search-terms="arrow-circle-o-down, download"></i>arrow alternate circle down</div>
|
|
<div class="column"><i class="arrow alternate circle down outline icon"
|
|
data-search-terms="arrow-circle-o-down, download"></i>arrow alternate circle down outline</div>
|
|
<div class="column"><i class="arrow alternate circle left icon"
|
|
data-search-terms="arrow-circle-o-left, back, previous"></i>arrow alternate circle left</div>
|
|
<div class="column"><i class="arrow alternate circle left outline icon"
|
|
data-search-terms="arrow-circle-o-left, back, previous"></i>arrow alternate circle left outline
|
|
</div>
|
|
<div class="column"><i class="arrow alternate circle right icon"
|
|
data-search-terms="arrow-circle-o-right, forward, next"></i>arrow alternate circle right</div>
|
|
<div class="column"><i class="arrow alternate circle right outline icon"
|
|
data-search-terms="arrow-circle-o-right, forward, next"></i>arrow alternate circle right outline
|
|
</div>
|
|
<div class="column"><i class="arrow alternate circle up icon"
|
|
data-search-terms="arrow-circle-o-up"></i>arrow alternate circle up</div>
|
|
<div class="column"><i class="arrow alternate circle up outline icon"
|
|
data-search-terms="arrow-circle-o-up"></i>arrow alternate circle up outline</div>
|
|
<div class="column"><i class="arrow circle down icon" data-search-terms="download"></i>arrow circle down
|
|
</div>
|
|
<div class="column"><i class="arrow circle left icon" data-search-terms="back, previous"></i>arrow
|
|
circle left</div>
|
|
<div class="column"><i class="arrow circle right icon" data-search-terms="forward, next"></i>arrow
|
|
circle right</div>
|
|
<div class="column"><i class="arrow circle up icon" data-search-terms="upload"></i>arrow circle up</div>
|
|
<div class="column"><i class="arrow down icon" data-search-terms="download"></i>arrow down</div>
|
|
<div class="column"><i class="arrow left icon" data-search-terms="back, previous"></i>arrow left</div>
|
|
<div class="column"><i class="arrow right icon" data-search-terms="forward, next"></i>arrow right</div>
|
|
<div class="column"><i class="arrow up icon" data-search-terms="forward, upload"></i>arrow up</div>
|
|
<div class="column"><i class="arrows alternate icon"
|
|
data-search-terms="arrow, arrows, bigger, enlarge, expand, fullscreen, move, position, reorder, resize"></i>arrows
|
|
alternate</div>
|
|
<div class="column"><i class="arrows alternate horizontal icon"
|
|
data-search-terms="arrows-h, expand, horizontal, landscape, resize, wide"></i>arrows alternate
|
|
horizontal</div>
|
|
<div class="column"><i class="arrows alternate vertical icon"
|
|
data-search-terms="arrows-v, expand, portrait, resize, tall, vertical"></i>arrows alternate
|
|
vertical</div>
|
|
<div class="column"><i class="caret down icon"
|
|
data-search-terms="arrow, dropdown, expand, menu, more, triangle"></i>caret down</div>
|
|
<div class="column"><i class="caret left icon"
|
|
data-search-terms="arrow, back, previous, triangle"></i>caret left</div>
|
|
<div class="column"><i class="caret right icon"
|
|
data-search-terms="arrow, forward, next, triangle"></i>caret right</div>
|
|
<div class="column"><i class="caret square down icon"
|
|
data-search-terms="arrow, caret-square-o-down, dropdown, expand, menu, more, triangle"></i>caret
|
|
square down</div>
|
|
<div class="column"><i class="caret square down outline icon"
|
|
data-search-terms="arrow, caret-square-o-down, dropdown, expand, menu, more, triangle"></i>caret
|
|
square down outline</div>
|
|
<div class="column"><i class="caret square left icon"
|
|
data-search-terms="arrow, back, caret-square-o-left, previous, triangle"></i>caret square left
|
|
</div>
|
|
<div class="column"><i class="caret square left outline icon"
|
|
data-search-terms="arrow, back, caret-square-o-left, previous, triangle"></i>caret square left
|
|
outline</div>
|
|
<div class="column"><i class="caret square right icon"
|
|
data-search-terms="arrow, caret-square-o-right, forward, next, triangle"></i>caret square right
|
|
</div>
|
|
<div class="column"><i class="caret square right outline icon"
|
|
data-search-terms="arrow, caret-square-o-right, forward, next, triangle"></i>caret square right
|
|
outline</div>
|
|
<div class="column"><i class="caret square up icon"
|
|
data-search-terms="arrow, caret-square-o-up, collapse, triangle, upload"></i>caret square up
|
|
</div>
|
|
<div class="column"><i class="caret square up outline icon"
|
|
data-search-terms="arrow, caret-square-o-up, collapse, triangle, upload"></i>caret square up
|
|
outline</div>
|
|
<div class="column"><i class="caret up icon" data-search-terms="arrow, collapse, triangle"></i>caret up
|
|
</div>
|
|
<div class="column"><i class="cart arrow down icon"
|
|
data-search-terms="download, save, shopping"></i>cart arrow down</div>
|
|
<div class="column"><i class="chartline icon"
|
|
data-search-terms="activity, analytics, chart, dashboard, gain, graph, increase, line"></i>chartline
|
|
</div>
|
|
<div class="column"><i class="chevron circle down icon"
|
|
data-search-terms="arrow, download, dropdown, menu, more"></i>chevron circle down</div>
|
|
<div class="column"><i class="chevron circle left icon"
|
|
data-search-terms="arrow, back, previous"></i>chevron circle left</div>
|
|
<div class="column"><i class="chevron circle right icon"
|
|
data-search-terms="arrow, forward, next"></i>chevron circle right</div>
|
|
<div class="column"><i class="chevron circle up icon"
|
|
data-search-terms="arrow, collapse, upload"></i>chevron circle up</div>
|
|
<div class="column"><i class="chevron down icon" data-search-terms="arrow, download, expand"></i>chevron
|
|
down</div>
|
|
<div class="column"><i class="chevron left icon"
|
|
data-search-terms="arrow, back, bracket, previous"></i>chevron left</div>
|
|
<div class="column"><i class="chevron right icon"
|
|
data-search-terms="arrow, bracket, forward, next"></i>chevron right</div>
|
|
<div class="column"><i class="chevron up icon" data-search-terms="arrow, collapse, upload"></i>chevron
|
|
up</div>
|
|
<div class="column"><i class="cloud download alternate icon"
|
|
data-search-terms="download, export, save"></i>cloud download alternate</div>
|
|
<div class="column"><i class="cloud upload alternate icon"
|
|
data-search-terms="cloud-upload, import, save, upload"></i>cloud upload alternate</div>
|
|
<div class="column"><i class="compress alternate icon"
|
|
data-search-terms="collapse, fullscreen, minimize, move, resize, shrink, smaller"></i>compress
|
|
alternate</div>
|
|
<div class="column"><i class="compress arrows alternate icon"
|
|
data-search-terms="collapse, fullscreen, minimize, move, resize, shrink, smaller"></i>compress
|
|
arrows alternate</div>
|
|
<div class="column"><i class="download icon"
|
|
data-search-terms="export, hard drive, save, transfer"></i>download</div>
|
|
<div class="column"><i class="exchange alternate icon"
|
|
data-search-terms="arrow, arrows, exchange, reciprocate, return, swap, transfer"></i>exchange
|
|
alternate</div>
|
|
<div class="column"><i class="expand alternate icon"
|
|
data-search-terms="arrows, bigger, enlarge, fullscreen, resize"></i>expand alternate</div>
|
|
<div class="column"><i class="expand arrows alternate icon"
|
|
data-search-terms="bigger, enlarge, fullscreen, move, resize"></i>expand arrows alternate</div>
|
|
<div class="column"><i class="external alternate icon"
|
|
data-search-terms="external-link, new, open, share"></i>external alternate</div>
|
|
<div class="column"><i class="external link square alternate icon"
|
|
data-search-terms="external-link-square, new, open, share"></i>external link square alternate
|
|
</div>
|
|
<div class="column"><i class="hand point down icon"
|
|
data-search-terms="finger, hand-o-down, point"></i>hand point down</div>
|
|
<div class="column"><i class="hand point down outline icon"
|
|
data-search-terms="finger, hand-o-down, point"></i>hand point down outline</div>
|
|
<div class="column"><i class="hand point left icon"
|
|
data-search-terms="back, finger, hand-o-left, left, point, previous"></i>hand point left</div>
|
|
<div class="column"><i class="hand point left outline icon"
|
|
data-search-terms="back, finger, hand-o-left, left, point, previous"></i>hand point left outline
|
|
</div>
|
|
<div class="column"><i class="hand point right icon"
|
|
data-search-terms="finger, forward, hand-o-right, next, point, right"></i>hand point right</div>
|
|
<div class="column"><i class="hand point right outline icon"
|
|
data-search-terms="finger, forward, hand-o-right, next, point, right"></i>hand point right
|
|
outline</div>
|
|
<div class="column"><i class="hand point up icon" data-search-terms="finger, hand-o-up, point"></i>hand
|
|
point up</div>
|
|
<div class="column"><i class="hand point up outline icon"
|
|
data-search-terms="finger, hand-o-up, point"></i>hand point up outline</div>
|
|
<div class="column"><i class="hand pointer icon" data-search-terms="arrow, cursor, select"></i>hand
|
|
pointer</div>
|
|
<div class="column"><i class="hand pointer outline icon"
|
|
data-search-terms="arrow, cursor, select"></i>hand pointer outline</div>
|
|
<div class="column"><i class="history icon"
|
|
data-search-terms="Rewind, clock, reverse, time, time machine"></i>history</div>
|
|
<div class="column"><i class="level down alternate icon" data-search-terms="arrow, level-down"></i>level
|
|
down alternate</div>
|
|
<div class="column"><i class="level up alternate icon" data-search-terms="arrow, level-up"></i>level up
|
|
alternate</div>
|
|
<div class="column"><i class="location arrow icon"
|
|
data-search-terms="address, compass, coordinate, direction, gps, map, navigation, place"></i>location
|
|
arrow</div>
|
|
<div class="column"><i class="long arrow alternate down icon"
|
|
data-search-terms="download, long-arrow-down"></i>long arrow alternate down</div>
|
|
<div class="column"><i class="long arrow alternate left icon"
|
|
data-search-terms="back, long-arrow-left, previous"></i>long arrow alternate left</div>
|
|
<div class="column"><i class="long arrow alternate right icon"
|
|
data-search-terms="forward, long-arrow-right, next"></i>long arrow alternate right</div>
|
|
<div class="column"><i class="long arrow alternate up icon"
|
|
data-search-terms="long-arrow-up, upload"></i>long arrow alternate up</div>
|
|
<div class="column"><i class="mouse pointer icon" data-search-terms="arrow, cursor, select"></i>mouse
|
|
pointer</div>
|
|
<div class="column"><i class="play icon"
|
|
data-search-terms="audio, music, playing, sound, start, video"></i>play</div>
|
|
<div class="column"><i class="random icon"
|
|
data-search-terms="arrows, shuffle, sort, swap, switch, transfer"></i>random</div>
|
|
<div class="column"><i class="recycle icon"
|
|
data-search-terms="Waste, compost, garbage, reuse, trash"></i>recycle</div>
|
|
<div class="column"><i class="redo icon" data-search-terms="forward, refresh, reload, repeat"></i>redo
|
|
</div>
|
|
<div class="column"><i class="redo alternate icon"
|
|
data-search-terms="forward, refresh, reload, repeat"></i>redo alternate</div>
|
|
<div class="column"><i class="reply icon" data-search-terms="mail, message, respond"></i>reply</div>
|
|
<div class="column"><i class="reply all icon" data-search-terms="mail, message, respond"></i>reply all
|
|
</div>
|
|
<div class="column"><i class="retweet icon" data-search-terms="refresh, reload, share, swap"></i>retweet
|
|
</div>
|
|
<div class="column"><i class="share icon" data-search-terms="forward, save, send, social"></i>share
|
|
</div>
|
|
<div class="column"><i class="share square icon"
|
|
data-search-terms="forward, save, send, social"></i>share square</div>
|
|
<div class="column"><i class="share square outline icon"
|
|
data-search-terms="forward, save, send, social"></i>share square outline</div>
|
|
<div class="column"><i class="sign in alternate icon"
|
|
data-search-terms="arrow, enter, join, log in, login, sign in, sign up, sign-in, signin, signup"></i>sign
|
|
in alternate</div>
|
|
<div class="column"><i class="sign out alternate icon"
|
|
data-search-terms="arrow, exit, leave, log out, logout, sign-out"></i>sign out alternate</div>
|
|
<div class="column"><i class="sort icon" data-search-terms="filter, order"></i>sort</div>
|
|
<div class="column"><i class="sort alphabet down icon"
|
|
data-search-terms="alphabetical, arrange, filter, order, sort-alpha-asc"></i>sort alphabet down
|
|
</div>
|
|
<div class="column"><i class="sort alphabet down alternate icon"
|
|
data-search-terms="alphabetical, arrange, filter, order, sort-alpha-asc"></i>sort alphabet down
|
|
alternate</div>
|
|
<div class="column"><i class="sort alphabet up icon"
|
|
data-search-terms="alphabetical, arrange, filter, order, sort-alpha-desc"></i>sort alphabet up
|
|
</div>
|
|
<div class="column"><i class="sort alphabet up alternate icon"
|
|
data-search-terms="alphabetical, arrange, filter, order, sort-alpha-desc"></i>sort alphabet up
|
|
alternate</div>
|
|
<div class="column"><i class="sort amount down icon"
|
|
data-search-terms="arrange, filter, number, order, sort-amount-asc"></i>sort amount down</div>
|
|
<div class="column"><i class="sort amount down alternate icon"
|
|
data-search-terms="arrange, filter, order, sort-amount-asc"></i>sort amount down alternate</div>
|
|
<div class="column"><i class="sort amount up icon"
|
|
data-search-terms="arrange, filter, order, sort-amount-desc"></i>sort amount up</div>
|
|
<div class="column"><i class="sort amount up alternate icon"
|
|
data-search-terms="arrange, filter, order, sort-amount-desc"></i>sort amount up alternate</div>
|
|
<div class="column"><i class="sort down icon"
|
|
data-search-terms="arrow, descending, filter, order, sort-desc"></i>sort down</div>
|
|
<div class="column"><i class="sort numeric down icon"
|
|
data-search-terms="arrange, filter, numbers, order, sort-numeric-asc"></i>sort numeric down
|
|
</div>
|
|
<div class="column"><i class="sort numeric down alternate icon"
|
|
data-search-terms="arrange, filter, numbers, order, sort-numeric-asc"></i>sort numeric down
|
|
alternate</div>
|
|
<div class="column"><i class="sort numeric up icon"
|
|
data-search-terms="arrange, filter, numbers, order, sort-numeric-desc"></i>sort numeric up</div>
|
|
<div class="column"><i class="sort numeric up alternate icon"
|
|
data-search-terms="arrange, filter, numbers, order, sort-numeric-desc"></i>sort numeric up
|
|
alternate</div>
|
|
<div class="column"><i class="sort up icon"
|
|
data-search-terms="arrow, ascending, filter, order, sort-asc"></i>sort up</div>
|
|
<div class="column"><i class="sync icon"
|
|
data-search-terms="exchange, refresh, reload, rotate, swap"></i>sync</div>
|
|
<div class="column"><i class="sync alternate icon"
|
|
data-search-terms="exchange, refresh, reload, rotate, swap"></i>sync alternate</div>
|
|
<div class="column"><i class="text height icon"
|
|
data-search-terms="edit, font, format, text, type"></i>text height</div>
|
|
<div class="column"><i class="text width icon"
|
|
data-search-terms="edit, font, format, text, type"></i>text width</div>
|
|
<div class="column"><i class="undo icon"
|
|
data-search-terms="back, control z, exchange, oops, return, rotate, swap"></i>undo</div>
|
|
<div class="column"><i class="undo alternate icon"
|
|
data-search-terms="back, control z, exchange, oops, return, swap"></i>undo alternate</div>
|
|
<div class="column"><i class="upload icon" data-search-terms="hard drive, import, publish"></i>upload
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Audio & Video</h4>
|
|
<p>Icons can be used to represent common ways to interact with audio and video</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="audio description icon"
|
|
data-search-terms="blind, narration, video, visual"></i>audio description</div>
|
|
<div class="column"><i class="backward icon" data-search-terms="previous, rewind"></i>backward</div>
|
|
<div class="column"><i class="broadcast tower icon"
|
|
data-search-terms="airwaves, antenna, radio, reception, waves"></i>broadcast tower</div>
|
|
<div class="column"><i class="circle icon"
|
|
data-search-terms="circle-thin, diameter, dot, ellipse, notification, round"></i>circle</div>
|
|
<div class="column"><i class="circle outline icon"
|
|
data-search-terms="circle-thin, diameter, dot, ellipse, notification, round"></i>circle outline
|
|
</div>
|
|
<div class="column"><i class="closed captioning icon"
|
|
data-search-terms="cc, deaf, hearing, subtitle, subtitling, text, video"></i>closed captioning
|
|
</div>
|
|
<div class="column"><i class="closed captioning outline icon"
|
|
data-search-terms="cc, deaf, hearing, subtitle, subtitling, text, video"></i>closed captioning
|
|
outline</div>
|
|
<div class="column"><i class="compress icon"
|
|
data-search-terms="collapse, fullscreen, minimize, move, resize, shrink, smaller"></i>compress
|
|
</div>
|
|
<div class="column"><i class="compress alternate icon"
|
|
data-search-terms="collapse, fullscreen, minimize, move, resize, shrink, smaller"></i>compress
|
|
alternate</div>
|
|
<div class="column"><i class="compress arrows alternate icon"
|
|
data-search-terms="collapse, fullscreen, minimize, move, resize, shrink, smaller"></i>compress
|
|
arrows alternate</div>
|
|
<div class="column"><i class="eject icon" data-search-terms="abort, cancel, cd, discharge"></i>eject
|
|
</div>
|
|
<div class="column"><i class="expand icon"
|
|
data-search-terms="bigger, enlarge, fullscreen, resize"></i>expand</div>
|
|
<div class="column"><i class="expand alternate icon"
|
|
data-search-terms="arrows, bigger, enlarge, fullscreen, resize"></i>expand alternate</div>
|
|
<div class="column"><i class="expand arrows alternate icon"
|
|
data-search-terms="bigger, enlarge, fullscreen, move, resize"></i>expand arrows alternate</div>
|
|
<div class="column"><i class="fast backward icon"
|
|
data-search-terms="beginning, first, previous, rewind, start"></i>fast backward</div>
|
|
<div class="column"><i class="fast forward icon" data-search-terms="end, last, next"></i>fast forward
|
|
</div>
|
|
<div class="column"><i class="file audio icon"
|
|
data-search-terms="document, mp3, music, page, play, sound"></i>file audio</div>
|
|
<div class="column"><i class="file audio outline icon"
|
|
data-search-terms="document, mp3, music, page, play, sound"></i>file audio outline</div>
|
|
<div class="column"><i class="file video icon"
|
|
data-search-terms="document, m4v, movie, mp4, play"></i>file video</div>
|
|
<div class="column"><i class="file video outline icon"
|
|
data-search-terms="document, m4v, movie, mp4, play"></i>file video outline</div>
|
|
<div class="column"><i class="film icon" data-search-terms="cinema, movie, strip, video"></i>film</div>
|
|
<div class="column"><i class="forward icon" data-search-terms="forward, next, skip"></i>forward</div>
|
|
<div class="column"><i class="headphones icon"
|
|
data-search-terms="audio, listen, music, sound, speaker"></i>headphones</div>
|
|
<div class="column"><i class="microphone icon"
|
|
data-search-terms="audio, podcast, record, sing, sound, voice"></i>microphone</div>
|
|
<div class="column"><i class="microphone alternate icon"
|
|
data-search-terms="audio, podcast, record, sing, sound, voice"></i>microphone alternate</div>
|
|
<div class="column"><i class="microphone alternate slash icon"
|
|
data-search-terms="audio, disable, mute, podcast, record, sing, sound, voice"></i>microphone
|
|
alternate slash</div>
|
|
<div class="column"><i class="microphone slash icon"
|
|
data-search-terms="audio, disable, mute, podcast, record, sing, sound, voice"></i>microphone
|
|
slash</div>
|
|
<div class="column"><i class="music icon"
|
|
data-search-terms="lyrics, melody, note, sing, sound"></i>music</div>
|
|
<div class="column"><i class="pause icon" data-search-terms="hold, wait"></i>pause</div>
|
|
<div class="column"><i class="pause circle icon" data-search-terms="hold, wait"></i>pause circle</div>
|
|
<div class="column"><i class="pause circle outline icon" data-search-terms="hold, wait"></i>pause circle
|
|
outline</div>
|
|
<div class="column"><i class="phone volume icon"
|
|
data-search-terms="call, earphone, number, sound, support, telephone, voice, volume-control-phone"></i>phone
|
|
volume</div>
|
|
<div class="column"><i class="photo video icon"
|
|
data-search-terms="av, film, image, library, media"></i>photo video</div>
|
|
<div class="column"><i class="play icon"
|
|
data-search-terms="audio, music, playing, sound, start, video"></i>play</div>
|
|
<div class="column"><i class="play circle icon"
|
|
data-search-terms="audio, music, playing, sound, start, video"></i>play circle</div>
|
|
<div class="column"><i class="play circle outline icon"
|
|
data-search-terms="audio, music, playing, sound, start, video"></i>play circle outline</div>
|
|
<div class="column"><i class="podcast icon"
|
|
data-search-terms="audio, broadcast, music, sound"></i>podcast</div>
|
|
<div class="column"><i class="random icon"
|
|
data-search-terms="arrows, shuffle, sort, swap, switch, transfer"></i>random</div>
|
|
<div class="column"><i class="redo icon" data-search-terms="forward, refresh, reload, repeat"></i>redo
|
|
</div>
|
|
<div class="column"><i class="redo alternate icon"
|
|
data-search-terms="forward, refresh, reload, repeat"></i>redo alternate</div>
|
|
<div class="column"><i class="rss icon" data-search-terms="blog, feed, journal, news, writing"></i>rss
|
|
</div>
|
|
<div class="column"><i class="rss square icon"
|
|
data-search-terms="blog, feed, journal, news, writing"></i>rss square</div>
|
|
<div class="column"><i class="step backward icon"
|
|
data-search-terms="beginning, first, previous, rewind, start"></i>step backward</div>
|
|
<div class="column"><i class="step forward icon" data-search-terms="end, last, next"></i>step forward
|
|
</div>
|
|
<div class="column"><i class="stop icon" data-search-terms="block, box, square"></i>stop</div>
|
|
<div class="column"><i class="stop circle icon" data-search-terms="block, box, circle, square"></i>stop
|
|
circle</div>
|
|
<div class="column"><i class="stop circle outline icon"
|
|
data-search-terms="block, box, circle, square"></i>stop circle outline</div>
|
|
<div class="column"><i class="sync icon"
|
|
data-search-terms="exchange, refresh, reload, rotate, swap"></i>sync</div>
|
|
<div class="column"><i class="sync alternate icon"
|
|
data-search-terms="exchange, refresh, reload, rotate, swap"></i>sync alternate</div>
|
|
<div class="column"><i class="tv icon" data-search-terms="computer, display, monitor, television"></i>tv
|
|
</div>
|
|
<div class="column"><i class="undo icon"
|
|
data-search-terms="back, control z, exchange, oops, return, rotate, swap"></i>undo</div>
|
|
<div class="column"><i class="undo alternate icon"
|
|
data-search-terms="back, control z, exchange, oops, return, swap"></i>undo alternate</div>
|
|
<div class="column"><i class="video icon"
|
|
data-search-terms="camera, film, movie, record, video-camera"></i>video</div>
|
|
<div class="column"><i class="volume down icon"
|
|
data-search-terms="audio, lower, music, quieter, sound, speaker"></i>volume down</div>
|
|
<div class="column"><i class="volume mute icon"
|
|
data-search-terms="audio, music, quiet, sound, speaker"></i>volume mute</div>
|
|
<div class="column"><i class="volume off icon"
|
|
data-search-terms="audio, ban, music, mute, quiet, silent, sound"></i>volume off</div>
|
|
<div class="column"><i class="volume up icon"
|
|
data-search-terms="audio, higher, louder, music, sound, speaker"></i>volume up</div>
|
|
<div class="column"><i class="youtube icon"
|
|
data-search-terms="film, video, youtube-play, youtube-square"></i>youtube</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Automotive</h4>
|
|
<p>Icons can represent vehicles and automotive activities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="air freshener icon"
|
|
data-search-terms="car, deodorize, fresh, pine, scent"></i>air freshener</div>
|
|
<div class="column"><i class="ambulance icon"
|
|
data-search-terms="covid-19, emergency, emt, er, help, hospital, support, vehicle"></i>ambulance
|
|
</div>
|
|
<div class="column"><i class="bus icon"
|
|
data-search-terms="public transportation, transportation, travel, vehicle"></i>bus</div>
|
|
<div class="column"><i class="bus alternate icon"
|
|
data-search-terms="mta, public transportation, transportation, travel, vehicle"></i>bus
|
|
alternate</div>
|
|
<div class="column"><i class="car icon"
|
|
data-search-terms="auto, automobile, sedan, transportation, travel, vehicle"></i>car</div>
|
|
<div class="column"><i class="car alternate icon"
|
|
data-search-terms="auto, automobile, sedan, transportation, travel, vehicle"></i>car alternate
|
|
</div>
|
|
<div class="column"><i class="car battery icon"
|
|
data-search-terms="auto, electric, mechanic, power"></i>car battery</div>
|
|
<div class="column"><i class="car crash icon"
|
|
data-search-terms="accident, auto, automobile, insurance, sedan, transportation, vehicle, wreck"></i>car
|
|
crash</div>
|
|
<div class="column"><i class="car side icon"
|
|
data-search-terms="auto, automobile, sedan, transportation, travel, vehicle"></i>car side</div>
|
|
<div class="column"><i class="caravan icon"
|
|
data-search-terms="camper, motor home, rv, trailer, travel"></i>caravan</div>
|
|
<div class="column"><i class="charging station icon"
|
|
data-search-terms="electric, ev, tesla, vehicle"></i>charging station</div>
|
|
<div class="column"><i class="gas pump icon" data-search-terms="car, fuel, gasoline, petrol"></i>gas
|
|
pump</div>
|
|
<div class="column"><i class="motorcycle icon"
|
|
data-search-terms="bike, machine, transportation, vehicle"></i>motorcycle</div>
|
|
<div class="column"><i class="oil can icon"
|
|
data-search-terms="auto, crude, gasoline, grease, lubricate, petroleum"></i>oil can</div>
|
|
<div class="column"><i class="shuttle van icon"
|
|
data-search-terms="airport, machine, public-transportation, transportation, travel, vehicle"></i>shuttle
|
|
van</div>
|
|
<div class="column"><i class="tachometer alternate icon"
|
|
data-search-terms="dashboard, fast, odometer, speed, speedometer"></i>tachometer alternate</div>
|
|
<div class="column"><i class="taxi icon"
|
|
data-search-terms="cab, cabbie, car, car service, lyft, machine, transportation, travel, uber, vehicle"></i>taxi
|
|
</div>
|
|
<div class="column"><i class="trailer icon" data-search-terms="carry, haul, moving, travel"></i>trailer
|
|
</div>
|
|
<div class="column"><i class="truck icon"
|
|
data-search-terms="cargo, delivery, shipping, vehicle"></i>truck</div>
|
|
<div class="column"><i class="truck monster icon" data-search-terms="offroad, vehicle, wheel"></i>truck
|
|
monster</div>
|
|
<div class="column"><i class="truck pickup icon" data-search-terms="cargo, vehicle"></i>truck pickup
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Autumn</h4>
|
|
<p>Icons which represent the Autumn season</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="campground icon"
|
|
data-search-terms="camping, fall, outdoors, teepee, tent, tipi"></i>campground</div>
|
|
<div class="column"><i class="cloud sun icon"
|
|
data-search-terms="clear, day, daytime, fall, outdoors, overcast, partly cloudy"></i>cloud sun
|
|
</div>
|
|
<div class="column"><i class="drumstick bite icon"
|
|
data-search-terms="bone, chicken, leg, meat, poultry, turkey"></i>drumstick bite</div>
|
|
<div class="column"><i class="football ball icon"
|
|
data-search-terms="ball, fall, nfl, pigskin, seasonal"></i>football ball</div>
|
|
<div class="column"><i class="fruit-apple icon"
|
|
data-search-terms="fall, fruit, fuji, macintosh, orchard, seasonal, vegan"></i>fruit-apple</div>
|
|
<div class="column"><i class="hiking icon"
|
|
data-search-terms="activity, backpack, fall, fitness, outdoors, person, seasonal, walking"></i>hiking
|
|
</div>
|
|
<div class="column"><i class="mountain icon"
|
|
data-search-terms="glacier, hiking, hill, landscape, travel, view"></i>mountain</div>
|
|
<div class="column"><i class="tractor icon" data-search-terms="agriculture, farm, vehicle"></i>tractor
|
|
</div>
|
|
<div class="column"><i class="tree icon"
|
|
data-search-terms="bark, fall, flora, forest, nature, plant, seasonal"></i>tree</div>
|
|
<div class="column"><i class="wind icon"
|
|
data-search-terms="air, blow, breeze, fall, seasonal, weather"></i>wind</div>
|
|
<div class="column"><i class="wine bottle icon"
|
|
data-search-terms="alcohol, beverage, cabernet, drink, glass, grapes, merlot, sauvignon"></i>wine
|
|
bottle</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Beverage</h4>
|
|
<p>Icons which represent types of beverages</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="beer icon"
|
|
data-search-terms="alcohol, ale, bar, beverage, brewery, drink, lager, liquor, mug, stein"></i>beer
|
|
</div>
|
|
<div class="column"><i class="blender icon"
|
|
data-search-terms="cocktail, milkshake, mixer, puree, smoothie"></i>blender</div>
|
|
<div class="column"><i class="cocktail icon"
|
|
data-search-terms="alcohol, beverage, drink, gin, glass, margarita, martini, vodka"></i>cocktail
|
|
</div>
|
|
<div class="column"><i class="coffee icon"
|
|
data-search-terms="beverage, breakfast, cafe, drink, fall, morning, mug, seasonal, tea"></i>coffee
|
|
</div>
|
|
<div class="column"><i class="flask icon"
|
|
data-search-terms="beaker, experimental, labs, science"></i>flask</div>
|
|
<div class="column"><i class="glass cheers icon"
|
|
data-search-terms="alcohol, bar, beverage, celebration, champagne, clink, drink, holiday, new year's eve, party, toast"></i>glass
|
|
cheers</div>
|
|
<div class="column"><i class="glass martini icon"
|
|
data-search-terms="alcohol, bar, beverage, drink, liquor"></i>glass martini</div>
|
|
<div class="column"><i class="glass martini alternate icon"
|
|
data-search-terms="alcohol, bar, beverage, drink, liquor"></i>glass martini alternate</div>
|
|
<div class="column"><i class="glass whiskey icon"
|
|
data-search-terms="alcohol, bar, beverage, bourbon, drink, liquor, neat, rye, scotch, whisky"></i>glass
|
|
whiskey</div>
|
|
<div class="column"><i class="mug hot icon"
|
|
data-search-terms="caliente, cocoa, coffee, cup, drink, holiday, hot chocolate, steam, tea, warmth"></i>mug
|
|
hot</div>
|
|
<div class="column"><i class="wine bottle icon"
|
|
data-search-terms="alcohol, beverage, cabernet, drink, glass, grapes, merlot, sauvignon"></i>wine
|
|
bottle</div>
|
|
<div class="column"><i class="wine glass icon"
|
|
data-search-terms="alcohol, beverage, cabernet, drink, grapes, merlot, sauvignon"></i>wine glass
|
|
</div>
|
|
<div class="column"><i class="wine glass alternate icon"
|
|
data-search-terms="alcohol, beverage, cabernet, drink, grapes, merlot, sauvignon"></i>wine glass
|
|
alternate</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Buildings</h4>
|
|
<p>Icons can represent common building types</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="archway icon"
|
|
data-search-terms="arc, monument, road, street, tunnel"></i>archway</div>
|
|
<div class="column"><i class="building icon"
|
|
data-search-terms="apartment, business, city, company, office, work"></i>building</div>
|
|
<div class="column"><i class="building outline icon"
|
|
data-search-terms="apartment, business, city, company, office, work"></i>building outline</div>
|
|
<div class="column"><i class="campground icon"
|
|
data-search-terms="camping, fall, outdoors, teepee, tent, tipi"></i>campground</div>
|
|
<div class="column"><i class="church icon"
|
|
data-search-terms="building, cathedral, chapel, community, religion"></i>church</div>
|
|
<div class="column"><i class="city icon"
|
|
data-search-terms="buildings, busy, skyscrapers, urban, windows"></i>city</div>
|
|
<div class="column"><i class="clinic medical icon"
|
|
data-search-terms="covid-19, doctor, general practitioner, hospital, infirmary, medicine, office, outpatient"></i>clinic
|
|
medical</div>
|
|
<div class="column"><i class="dungeon icon"
|
|
data-search-terms="Dungeons & Dragons, building, d&d, dnd, door, entrance, fantasy, gate"></i>dungeon
|
|
</div>
|
|
<div class="column"><i class="gopuram icon"
|
|
data-search-terms="building, entrance, hinduism, temple, tower"></i>gopuram</div>
|
|
<div class="column"><i class="home icon" data-search-terms="abode, building, house, main"></i>home</div>
|
|
<div class="column"><i class="hospital icon"
|
|
data-search-terms="building, covid-19, emergency room, medical center"></i>hospital</div>
|
|
<div class="column"><i class="hospital alternate icon"
|
|
data-search-terms="building, covid-19, emergency room, medical center"></i>hospital alternate
|
|
</div>
|
|
<div class="column"><i class="hospital outline icon"
|
|
data-search-terms="building, covid-19, emergency room, medical center"></i>hospital outline
|
|
</div>
|
|
<div class="column"><i class="hospital user icon"
|
|
data-search-terms="covid-19, doctor, network, patient, primary care"></i>hospital user</div>
|
|
<div class="column"><i class="hotel icon"
|
|
data-search-terms="building, inn, lodging, motel, resort, travel"></i>hotel</div>
|
|
<div class="column"><i class="house damage icon"
|
|
data-search-terms="building, devastation, disaster, home, insurance"></i>house damage</div>
|
|
<div class="column"><i class="igloo icon"
|
|
data-search-terms="dome, dwelling, eskimo, home, house, ice, snow"></i>igloo</div>
|
|
<div class="column"><i class="industry icon"
|
|
data-search-terms="building, factory, industrial, manufacturing, mill, warehouse"></i>industry
|
|
</div>
|
|
<div class="column"><i class="kaaba icon" data-search-terms="building, cube, islam, muslim"></i>kaaba
|
|
</div>
|
|
<div class="column"><i class="landmark icon"
|
|
data-search-terms="building, historic, memorable, monument, politics"></i>landmark</div>
|
|
<div class="column"><i class="monument icon"
|
|
data-search-terms="building, historic, landmark, memorable"></i>monument</div>
|
|
<div class="column"><i class="mosque icon"
|
|
data-search-terms="building, islam, landmark, muslim"></i>mosque</div>
|
|
<div class="column"><i class="place of worship icon"
|
|
data-search-terms="building, church, holy, mosque, synagogue"></i>place of worship</div>
|
|
<div class="column"><i class="school icon"
|
|
data-search-terms="building, education, learn, student, teacher"></i>school</div>
|
|
<div class="column"><i class="store icon"
|
|
data-search-terms="building, buy, purchase, shopping"></i>store</div>
|
|
<div class="column"><i class="store alternate icon"
|
|
data-search-terms="building, buy, purchase, shopping"></i>store alternate</div>
|
|
<div class="column"><i class="synagogue icon"
|
|
data-search-terms="building, jewish, judaism, religion, star of david, temple"></i>synagogue
|
|
</div>
|
|
<div class="column"><i class="torii gate icon" data-search-terms="building, shintoism"></i>torii gate
|
|
</div>
|
|
<div class="column"><i class="university icon"
|
|
data-search-terms="bank, building, college, higher education - students, institution"></i>university
|
|
</div>
|
|
<div class="column"><i class="vihara icon"
|
|
data-search-terms="buddhism, buddhist, building, monastery"></i>vihara</div>
|
|
<div class="column"><i class="warehouse icon"
|
|
data-search-terms="building, capacity, garage, inventory, storage"></i>warehouse</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Business</h4>
|
|
<p>Icons can be used to represent business and common business actions</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="address book icon"
|
|
data-search-terms="contact, directory, index, little black book, rolodex"></i>address book</div>
|
|
<div class="column"><i class="address book outline icon"
|
|
data-search-terms="contact, directory, index, little black book, rolodex"></i>address book
|
|
outline</div>
|
|
<div class="column"><i class="address card icon"
|
|
data-search-terms="about, contact, id, identification, postcard, profile"></i>address card</div>
|
|
<div class="column"><i class="address card outline icon"
|
|
data-search-terms="about, contact, id, identification, postcard, profile"></i>address card
|
|
outline</div>
|
|
<div class="column"><i class="archive icon" data-search-terms="box, package, save, storage"></i>archive
|
|
</div>
|
|
<div class="column"><i class="balance scale icon"
|
|
data-search-terms="balanced, justice, legal, measure, weight"></i>balance scale</div>
|
|
<div class="column"><i class="balance scale left icon"
|
|
data-search-terms="justice, legal, measure, unbalanced, weight"></i>balance scale left</div>
|
|
<div class="column"><i class="balance scale right icon"
|
|
data-search-terms="justice, legal, measure, unbalanced, weight"></i>balance scale right</div>
|
|
<div class="column"><i class="birthday cake icon"
|
|
data-search-terms="anniversary, bakery, candles, celebration, dessert, frosting, holiday, party, pastry"></i>birthday
|
|
cake</div>
|
|
<div class="column"><i class="book icon"
|
|
data-search-terms="diary, documentation, journal, library, read"></i>book</div>
|
|
<div class="column"><i class="briefcase icon"
|
|
data-search-terms="bag, business, luggage, office, work"></i>briefcase</div>
|
|
<div class="column"><i class="building icon"
|
|
data-search-terms="apartment, business, city, company, office, work"></i>building</div>
|
|
<div class="column"><i class="building outline icon"
|
|
data-search-terms="apartment, business, city, company, office, work"></i>building outline</div>
|
|
<div class="column"><i class="bullhorn icon"
|
|
data-search-terms="announcement, broadcast, louder, megaphone, share"></i>bullhorn</div>
|
|
<div class="column"><i class="bullseye icon"
|
|
data-search-terms="archery, goal, objective, target"></i>bullseye</div>
|
|
<div class="column"><i class="business time icon"
|
|
data-search-terms="alarm, briefcase, business socks, clock, flight of the conchords, reminder, wednesday"></i>business
|
|
time</div>
|
|
<div class="column"><i class="calculator icon"
|
|
data-search-terms="abacus, addition, arithmetic, counting, math, multiplication, subtraction"></i>calculator
|
|
</div>
|
|
<div class="column"><i class="calendar icon"
|
|
data-search-terms="calendar-o, date, event, schedule, time, when"></i>calendar</div>
|
|
<div class="column"><i class="calendar alternate icon"
|
|
data-search-terms="calendar, date, event, schedule, time, when"></i>calendar alternate</div>
|
|
<div class="column"><i class="calendar alternate outline icon"
|
|
data-search-terms="calendar, date, event, schedule, time, when"></i>calendar alternate outline
|
|
</div>
|
|
<div class="column"><i class="calendar outline icon"
|
|
data-search-terms="calendar-o, date, event, schedule, time, when"></i>calendar outline</div>
|
|
<div class="column"><i class="certificate icon"
|
|
data-search-terms="badge, star, verified"></i>certificate</div>
|
|
<div class="column"><i class="chart area icon"
|
|
data-search-terms="analytics, area, chart, graph"></i>chart area</div>
|
|
<div class="column"><i class="chart bar icon" data-search-terms="analytics, bar, chart, graph"></i>chart
|
|
bar</div>
|
|
<div class="column"><i class="chart bar outline icon"
|
|
data-search-terms="analytics, bar, chart, graph"></i>chart bar outline</div>
|
|
<div class="column"><i class="chart pie icon"
|
|
data-search-terms="analytics, chart, diagram, graph, pie"></i>chart pie</div>
|
|
<div class="column"><i class="chartline icon"
|
|
data-search-terms="activity, analytics, chart, dashboard, gain, graph, increase, line"></i>chartline
|
|
</div>
|
|
<div class="column"><i class="city icon"
|
|
data-search-terms="buildings, busy, skyscrapers, urban, windows"></i>city</div>
|
|
<div class="column"><i class="clipboard icon"
|
|
data-search-terms="copy, notes, paste, record"></i>clipboard</div>
|
|
<div class="column"><i class="clipboard outline icon"
|
|
data-search-terms="copy, notes, paste, record"></i>clipboard outline</div>
|
|
<div class="column"><i class="coffee icon"
|
|
data-search-terms="beverage, breakfast, cafe, drink, fall, morning, mug, seasonal, tea"></i>coffee
|
|
</div>
|
|
<div class="column"><i class="columns icon"
|
|
data-search-terms="browser, dashboard, organize, panes, split"></i>columns</div>
|
|
<div class="column"><i class="compass icon"
|
|
data-search-terms="directions, directory, location, menu, navigation, safari, travel"></i>compass
|
|
</div>
|
|
<div class="column"><i class="compass outline icon"
|
|
data-search-terms="directions, directory, location, menu, navigation, safari, travel"></i>compass
|
|
outline</div>
|
|
<div class="column"><i class="copy icon"
|
|
data-search-terms="clone, duplicate, file, files-o, paper, paste"></i>copy</div>
|
|
<div class="column"><i class="copy outline icon"
|
|
data-search-terms="clone, duplicate, file, files-o, paper, paste"></i>copy outline</div>
|
|
<div class="column"><i class="copyright icon"
|
|
data-search-terms="brand, mark, register, trademark"></i>copyright</div>
|
|
<div class="column"><i class="copyright outline icon"
|
|
data-search-terms="brand, mark, register, trademark"></i>copyright outline</div>
|
|
<div class="column"><i class="cut icon" data-search-terms="clip, scissors, snip"></i>cut</div>
|
|
<div class="column"><i class="edit icon" data-search-terms="edit, pen, pencil, update, write"></i>edit
|
|
</div>
|
|
<div class="column"><i class="edit outline icon"
|
|
data-search-terms="edit, pen, pencil, update, write"></i>edit outline</div>
|
|
<div class="column"><i class="envelope icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
</div>
|
|
<div class="column"><i class="envelope open icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
open</div>
|
|
<div class="column"><i class="envelope open outline icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
open outline</div>
|
|
<div class="column"><i class="envelope outline icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
outline</div>
|
|
<div class="column"><i class="envelope square icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
square</div>
|
|
<div class="column"><i class="eraser icon" data-search-terms="art, delete, remove, rubber"></i>eraser
|
|
</div>
|
|
<div class="column"><i class="fax icon"
|
|
data-search-terms="business, communicate, copy, facsimile, send"></i>fax</div>
|
|
<div class="column"><i class="file icon" data-search-terms="document, new, page, pdf, resume"></i>file
|
|
</div>
|
|
<div class="column"><i class="file alternate icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate</div>
|
|
<div class="column"><i class="file alternate outline icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate outline
|
|
</div>
|
|
<div class="column"><i class="file outline icon"
|
|
data-search-terms="document, new, page, pdf, resume"></i>file outline</div>
|
|
<div class="column"><i class="folder icon"
|
|
data-search-terms="archive, directory, document, file"></i>folder</div>
|
|
<div class="column"><i class="folder minus icon"
|
|
data-search-terms="archive, delete, directory, document, file, negative, remove"></i>folder
|
|
minus</div>
|
|
<div class="column"><i class="folder open icon"
|
|
data-search-terms="archive, directory, document, empty, file, new"></i>folder open</div>
|
|
<div class="column"><i class="folder open outline icon"
|
|
data-search-terms="archive, directory, document, empty, file, new"></i>folder open outline</div>
|
|
<div class="column"><i class="folder outline icon"
|
|
data-search-terms="archive, directory, document, file"></i>folder outline</div>
|
|
<div class="column"><i class="folder plus icon"
|
|
data-search-terms="add, archive, create, directory, document, file, new, positive"></i>folder
|
|
plus</div>
|
|
<div class="column"><i class="glasses icon"
|
|
data-search-terms="hipster, nerd, reading, sight, spectacles, vision"></i>glasses</div>
|
|
<div class="column"><i class="globe icon"
|
|
data-search-terms="all, coordinates, country, earth, global, gps, language, localize, location, map, online, place, planet, translate, travel, world"></i>globe
|
|
</div>
|
|
<div class="column"><i class="highlighter icon"
|
|
data-search-terms="edit, marker, sharpie, update, write"></i>highlighter</div>
|
|
<div class="column"><i class="industry icon"
|
|
data-search-terms="building, factory, industrial, manufacturing, mill, warehouse"></i>industry
|
|
</div>
|
|
<div class="column"><i class="landmark icon"
|
|
data-search-terms="building, historic, memorable, monument, politics"></i>landmark</div>
|
|
<div class="column"><i class="laptop house icon"
|
|
data-search-terms="computer, covid-19, device, office, remote, work from home"></i>laptop house
|
|
</div>
|
|
<div class="column"><i class="marker icon"
|
|
data-search-terms="design, edit, sharpie, update, write"></i>marker</div>
|
|
<div class="column"><i class="paperclip icon"
|
|
data-search-terms="attach, attachment, connect, link"></i>paperclip</div>
|
|
<div class="column"><i class="paste icon" data-search-terms="clipboard, copy, document, paper"></i>paste
|
|
</div>
|
|
<div class="column"><i class="pen icon" data-search-terms="design, edit, update, write"></i>pen</div>
|
|
<div class="column"><i class="pen alternate icon"
|
|
data-search-terms="design, edit, update, write"></i>pen alternate</div>
|
|
<div class="column"><i class="pen fancy icon"
|
|
data-search-terms="design, edit, fountain pen, update, write"></i>pen fancy</div>
|
|
<div class="column"><i class="pen nib icon"
|
|
data-search-terms="design, edit, fountain pen, update, write"></i>pen nib</div>
|
|
<div class="column"><i class="pen square icon"
|
|
data-search-terms="edit, pencil-square, update, write"></i>pen square</div>
|
|
<div class="column"><i class="pencil alternate icon"
|
|
data-search-terms="design, edit, pencil, update, write"></i>pencil alternate</div>
|
|
<div class="column"><i class="percent icon"
|
|
data-search-terms="discount, fraction, proportion, rate, ratio"></i>percent</div>
|
|
<div class="column"><i class="phone icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone</div>
|
|
<div class="column"><i class="phone alternate icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone alternate</div>
|
|
<div class="column"><i class="phone slash icon"
|
|
data-search-terms="call, cancel, earphone, mute, number, support, telephone, voice"></i>phone
|
|
slash</div>
|
|
<div class="column"><i class="phone square icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone square</div>
|
|
<div class="column"><i class="phone square alternate icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone square alternate
|
|
</div>
|
|
<div class="column"><i class="phone volume icon"
|
|
data-search-terms="call, earphone, number, sound, support, telephone, voice, volume-control-phone"></i>phone
|
|
volume</div>
|
|
<div class="column"><i class="print icon"
|
|
data-search-terms="business, copy, document, office, paper"></i>print</div>
|
|
<div class="column"><i class="project diagram icon"
|
|
data-search-terms="chart, graph, network, pert"></i>project diagram</div>
|
|
<div class="column"><i class="registered icon"
|
|
data-search-terms="copyright, mark, trademark"></i>registered</div>
|
|
<div class="column"><i class="registered outline icon"
|
|
data-search-terms="copyright, mark, trademark"></i>registered outline</div>
|
|
<div class="column"><i class="save icon" data-search-terms="disk, download, floppy, floppy-o"></i>save
|
|
</div>
|
|
<div class="column"><i class="save outline icon"
|
|
data-search-terms="disk, download, floppy, floppy-o"></i>save outline</div>
|
|
<div class="column"><i class="sitemap icon"
|
|
data-search-terms="directory, hierarchy, ia, information architecture, organization"></i>sitemap
|
|
</div>
|
|
<div class="column"><i class="socks icon"
|
|
data-search-terms="business socks, business time, clothing, feet, flight of the conchords, wednesday"></i>socks
|
|
</div>
|
|
<div class="column"><i class="sticky note icon"
|
|
data-search-terms="message, note, paper, reminder, sticker"></i>sticky note</div>
|
|
<div class="column"><i class="sticky note outline icon"
|
|
data-search-terms="message, note, paper, reminder, sticker"></i>sticky note outline</div>
|
|
<div class="column"><i class="stream icon" data-search-terms="flow, list, timeline"></i>stream</div>
|
|
<div class="column"><i class="table icon" data-search-terms="data, excel, spreadsheet"></i>table</div>
|
|
<div class="column"><i class="tag icon" data-search-terms="discount, label, price, shopping"></i>tag
|
|
</div>
|
|
<div class="column"><i class="tags icon" data-search-terms="discount, label, price, shopping"></i>tags
|
|
</div>
|
|
<div class="column"><i class="tasks icon"
|
|
data-search-terms="checklist, downloading, downloads, loading, progress, project management, settings, to do"></i>tasks
|
|
</div>
|
|
<div class="column"><i class="thumbtack icon"
|
|
data-search-terms="coordinates, location, marker, pin, thumb-tack"></i>thumbtack</div>
|
|
<div class="column"><i class="trademark icon"
|
|
data-search-terms="copyright, register, symbol"></i>trademark</div>
|
|
<div class="column"><i class="wallet icon"
|
|
data-search-terms="billfold, cash, currency, money"></i>wallet</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Camping</h4>
|
|
<p>Icons which represent camping activities and equipment</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="binoculars icon"
|
|
data-search-terms="glasses, magnify, scenic, spyglass, view"></i>binoculars</div>
|
|
<div class="column"><i class="campground icon"
|
|
data-search-terms="camping, fall, outdoors, teepee, tent, tipi"></i>campground</div>
|
|
<div class="column"><i class="caravan icon"
|
|
data-search-terms="camper, motor home, rv, trailer, travel"></i>caravan</div>
|
|
<div class="column"><i class="compass icon"
|
|
data-search-terms="directions, directory, location, menu, navigation, safari, travel"></i>compass
|
|
</div>
|
|
<div class="column"><i class="compass outline icon"
|
|
data-search-terms="directions, directory, location, menu, navigation, safari, travel"></i>compass
|
|
outline</div>
|
|
<div class="column"><i class="faucet icon"
|
|
data-search-terms="covid-19, drip, house, hygiene, kitchen, sink, water"></i>faucet</div>
|
|
<div class="column"><i class="fire icon"
|
|
data-search-terms="burn, caliente, flame, heat, hot, popular"></i>fire</div>
|
|
<div class="column"><i class="fire alternate icon"
|
|
data-search-terms="burn, caliente, flame, heat, hot, popular"></i>fire alternate</div>
|
|
<div class="column"><i class="first aid icon"
|
|
data-search-terms="emergency, emt, health, medical, rescue"></i>first aid</div>
|
|
<div class="column"><i class="frog icon"
|
|
data-search-terms="amphibian, bullfrog, fauna, hop, kermit, kiss, prince, ribbit, toad, wart"></i>frog
|
|
</div>
|
|
<div class="column"><i class="hiking icon"
|
|
data-search-terms="activity, backpack, fall, fitness, outdoors, person, seasonal, walking"></i>hiking
|
|
</div>
|
|
<div class="column"><i class="map icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
</div>
|
|
<div class="column"><i class="map marked icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
marked</div>
|
|
<div class="column"><i class="map marked alternate icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
marked alternate</div>
|
|
<div class="column"><i class="map outline icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
outline</div>
|
|
<div class="column"><i class="map signs icon"
|
|
data-search-terms="directions, directory, map, signage, wayfinding"></i>map signs</div>
|
|
<div class="column"><i class="mountain icon"
|
|
data-search-terms="glacier, hiking, hill, landscape, travel, view"></i>mountain</div>
|
|
<div class="column"><i class="route icon" data-search-terms="directions, navigation, travel"></i>route
|
|
</div>
|
|
<div class="column"><i class="toilet paper icon"
|
|
data-search-terms="bathroom, covid-19, halloween, holiday, lavatory, prank, restroom, roll"></i>toilet
|
|
paper</div>
|
|
<div class="column"><i class="trailer icon" data-search-terms="carry, haul, moving, travel"></i>trailer
|
|
</div>
|
|
<div class="column"><i class="tree icon"
|
|
data-search-terms="bark, fall, flora, forest, nature, plant, seasonal"></i>tree</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Charity</h4>
|
|
<p>Icons can represent common charity activities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="dollar sign icon"
|
|
data-search-terms="$, cost, dollar-sign, money, price, usd"></i>dollar sign</div>
|
|
<div class="column"><i class="donate icon"
|
|
data-search-terms="contribute, generosity, gift, give"></i>donate</div>
|
|
<div class="column"><i class="dove icon" data-search-terms="bird, fauna, flying, peace, war"></i>dove
|
|
</div>
|
|
<div class="column"><i class="gift icon"
|
|
data-search-terms="christmas, generosity, giving, holiday, party, present, wrapped, xmas"></i>gift
|
|
</div>
|
|
<div class="column"><i class="globe icon"
|
|
data-search-terms="all, coordinates, country, earth, global, gps, language, localize, location, map, online, place, planet, translate, travel, world"></i>globe
|
|
</div>
|
|
<div class="column"><i class="hand holding heart icon"
|
|
data-search-terms="carry, charity, gift, lift, package"></i>hand holding heart</div>
|
|
<div class="column"><i class="hand holding usd icon"
|
|
data-search-terms="$, carry, dollar sign, donation, giving, lift, money, price"></i>hand holding
|
|
usd</div>
|
|
<div class="column"><i class="hand holding water icon"
|
|
data-search-terms="carry, covid-19, drought, grow, lift"></i>hand holding water</div>
|
|
<div class="column"><i class="hands helping icon"
|
|
data-search-terms="aid, assistance, handshake, partnership, volunteering"></i>hands helping
|
|
</div>
|
|
<div class="column"><i class="handshake icon"
|
|
data-search-terms="agreement, greeting, meeting, partnership"></i>handshake</div>
|
|
<div class="column"><i class="handshake outline icon"
|
|
data-search-terms="agreement, greeting, meeting, partnership"></i>handshake outline</div>
|
|
<div class="column"><i class="heart icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart</div>
|
|
<div class="column"><i class="heart outline icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart outline</div>
|
|
<div class="column"><i class="leaf icon" data-search-terms="eco, flora, nature, plant, vegan"></i>leaf
|
|
</div>
|
|
<div class="column"><i class="parachute box icon"
|
|
data-search-terms="aid, assistance, rescue, supplies"></i>parachute box</div>
|
|
<div class="column"><i class="piggy bank icon" data-search-terms="bank, save, savings"></i>piggy bank
|
|
</div>
|
|
<div class="column"><i class="ribbon icon" data-search-terms="badge, cause, lapel, pin"></i>ribbon</div>
|
|
<div class="column"><i class="seedling icon" data-search-terms="flora, grow, plant, vegan"></i>seedling
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Chat</h4>
|
|
<p>Icons can represent common chat symbols and actions</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="comment icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
</div>
|
|
<div class="column"><i class="comment alternate icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
alternate</div>
|
|
<div class="column"><i class="comment alternate outline icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
alternate outline</div>
|
|
<div class="column"><i class="comment dots icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, more, note, notification, reply, sms, speech, texting"></i>comment
|
|
dots</div>
|
|
<div class="column"><i class="comment dots outline icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, more, note, notification, reply, sms, speech, texting"></i>comment
|
|
dots outline</div>
|
|
<div class="column"><i class="comment medical icon"
|
|
data-search-terms="advice, bubble, chat, commenting, conversation, diagnose, feedback, message, note, notification, prescription, sms, speech, texting"></i>comment
|
|
medical</div>
|
|
<div class="column"><i class="comment outline icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
outline</div>
|
|
<div class="column"><i class="comment slash icon"
|
|
data-search-terms="bubble, cancel, chat, commenting, conversation, feedback, message, mute, note, notification, quiet, sms, speech, texting"></i>comment
|
|
slash</div>
|
|
<div class="column"><i class="comments icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comments
|
|
</div>
|
|
<div class="column"><i class="comments outline icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comments
|
|
outline</div>
|
|
<div class="column"><i class="frown icon"
|
|
data-search-terms="disapprove, emoticon, face, rating, sad"></i>frown</div>
|
|
<div class="column"><i class="frown outline icon"
|
|
data-search-terms="disapprove, emoticon, face, rating, sad"></i>frown outline</div>
|
|
<div class="column"><i class="icons icon"
|
|
data-search-terms="bolt, emoji, heart, image, music, photo, symbols"></i>icons</div>
|
|
<div class="column"><i class="meh icon" data-search-terms="emoticon, face, neutral, rating"></i>meh
|
|
</div>
|
|
<div class="column"><i class="meh outline icon"
|
|
data-search-terms="emoticon, face, neutral, rating"></i>meh outline</div>
|
|
<div class="column"><i class="phone icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone</div>
|
|
<div class="column"><i class="phone alternate icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone alternate</div>
|
|
<div class="column"><i class="phone slash icon"
|
|
data-search-terms="call, cancel, earphone, mute, number, support, telephone, voice"></i>phone
|
|
slash</div>
|
|
<div class="column"><i class="poo icon" data-search-terms="crap, poop, shit, smile, turd"></i>poo</div>
|
|
<div class="column"><i class="quote left icon"
|
|
data-search-terms="mention, note, phrase, text, type"></i>quote left</div>
|
|
<div class="column"><i class="quote right icon"
|
|
data-search-terms="mention, note, phrase, text, type"></i>quote right</div>
|
|
<div class="column"><i class="smile icon"
|
|
data-search-terms="approve, emoticon, face, happy, rating, satisfied"></i>smile</div>
|
|
<div class="column"><i class="smile outline icon"
|
|
data-search-terms="approve, emoticon, face, happy, rating, satisfied"></i>smile outline</div>
|
|
<div class="column"><i class="sms icon"
|
|
data-search-terms="chat, conversation, message, mobile, notification, phone, sms, texting"></i>sms
|
|
</div>
|
|
<div class="column"><i class="video icon"
|
|
data-search-terms="camera, film, movie, record, video-camera"></i>video</div>
|
|
<div class="column"><i class="video slash icon"
|
|
data-search-terms="add, create, film, new, positive, record, video"></i>video slash</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Chess</h4>
|
|
<p>Icons which represent the game chess</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="chess icon"
|
|
data-search-terms="board, castle, checkmate, game, king, rook, strategy, tournament"></i>chess
|
|
</div>
|
|
<div class="column"><i class="chess bishop icon"
|
|
data-search-terms="board, checkmate, game, strategy"></i>chess bishop</div>
|
|
<div class="column"><i class="chess board icon"
|
|
data-search-terms="board, checkmate, game, strategy"></i>chess board</div>
|
|
<div class="column"><i class="chess king icon"
|
|
data-search-terms="board, checkmate, game, strategy"></i>chess king</div>
|
|
<div class="column"><i class="chess knight icon"
|
|
data-search-terms="board, checkmate, game, horse, strategy"></i>chess knight</div>
|
|
<div class="column"><i class="chess pawn icon"
|
|
data-search-terms="board, checkmate, game, strategy"></i>chess pawn</div>
|
|
<div class="column"><i class="chess queen icon"
|
|
data-search-terms="board, checkmate, game, strategy"></i>chess queen</div>
|
|
<div class="column"><i class="chess rook icon"
|
|
data-search-terms="board, castle, checkmate, game, strategy"></i>chess rook</div>
|
|
<div class="column"><i class="square full icon" data-search-terms="block, box, shape"></i>square full
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Childhood</h4>
|
|
<p>Icons which represent childhood activities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="baby icon"
|
|
data-search-terms="child, diaper, doll, human, infant, kid, offspring, person, sprout"></i>baby
|
|
</div>
|
|
<div class="column"><i class="baby carriage icon"
|
|
data-search-terms="buggy, carrier, infant, push, stroller, transportation, walk, wheels"></i>baby
|
|
carriage</div>
|
|
<div class="column"><i class="bath icon" data-search-terms="clean, shower, tub, wash"></i>bath</div>
|
|
<div class="column"><i class="biking icon"
|
|
data-search-terms="bicycle, bike, cycle, cycling, ride, wheel"></i>biking</div>
|
|
<div class="column"><i class="birthday cake icon"
|
|
data-search-terms="anniversary, bakery, candles, celebration, dessert, frosting, holiday, party, pastry"></i>birthday
|
|
cake</div>
|
|
<div class="column"><i class="cookie icon"
|
|
data-search-terms="baked good, chips, chocolate, eat, snack, sweet, treat"></i>cookie</div>
|
|
<div class="column"><i class="cookie bite icon"
|
|
data-search-terms="baked good, bitten, chips, chocolate, eat, snack, sweet, treat"></i>cookie
|
|
bite</div>
|
|
<div class="column"><i class="fruit-apple icon"
|
|
data-search-terms="fall, fruit, fuji, macintosh, orchard, seasonal, vegan"></i>fruit-apple</div>
|
|
<div class="column"><i class="gamepad icon"
|
|
data-search-terms="arcade, controller, d-pad, joystick, video, video game"></i>gamepad</div>
|
|
<div class="column"><i class="ice cream icon"
|
|
data-search-terms="chocolate, cone, dessert, frozen, scoop, sorbet, vanilla, yogurt"></i>ice
|
|
cream</div>
|
|
<div class="column"><i class="mitten icon"
|
|
data-search-terms="clothing, cold, glove, hands, knitted, seasonal, warmth"></i>mitten</div>
|
|
<div class="column"><i class="robot icon"
|
|
data-search-terms="android, automate, computer, cyborg"></i>robot</div>
|
|
<div class="column"><i class="school icon"
|
|
data-search-terms="building, education, learn, student, teacher"></i>school</div>
|
|
<div class="column"><i class="shapes icon"
|
|
data-search-terms="blocks, build, circle, square, triangle"></i>shapes</div>
|
|
<div class="column"><i class="snowman icon"
|
|
data-search-terms="decoration, frost, frosty, holiday"></i>snowman</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Clothing</h4>
|
|
<p>Icons which represent types of clothing</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="graduation cap icon"
|
|
data-search-terms="ceremony, college, graduate, learning, school, student"></i>graduation cap
|
|
</div>
|
|
<div class="column"><i class="hat cowboy icon"
|
|
data-search-terms="buckaroo, horse, jackeroo, john b., old west, pardner, ranch, rancher, rodeo, western, wrangler"></i>hat
|
|
cowboy</div>
|
|
<div class="column"><i class="hat cowboy side icon"
|
|
data-search-terms="buckaroo, horse, jackeroo, john b., old west, pardner, ranch, rancher, rodeo, western, wrangler"></i>hat
|
|
cowboy side</div>
|
|
<div class="column"><i class="hat wizard icon"
|
|
data-search-terms="Dungeons & Dragons, accessory, buckle, clothing, d&d, dnd, fantasy, halloween, head, holiday, mage, magic, pointy, witch"></i>hat
|
|
wizard</div>
|
|
<div class="column"><i class="mitten icon"
|
|
data-search-terms="clothing, cold, glove, hands, knitted, seasonal, warmth"></i>mitten</div>
|
|
<div class="column"><i class="shoe prints icon"
|
|
data-search-terms="feet, footprints, steps, walk"></i>shoe prints</div>
|
|
<div class="column"><i class="socks icon"
|
|
data-search-terms="business socks, business time, clothing, feet, flight of the conchords, wednesday"></i>socks
|
|
</div>
|
|
<div class="column"><i class="tshirt icon"
|
|
data-search-terms="clothing, fashion, garment, shirt"></i>tshirt</div>
|
|
<div class="column"><i class="user tie icon"
|
|
data-search-terms="avatar, business, clothing, formal, professional, suit"></i>user tie</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Code</h4>
|
|
<p>Icons can represent programming and programming tools</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="archive icon" data-search-terms="box, package, save, storage"></i>archive
|
|
</div>
|
|
<div class="column"><i class="barcode icon"
|
|
data-search-terms="info, laser, price, scan, upc"></i>barcode</div>
|
|
<div class="column"><i class="bath icon" data-search-terms="clean, shower, tub, wash"></i>bath</div>
|
|
<div class="column"><i class="bug icon" data-search-terms="beetle, error, insect, report"></i>bug</div>
|
|
<div class="column"><i class="code icon" data-search-terms="brackets, code, development, html"></i>code
|
|
</div>
|
|
<div class="column"><i class="code branch icon"
|
|
data-search-terms="branch, code-fork, fork, git, github, rebase, svn, vcs, version"></i>code
|
|
branch</div>
|
|
<div class="column"><i class="coffee icon"
|
|
data-search-terms="beverage, breakfast, cafe, drink, fall, morning, mug, seasonal, tea"></i>coffee
|
|
</div>
|
|
<div class="column"><i class="file icon" data-search-terms="document, new, page, pdf, resume"></i>file
|
|
</div>
|
|
<div class="column"><i class="file alternate icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate</div>
|
|
<div class="column"><i class="file alternate outline icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate outline
|
|
</div>
|
|
<div class="column"><i class="file code icon"
|
|
data-search-terms="css, development, document, html"></i>file code</div>
|
|
<div class="column"><i class="file code outline icon"
|
|
data-search-terms="css, development, document, html"></i>file code outline</div>
|
|
<div class="column"><i class="file outline icon"
|
|
data-search-terms="document, new, page, pdf, resume"></i>file outline</div>
|
|
<div class="column"><i class="filter icon"
|
|
data-search-terms="funnel, options, separate, sort"></i>filter</div>
|
|
<div class="column"><i class="fire extinguisher icon"
|
|
data-search-terms="burn, caliente, fire fighter, flame, heat, hot, rescue"></i>fire extinguisher
|
|
</div>
|
|
<div class="column"><i class="folder icon"
|
|
data-search-terms="archive, directory, document, file"></i>folder</div>
|
|
<div class="column"><i class="folder open icon"
|
|
data-search-terms="archive, directory, document, empty, file, new"></i>folder open</div>
|
|
<div class="column"><i class="folder open outline icon"
|
|
data-search-terms="archive, directory, document, empty, file, new"></i>folder open outline</div>
|
|
<div class="column"><i class="folder outline icon"
|
|
data-search-terms="archive, directory, document, file"></i>folder outline</div>
|
|
<div class="column"><i class="keyboard icon"
|
|
data-search-terms="accessory, edit, input, text, type, write"></i>keyboard</div>
|
|
<div class="column"><i class="keyboard outline icon"
|
|
data-search-terms="accessory, edit, input, text, type, write"></i>keyboard outline</div>
|
|
<div class="column"><i class="laptop code icon"
|
|
data-search-terms="computer, cpu, dell, demo, develop, device, mac, macbook, machine, pc"></i>laptop
|
|
code</div>
|
|
<div class="column"><i class="microchip icon"
|
|
data-search-terms="cpu, hardware, processor, technology"></i>microchip</div>
|
|
<div class="column"><i class="project diagram icon"
|
|
data-search-terms="chart, graph, network, pert"></i>project diagram</div>
|
|
<div class="column"><i class="qrcode icon"
|
|
data-search-terms="barcode, info, information, scan"></i>qrcode</div>
|
|
<div class="column"><i class="shield alternate icon"
|
|
data-search-terms="achievement, award, block, defend, security, winner"></i>shield alternate
|
|
</div>
|
|
<div class="column"><i class="sitemap icon"
|
|
data-search-terms="directory, hierarchy, ia, information architecture, organization"></i>sitemap
|
|
</div>
|
|
<div class="column"><i class="stream icon" data-search-terms="flow, list, timeline"></i>stream</div>
|
|
<div class="column"><i class="terminal icon"
|
|
data-search-terms="code, command, console, development, prompt"></i>terminal</div>
|
|
<div class="column"><i class="user secret icon"
|
|
data-search-terms="clothing, coat, hat, incognito, person, privacy, spy, whisper"></i>user
|
|
secret</div>
|
|
<div class="column"><i class="window close icon"
|
|
data-search-terms="browser, cancel, computer, development"></i>window close</div>
|
|
<div class="column"><i class="window close outline icon"
|
|
data-search-terms="browser, cancel, computer, development"></i>window close outline</div>
|
|
<div class="column"><i class="window maximize icon"
|
|
data-search-terms="browser, computer, development, expand"></i>window maximize</div>
|
|
<div class="column"><i class="window maximize outline icon"
|
|
data-search-terms="browser, computer, development, expand"></i>window maximize outline</div>
|
|
<div class="column"><i class="window minimize icon"
|
|
data-search-terms="browser, collapse, computer, development"></i>window minimize</div>
|
|
<div class="column"><i class="window minimize outline icon"
|
|
data-search-terms="browser, collapse, computer, development"></i>window minimize outline</div>
|
|
<div class="column"><i class="window restore icon"
|
|
data-search-terms="browser, computer, development"></i>window restore</div>
|
|
<div class="column"><i class="window restore outline icon"
|
|
data-search-terms="browser, computer, development"></i>window restore outline</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Communication</h4>
|
|
<p>Icons which represent common ways of communication</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="address book icon"
|
|
data-search-terms="contact, directory, index, little black book, rolodex"></i>address book</div>
|
|
<div class="column"><i class="address book outline icon"
|
|
data-search-terms="contact, directory, index, little black book, rolodex"></i>address book
|
|
outline</div>
|
|
<div class="column"><i class="address card icon"
|
|
data-search-terms="about, contact, id, identification, postcard, profile"></i>address card</div>
|
|
<div class="column"><i class="address card outline icon"
|
|
data-search-terms="about, contact, id, identification, postcard, profile"></i>address card
|
|
outline</div>
|
|
<div class="column"><i class="american sign language interpreting icon"
|
|
data-search-terms="asl, deaf, finger, hand, interpret, speak"></i>american sign language
|
|
interpreting</div>
|
|
<div class="column"><i class="assistive listening systems icon"
|
|
data-search-terms="amplify, audio, deaf, ear, headset, hearing, sound"></i>assistive listening
|
|
systems</div>
|
|
<div class="column"><i class="at icon" data-search-terms="address, author, e-mail, email, handle"></i>at
|
|
</div>
|
|
<div class="column"><i class="bell icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell</div>
|
|
<div class="column"><i class="bell outline icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell outline</div>
|
|
<div class="column"><i class="bell slash icon"
|
|
data-search-terms="alert, cancel, disabled, notification, off, reminder"></i>bell slash</div>
|
|
<div class="column"><i class="bell slash outline icon"
|
|
data-search-terms="alert, cancel, disabled, notification, off, reminder"></i>bell slash outline
|
|
</div>
|
|
<div class="column"><i class="bluetooth icon" data-search-terms=""></i>bluetooth</div>
|
|
<div class="column"><i class="bluetooth b icon" data-search-terms=""></i>bluetooth b</div>
|
|
<div class="column"><i class="broadcast tower icon"
|
|
data-search-terms="airwaves, antenna, radio, reception, waves"></i>broadcast tower</div>
|
|
<div class="column"><i class="bullhorn icon"
|
|
data-search-terms="announcement, broadcast, louder, megaphone, share"></i>bullhorn</div>
|
|
<div class="column"><i class="chalkboard icon"
|
|
data-search-terms="blackboard, learning, school, teaching, whiteboard, writing"></i>chalkboard
|
|
</div>
|
|
<div class="column"><i class="comment icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
</div>
|
|
<div class="column"><i class="comment alternate icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
alternate</div>
|
|
<div class="column"><i class="comment alternate outline icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
alternate outline</div>
|
|
<div class="column"><i class="comment outline icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
outline</div>
|
|
<div class="column"><i class="comments icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comments
|
|
</div>
|
|
<div class="column"><i class="comments outline icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comments
|
|
outline</div>
|
|
<div class="column"><i class="envelope icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
</div>
|
|
<div class="column"><i class="envelope open icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
open</div>
|
|
<div class="column"><i class="envelope open outline icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
open outline</div>
|
|
<div class="column"><i class="envelope outline icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
outline</div>
|
|
<div class="column"><i class="envelope square icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
square</div>
|
|
<div class="column"><i class="fax icon"
|
|
data-search-terms="business, communicate, copy, facsimile, send"></i>fax</div>
|
|
<div class="column"><i class="inbox icon"
|
|
data-search-terms="archive, desk, email, mail, message"></i>inbox</div>
|
|
<div class="column"><i class="language icon"
|
|
data-search-terms="dialect, idiom, localize, speech, translate, vernacular"></i>language</div>
|
|
<div class="column"><i class="microphone icon"
|
|
data-search-terms="audio, podcast, record, sing, sound, voice"></i>microphone</div>
|
|
<div class="column"><i class="microphone alternate icon"
|
|
data-search-terms="audio, podcast, record, sing, sound, voice"></i>microphone alternate</div>
|
|
<div class="column"><i class="microphone alternate slash icon"
|
|
data-search-terms="audio, disable, mute, podcast, record, sing, sound, voice"></i>microphone
|
|
alternate slash</div>
|
|
<div class="column"><i class="microphone slash icon"
|
|
data-search-terms="audio, disable, mute, podcast, record, sing, sound, voice"></i>microphone
|
|
slash</div>
|
|
<div class="column"><i class="mobile icon"
|
|
data-search-terms="apple, call, cell phone, cellphone, device, iphone, number, screen, telephone"></i>mobile
|
|
</div>
|
|
<div class="column"><i class="mobile alternate icon"
|
|
data-search-terms="apple, call, cell phone, cellphone, device, iphone, number, screen, telephone"></i>mobile
|
|
alternate</div>
|
|
<div class="column"><i class="paper plane icon"
|
|
data-search-terms="air, float, fold, mail, paper, send"></i>paper plane</div>
|
|
<div class="column"><i class="paper plane outline icon"
|
|
data-search-terms="air, float, fold, mail, paper, send"></i>paper plane outline</div>
|
|
<div class="column"><i class="phone icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone</div>
|
|
<div class="column"><i class="phone alternate icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone alternate</div>
|
|
<div class="column"><i class="phone slash icon"
|
|
data-search-terms="call, cancel, earphone, mute, number, support, telephone, voice"></i>phone
|
|
slash</div>
|
|
<div class="column"><i class="phone square icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone square</div>
|
|
<div class="column"><i class="phone square alternate icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone square alternate
|
|
</div>
|
|
<div class="column"><i class="phone volume icon"
|
|
data-search-terms="call, earphone, number, sound, support, telephone, voice, volume-control-phone"></i>phone
|
|
volume</div>
|
|
<div class="column"><i class="rss icon" data-search-terms="blog, feed, journal, news, writing"></i>rss
|
|
</div>
|
|
<div class="column"><i class="rss square icon"
|
|
data-search-terms="blog, feed, journal, news, writing"></i>rss square</div>
|
|
<div class="column"><i class="tty icon"
|
|
data-search-terms="communication, deaf, telephone, teletypewriter, text"></i>tty</div>
|
|
<div class="column"><i class="voicemail icon"
|
|
data-search-terms="answer, inbox, message, phone"></i>voicemail</div>
|
|
<div class="column"><i class="wifi icon"
|
|
data-search-terms="connection, hotspot, internet, network, wireless"></i>wifi</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Computers</h4>
|
|
<p>Icons can represent computing devices, or types of content found on a computer</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="compact disc icon"
|
|
data-search-terms="album, bluray, cd, disc, dvd, media, movie, music, record, video, vinyl"></i>compact
|
|
disc</div>
|
|
<div class="column"><i class="database icon"
|
|
data-search-terms="computer, development, directory, memory, storage"></i>database</div>
|
|
<div class="column"><i class="desktop icon"
|
|
data-search-terms="computer, cpu, demo, desktop, device, imac, machine, monitor, pc, screen"></i>desktop
|
|
</div>
|
|
<div class="column"><i class="download icon"
|
|
data-search-terms="export, hard drive, save, transfer"></i>download</div>
|
|
<div class="column"><i class="ethernet icon"
|
|
data-search-terms="cable, cat 5, cat 6, connection, hardware, internet, network, wired"></i>ethernet
|
|
</div>
|
|
<div class="column"><i class="hdd icon"
|
|
data-search-terms="cpu, hard drive, harddrive, machine, save, storage"></i>hdd</div>
|
|
<div class="column"><i class="hdd outline icon"
|
|
data-search-terms="cpu, hard drive, harddrive, machine, save, storage"></i>hdd outline</div>
|
|
<div class="column"><i class="headphones icon"
|
|
data-search-terms="audio, listen, music, sound, speaker"></i>headphones</div>
|
|
<div class="column"><i class="keyboard icon"
|
|
data-search-terms="accessory, edit, input, text, type, write"></i>keyboard</div>
|
|
<div class="column"><i class="keyboard outline icon"
|
|
data-search-terms="accessory, edit, input, text, type, write"></i>keyboard outline</div>
|
|
<div class="column"><i class="laptop icon"
|
|
data-search-terms="computer, cpu, dell, demo, device, mac, macbook, machine, pc"></i>laptop
|
|
</div>
|
|
<div class="column"><i class="laptop house icon"
|
|
data-search-terms="computer, covid-19, device, office, remote, work from home"></i>laptop house
|
|
</div>
|
|
<div class="column"><i class="memory icon"
|
|
data-search-terms="DIMM, RAM, hardware, storage, technology"></i>memory</div>
|
|
<div class="column"><i class="microchip icon"
|
|
data-search-terms="cpu, hardware, processor, technology"></i>microchip</div>
|
|
<div class="column"><i class="mobile icon"
|
|
data-search-terms="apple, call, cell phone, cellphone, device, iphone, number, screen, telephone"></i>mobile
|
|
</div>
|
|
<div class="column"><i class="mobile alternate icon"
|
|
data-search-terms="apple, call, cell phone, cellphone, device, iphone, number, screen, telephone"></i>mobile
|
|
alternate</div>
|
|
<div class="column"><i class="mouse icon"
|
|
data-search-terms="click, computer, cursor, input, peripheral"></i>mouse</div>
|
|
<div class="column"><i class="plug icon" data-search-terms="connect, electric, online, power"></i>plug
|
|
</div>
|
|
<div class="column"><i class="power off icon"
|
|
data-search-terms="cancel, computer, on, reboot, restart"></i>power off</div>
|
|
<div class="column"><i class="print icon"
|
|
data-search-terms="business, copy, document, office, paper"></i>print</div>
|
|
<div class="column"><i class="satellite icon"
|
|
data-search-terms="communications, hardware, orbit, space"></i>satellite</div>
|
|
<div class="column"><i class="satellite dish icon"
|
|
data-search-terms="SETI, communications, hardware, receiver, saucer, signal, space"></i>satellite
|
|
dish</div>
|
|
<div class="column"><i class="save icon" data-search-terms="disk, download, floppy, floppy-o"></i>save
|
|
</div>
|
|
<div class="column"><i class="save outline icon"
|
|
data-search-terms="disk, download, floppy, floppy-o"></i>save outline</div>
|
|
<div class="column"><i class="sd card icon" data-search-terms="image, memory, photo, save"></i>sd card
|
|
</div>
|
|
<div class="column"><i class="server icon"
|
|
data-search-terms="computer, cpu, database, hardware, network"></i>server</div>
|
|
<div class="column"><i class="sim card icon"
|
|
data-search-terms="hard drive, hardware, portable, storage, technology, tiny"></i>sim card</div>
|
|
<div class="column"><i class="stream icon" data-search-terms="flow, list, timeline"></i>stream</div>
|
|
<div class="column"><i class="tablet icon"
|
|
data-search-terms="apple, device, ipad, kindle, screen"></i>tablet</div>
|
|
<div class="column"><i class="tablet alternate icon"
|
|
data-search-terms="apple, device, ipad, kindle, screen"></i>tablet alternate</div>
|
|
<div class="column"><i class="tv icon" data-search-terms="computer, display, monitor, television"></i>tv
|
|
</div>
|
|
<div class="column"><i class="upload icon" data-search-terms="hard drive, import, publish"></i>upload
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Construction</h4>
|
|
<p>Icons which represent construction activities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="brush icon"
|
|
data-search-terms="art, bristles, color, handle, paint"></i>brush</div>
|
|
<div class="column"><i class="drafting compass icon"
|
|
data-search-terms="design, map, mechanical drawing, plot, plotting"></i>drafting compass</div>
|
|
<div class="column"><i class="dumpster icon"
|
|
data-search-terms="alley, bin, commercial, trash, waste"></i>dumpster</div>
|
|
<div class="column"><i class="hammer icon"
|
|
data-search-terms="admin, fix, repair, settings, tool"></i>hammer</div>
|
|
<div class="column"><i class="hard hat icon"
|
|
data-search-terms="construction, hardhat, helmet, safety"></i>hard hat</div>
|
|
<div class="column"><i class="paint roller icon"
|
|
data-search-terms="acrylic, art, brush, color, fill, paint, pigment, watercolor"></i>paint
|
|
roller</div>
|
|
<div class="column"><i class="pencil alternate icon"
|
|
data-search-terms="design, edit, pencil, update, write"></i>pencil alternate</div>
|
|
<div class="column"><i class="pencil ruler icon"
|
|
data-search-terms="design, draft, draw, pencil"></i>pencil ruler</div>
|
|
<div class="column"><i class="ruler icon"
|
|
data-search-terms="design, draft, length, measure, planning"></i>ruler</div>
|
|
<div class="column"><i class="ruler combined icon"
|
|
data-search-terms="design, draft, length, measure, planning"></i>ruler combined</div>
|
|
<div class="column"><i class="ruler horizontal icon"
|
|
data-search-terms="design, draft, length, measure, planning"></i>ruler horizontal</div>
|
|
<div class="column"><i class="ruler vertical icon"
|
|
data-search-terms="design, draft, length, measure, planning"></i>ruler vertical</div>
|
|
<div class="column"><i class="screwdriver icon"
|
|
data-search-terms="admin, fix, mechanic, repair, settings, tool"></i>screwdriver</div>
|
|
<div class="column"><i class="toolbox icon"
|
|
data-search-terms="admin, container, fix, repair, settings, tools"></i>toolbox</div>
|
|
<div class="column"><i class="tools icon"
|
|
data-search-terms="admin, fix, repair, screwdriver, settings, tools, wrench"></i>tools</div>
|
|
<div class="column"><i class="truck pickup icon" data-search-terms="cargo, vehicle"></i>truck pickup
|
|
</div>
|
|
<div class="column"><i class="wrench icon"
|
|
data-search-terms="construction, fix, mechanic, plumbing, settings, spanner, tool, update"></i>wrench
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Currency</h4>
|
|
<p>Icons can represent units of currency</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="bitcoin icon" data-search-terms=""></i>bitcoin</div>
|
|
<div class="column"><i class="btc icon" data-search-terms=""></i>btc</div>
|
|
<div class="column"><i class="dollar sign icon"
|
|
data-search-terms="$, cost, dollar-sign, money, price, usd"></i>dollar sign</div>
|
|
<div class="column"><i class="ethereum icon" data-search-terms=""></i>ethereum</div>
|
|
<div class="column"><i class="euro sign icon"
|
|
data-search-terms="currency, dollar, exchange, money"></i>euro sign</div>
|
|
<div class="column"><i class="gg icon" data-search-terms=""></i>gg</div>
|
|
<div class="column"><i class="gg circle icon" data-search-terms=""></i>gg circle</div>
|
|
<div class="column"><i class="hryvnia icon"
|
|
data-search-terms="currency, money, ukraine, ukrainian"></i>hryvnia</div>
|
|
<div class="column"><i class="lira sign icon" data-search-terms="currency, money, try, turkish"></i>lira
|
|
sign</div>
|
|
<div class="column"><i class="money bill icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill</div>
|
|
<div class="column"><i class="money bill alternate icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill
|
|
alternate</div>
|
|
<div class="column"><i class="money bill alternate outline icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill
|
|
alternate outline</div>
|
|
<div class="column"><i class="money bill wave icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill wave
|
|
</div>
|
|
<div class="column"><i class="money bill wave alternate icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill wave
|
|
alternate</div>
|
|
<div class="column"><i class="money check icon"
|
|
data-search-terms="bank check, buy, checkout, cheque, money, payment, price, purchase"></i>money
|
|
check</div>
|
|
<div class="column"><i class="money check alternate icon"
|
|
data-search-terms="bank check, buy, checkout, cheque, money, payment, price, purchase"></i>money
|
|
check alternate</div>
|
|
<div class="column"><i class="pound sign icon" data-search-terms="currency, gbp, money"></i>pound sign
|
|
</div>
|
|
<div class="column"><i class="ruble sign icon" data-search-terms="currency, money, rub"></i>ruble sign
|
|
</div>
|
|
<div class="column"><i class="rupee sign icon"
|
|
data-search-terms="currency, indian, inr, money"></i>rupee sign</div>
|
|
<div class="column"><i class="shekel sign icon" data-search-terms="currency, ils, money"></i>shekel sign
|
|
</div>
|
|
<div class="column"><i class="tenge icon"
|
|
data-search-terms="currency, kazakhstan, money, price"></i>tenge</div>
|
|
<div class="column"><i class="won sign icon" data-search-terms="currency, krw, money"></i>won sign</div>
|
|
<div class="column"><i class="yen sign icon" data-search-terms="currency, jpy, money"></i>yen sign</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Date & Time</h4>
|
|
<p>Icons that represent common ways of showing date and time</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="bell icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell</div>
|
|
<div class="column"><i class="bell outline icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell outline</div>
|
|
<div class="column"><i class="bell slash icon"
|
|
data-search-terms="alert, cancel, disabled, notification, off, reminder"></i>bell slash</div>
|
|
<div class="column"><i class="bell slash outline icon"
|
|
data-search-terms="alert, cancel, disabled, notification, off, reminder"></i>bell slash outline
|
|
</div>
|
|
<div class="column"><i class="calendar icon"
|
|
data-search-terms="calendar-o, date, event, schedule, time, when"></i>calendar</div>
|
|
<div class="column"><i class="calendar alternate icon"
|
|
data-search-terms="calendar, date, event, schedule, time, when"></i>calendar alternate</div>
|
|
<div class="column"><i class="calendar alternate outline icon"
|
|
data-search-terms="calendar, date, event, schedule, time, when"></i>calendar alternate outline
|
|
</div>
|
|
<div class="column"><i class="calendar check icon"
|
|
data-search-terms="accept, agree, appointment, confirm, correct, date, done, event, ok, schedule, select, success, tick, time, todo, when"></i>calendar
|
|
check</div>
|
|
<div class="column"><i class="calendar check outline icon"
|
|
data-search-terms="accept, agree, appointment, confirm, correct, date, done, event, ok, schedule, select, success, tick, time, todo, when"></i>calendar
|
|
check outline</div>
|
|
<div class="column"><i class="calendar minus icon"
|
|
data-search-terms="calendar, date, delete, event, negative, remove, schedule, time, when"></i>calendar
|
|
minus</div>
|
|
<div class="column"><i class="calendar minus outline icon"
|
|
data-search-terms="calendar, date, delete, event, negative, remove, schedule, time, when"></i>calendar
|
|
minus outline</div>
|
|
<div class="column"><i class="calendar outline icon"
|
|
data-search-terms="calendar-o, date, event, schedule, time, when"></i>calendar outline</div>
|
|
<div class="column"><i class="calendar plus icon"
|
|
data-search-terms="add, calendar, create, date, event, new, positive, schedule, time, when"></i>calendar
|
|
plus</div>
|
|
<div class="column"><i class="calendar plus outline icon"
|
|
data-search-terms="add, calendar, create, date, event, new, positive, schedule, time, when"></i>calendar
|
|
plus outline</div>
|
|
<div class="column"><i class="calendar times icon"
|
|
data-search-terms="archive, calendar, date, delete, event, remove, schedule, time, when, x"></i>calendar
|
|
times</div>
|
|
<div class="column"><i class="calendar times outline icon"
|
|
data-search-terms="archive, calendar, date, delete, event, remove, schedule, time, when, x"></i>calendar
|
|
times outline</div>
|
|
<div class="column"><i class="clock icon"
|
|
data-search-terms="date, late, schedule, time, timer, timestamp, watch"></i>clock</div>
|
|
<div class="column"><i class="clock outline icon"
|
|
data-search-terms="date, late, schedule, time, timer, timestamp, watch"></i>clock outline</div>
|
|
<div class="column"><i class="hourglass icon"
|
|
data-search-terms="hour, minute, sand, stopwatch, time"></i>hourglass</div>
|
|
<div class="column"><i class="hourglass end icon"
|
|
data-search-terms="hour, minute, sand, stopwatch, time"></i>hourglass end</div>
|
|
<div class="column"><i class="hourglass half icon"
|
|
data-search-terms="hour, minute, sand, stopwatch, time"></i>hourglass half</div>
|
|
<div class="column"><i class="hourglass outline icon"
|
|
data-search-terms="hour, minute, sand, stopwatch, time"></i>hourglass outline</div>
|
|
<div class="column"><i class="hourglass start icon"
|
|
data-search-terms="hour, minute, sand, stopwatch, time"></i>hourglass start</div>
|
|
<div class="column"><i class="stopwatch icon" data-search-terms="clock, reminder, time"></i>stopwatch
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Design</h4>
|
|
<p>Icons can represent common design related symbols or techniques</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="adjust icon"
|
|
data-search-terms="contrast, dark, light, saturation"></i>adjust</div>
|
|
<div class="column"><i class="bezier curve icon"
|
|
data-search-terms="curves, illustrator, lines, path, vector"></i>bezier curve</div>
|
|
<div class="column"><i class="brush icon"
|
|
data-search-terms="art, bristles, color, handle, paint"></i>brush</div>
|
|
<div class="column"><i class="clone icon" data-search-terms="arrange, copy, duplicate, paste"></i>clone
|
|
</div>
|
|
<div class="column"><i class="clone outline icon"
|
|
data-search-terms="arrange, copy, duplicate, paste"></i>clone outline</div>
|
|
<div class="column"><i class="copy icon"
|
|
data-search-terms="clone, duplicate, file, files-o, paper, paste"></i>copy</div>
|
|
<div class="column"><i class="copy outline icon"
|
|
data-search-terms="clone, duplicate, file, files-o, paper, paste"></i>copy outline</div>
|
|
<div class="column"><i class="crop icon"
|
|
data-search-terms="design, frame, mask, resize, shrink"></i>crop</div>
|
|
<div class="column"><i class="crop alternate icon"
|
|
data-search-terms="design, frame, mask, resize, shrink"></i>crop alternate</div>
|
|
<div class="column"><i class="crosshairs icon"
|
|
data-search-terms="aim, bullseye, gpd, picker, position"></i>crosshairs</div>
|
|
<div class="column"><i class="cut icon" data-search-terms="clip, scissors, snip"></i>cut</div>
|
|
<div class="column"><i class="drafting compass icon"
|
|
data-search-terms="design, map, mechanical drawing, plot, plotting"></i>drafting compass</div>
|
|
<div class="column"><i class="draw polygon icon"
|
|
data-search-terms="anchors, lines, object, render, shape"></i>draw polygon</div>
|
|
<div class="column"><i class="edit icon" data-search-terms="edit, pen, pencil, update, write"></i>edit
|
|
</div>
|
|
<div class="column"><i class="edit outline icon"
|
|
data-search-terms="edit, pen, pencil, update, write"></i>edit outline</div>
|
|
<div class="column"><i class="eraser icon" data-search-terms="art, delete, remove, rubber"></i>eraser
|
|
</div>
|
|
<div class="column"><i class="eye icon"
|
|
data-search-terms="look, optic, see, seen, show, sight, views, visible"></i>eye</div>
|
|
<div class="column"><i class="eye dropper icon"
|
|
data-search-terms="beaker, clone, color, copy, eyedropper, pipette"></i>eye dropper</div>
|
|
<div class="column"><i class="eye outline icon"
|
|
data-search-terms="look, optic, see, seen, show, sight, views, visible"></i>eye outline</div>
|
|
<div class="column"><i class="eye slash icon"
|
|
data-search-terms="blind, hide, show, toggle, unseen, views, visible, visiblity"></i>eye slash
|
|
</div>
|
|
<div class="column"><i class="eye slash outline icon"
|
|
data-search-terms="blind, hide, show, toggle, unseen, views, visible, visiblity"></i>eye slash
|
|
outline</div>
|
|
<div class="column"><i class="fill icon" data-search-terms="bucket, color, paint, paint bucket"></i>fill
|
|
</div>
|
|
<div class="column"><i class="fill drip icon"
|
|
data-search-terms="bucket, color, drop, paint, paint bucket, spill"></i>fill drip</div>
|
|
<div class="column"><i class="highlighter icon"
|
|
data-search-terms="edit, marker, sharpie, update, write"></i>highlighter</div>
|
|
<div class="column"><i class="icons icon"
|
|
data-search-terms="bolt, emoji, heart, image, music, photo, symbols"></i>icons</div>
|
|
<div class="column"><i class="layer group icon"
|
|
data-search-terms="arrange, develop, layers, map, stack"></i>layer group</div>
|
|
<div class="column"><i class="magic icon"
|
|
data-search-terms="autocomplete, automatic, mage, magic, spell, wand, witch, wizard"></i>magic
|
|
</div>
|
|
<div class="column"><i class="marker icon"
|
|
data-search-terms="design, edit, sharpie, update, write"></i>marker</div>
|
|
<div class="column"><i class="object group icon"
|
|
data-search-terms="combine, copy, design, merge, select"></i>object group</div>
|
|
<div class="column"><i class="object group outline icon"
|
|
data-search-terms="combine, copy, design, merge, select"></i>object group outline</div>
|
|
<div class="column"><i class="object ungroup icon"
|
|
data-search-terms="copy, design, merge, select, separate"></i>object ungroup</div>
|
|
<div class="column"><i class="object ungroup outline icon"
|
|
data-search-terms="copy, design, merge, select, separate"></i>object ungroup outline</div>
|
|
<div class="column"><i class="paint brush icon"
|
|
data-search-terms="acrylic, art, brush, color, fill, paint, pigment, watercolor"></i>paint brush
|
|
</div>
|
|
<div class="column"><i class="paint roller icon"
|
|
data-search-terms="acrylic, art, brush, color, fill, paint, pigment, watercolor"></i>paint
|
|
roller</div>
|
|
<div class="column"><i class="palette icon"
|
|
data-search-terms="acrylic, art, brush, color, fill, paint, pigment, watercolor"></i>palette
|
|
</div>
|
|
<div class="column"><i class="paste icon" data-search-terms="clipboard, copy, document, paper"></i>paste
|
|
</div>
|
|
<div class="column"><i class="pen icon" data-search-terms="design, edit, update, write"></i>pen</div>
|
|
<div class="column"><i class="pen alternate icon"
|
|
data-search-terms="design, edit, update, write"></i>pen alternate</div>
|
|
<div class="column"><i class="pen fancy icon"
|
|
data-search-terms="design, edit, fountain pen, update, write"></i>pen fancy</div>
|
|
<div class="column"><i class="pen nib icon"
|
|
data-search-terms="design, edit, fountain pen, update, write"></i>pen nib</div>
|
|
<div class="column"><i class="pencil alternate icon"
|
|
data-search-terms="design, edit, pencil, update, write"></i>pencil alternate</div>
|
|
<div class="column"><i class="pencil ruler icon"
|
|
data-search-terms="design, draft, draw, pencil"></i>pencil ruler</div>
|
|
<div class="column"><i class="ruler combined icon"
|
|
data-search-terms="design, draft, length, measure, planning"></i>ruler combined</div>
|
|
<div class="column"><i class="ruler horizontal icon"
|
|
data-search-terms="design, draft, length, measure, planning"></i>ruler horizontal</div>
|
|
<div class="column"><i class="ruler vertical icon"
|
|
data-search-terms="design, draft, length, measure, planning"></i>ruler vertical</div>
|
|
<div class="column"><i class="save icon" data-search-terms="disk, download, floppy, floppy-o"></i>save
|
|
</div>
|
|
<div class="column"><i class="save outline icon"
|
|
data-search-terms="disk, download, floppy, floppy-o"></i>save outline</div>
|
|
<div class="column"><i class="splotch icon"
|
|
data-search-terms="Ink, blob, blotch, glob, stain"></i>splotch</div>
|
|
<div class="column"><i class="spray can icon"
|
|
data-search-terms="Paint, aerosol, design, graffiti, tag"></i>spray can</div>
|
|
<div class="column"><i class="stamp icon"
|
|
data-search-terms="art, certificate, imprint, rubber, seal"></i>stamp</div>
|
|
<div class="column"><i class="swatchbook icon"
|
|
data-search-terms="Pantone, color, design, hue, palette"></i>swatchbook</div>
|
|
<div class="column"><i class="tint icon"
|
|
data-search-terms="color, drop, droplet, raindrop, waterdrop"></i>tint</div>
|
|
<div class="column"><i class="tint slash icon"
|
|
data-search-terms="color, drop, droplet, raindrop, waterdrop"></i>tint slash</div>
|
|
<div class="column"><i class="vector square icon"
|
|
data-search-terms="anchors, lines, object, render, shape"></i>vector square</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Editors</h4>
|
|
<p>Icons can represent text editors and common editor actions</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="align center icon"
|
|
data-search-terms="format, middle, paragraph, text"></i>align center</div>
|
|
<div class="column"><i class="align justify icon" data-search-terms="format, paragraph, text"></i>align
|
|
justify</div>
|
|
<div class="column"><i class="align left icon" data-search-terms="format, paragraph, text"></i>align
|
|
left</div>
|
|
<div class="column"><i class="align right icon" data-search-terms="format, paragraph, text"></i>align
|
|
right</div>
|
|
<div class="column"><i class="bold icon" data-search-terms="emphasis, format, text"></i>bold</div>
|
|
<div class="column"><i class="border all icon"
|
|
data-search-terms="cell, grid, outline, stroke, table"></i>border all</div>
|
|
<div class="column"><i class="border none icon"
|
|
data-search-terms="cell, grid, outline, stroke, table"></i>border none</div>
|
|
<div class="column"><i class="border style icon" data-search-terms=""></i>border style</div>
|
|
<div class="column"><i class="clipboard icon"
|
|
data-search-terms="copy, notes, paste, record"></i>clipboard</div>
|
|
<div class="column"><i class="clipboard outline icon"
|
|
data-search-terms="copy, notes, paste, record"></i>clipboard outline</div>
|
|
<div class="column"><i class="clone icon" data-search-terms="arrange, copy, duplicate, paste"></i>clone
|
|
</div>
|
|
<div class="column"><i class="clone outline icon"
|
|
data-search-terms="arrange, copy, duplicate, paste"></i>clone outline</div>
|
|
<div class="column"><i class="columns icon"
|
|
data-search-terms="browser, dashboard, organize, panes, split"></i>columns</div>
|
|
<div class="column"><i class="copy icon"
|
|
data-search-terms="clone, duplicate, file, files-o, paper, paste"></i>copy</div>
|
|
<div class="column"><i class="copy outline icon"
|
|
data-search-terms="clone, duplicate, file, files-o, paper, paste"></i>copy outline</div>
|
|
<div class="column"><i class="cut icon" data-search-terms="clip, scissors, snip"></i>cut</div>
|
|
<div class="column"><i class="edit icon" data-search-terms="edit, pen, pencil, update, write"></i>edit
|
|
</div>
|
|
<div class="column"><i class="edit outline icon"
|
|
data-search-terms="edit, pen, pencil, update, write"></i>edit outline</div>
|
|
<div class="column"><i class="eraser icon" data-search-terms="art, delete, remove, rubber"></i>eraser
|
|
</div>
|
|
<div class="column"><i class="file icon" data-search-terms="document, new, page, pdf, resume"></i>file
|
|
</div>
|
|
<div class="column"><i class="file alternate icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate</div>
|
|
<div class="column"><i class="file alternate outline icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate outline
|
|
</div>
|
|
<div class="column"><i class="file outline icon"
|
|
data-search-terms="document, new, page, pdf, resume"></i>file outline</div>
|
|
<div class="column"><i class="font icon"
|
|
data-search-terms="alphabet, glyph, text, type, typeface"></i>font</div>
|
|
<div class="column"><i class="glasses icon"
|
|
data-search-terms="hipster, nerd, reading, sight, spectacles, vision"></i>glasses</div>
|
|
<div class="column"><i class="heading icon" data-search-terms="format, header, text, title"></i>heading
|
|
</div>
|
|
<div class="column"><i class="highlighter icon"
|
|
data-search-terms="edit, marker, sharpie, update, write"></i>highlighter</div>
|
|
<div class="column"><i class="i cursor icon" data-search-terms="editing, i-beam, type, writing"></i>i
|
|
cursor</div>
|
|
<div class="column"><i class="icons icon"
|
|
data-search-terms="bolt, emoji, heart, image, music, photo, symbols"></i>icons</div>
|
|
<div class="column"><i class="indent icon" data-search-terms="align, justify, paragraph, tab"></i>indent
|
|
</div>
|
|
<div class="column"><i class="italic icon"
|
|
data-search-terms="edit, emphasis, font, format, text, type"></i>italic</div>
|
|
<div class="column"><i class="linkify icon"
|
|
data-search-terms="attach, attachment, chain, connect"></i>linkify</div>
|
|
<div class="column"><i class="list icon"
|
|
data-search-terms="checklist, completed, done, finished, ol, todo, ul"></i>list</div>
|
|
<div class="column"><i class="list alternate icon"
|
|
data-search-terms="checklist, completed, done, finished, ol, todo, ul"></i>list alternate</div>
|
|
<div class="column"><i class="list alternate outline icon"
|
|
data-search-terms="checklist, completed, done, finished, ol, todo, ul"></i>list alternate
|
|
outline</div>
|
|
<div class="column"><i class="list ol icon"
|
|
data-search-terms="checklist, completed, done, finished, numbers, ol, todo, ul"></i>list ol
|
|
</div>
|
|
<div class="column"><i class="list ul icon"
|
|
data-search-terms="checklist, completed, done, finished, ol, todo, ul"></i>list ul</div>
|
|
<div class="column"><i class="marker icon"
|
|
data-search-terms="design, edit, sharpie, update, write"></i>marker</div>
|
|
<div class="column"><i class="outdent icon"
|
|
data-search-terms="align, justify, paragraph, tab"></i>outdent</div>
|
|
<div class="column"><i class="paper plane icon"
|
|
data-search-terms="air, float, fold, mail, paper, send"></i>paper plane</div>
|
|
<div class="column"><i class="paper plane outline icon"
|
|
data-search-terms="air, float, fold, mail, paper, send"></i>paper plane outline</div>
|
|
<div class="column"><i class="paperclip icon"
|
|
data-search-terms="attach, attachment, connect, link"></i>paperclip</div>
|
|
<div class="column"><i class="paragraph icon"
|
|
data-search-terms="edit, format, text, writing"></i>paragraph</div>
|
|
<div class="column"><i class="paste icon" data-search-terms="clipboard, copy, document, paper"></i>paste
|
|
</div>
|
|
<div class="column"><i class="pen icon" data-search-terms="design, edit, update, write"></i>pen</div>
|
|
<div class="column"><i class="pen alternate icon"
|
|
data-search-terms="design, edit, update, write"></i>pen alternate</div>
|
|
<div class="column"><i class="pen fancy icon"
|
|
data-search-terms="design, edit, fountain pen, update, write"></i>pen fancy</div>
|
|
<div class="column"><i class="pen nib icon"
|
|
data-search-terms="design, edit, fountain pen, update, write"></i>pen nib</div>
|
|
<div class="column"><i class="pencil alternate icon"
|
|
data-search-terms="design, edit, pencil, update, write"></i>pencil alternate</div>
|
|
<div class="column"><i class="print icon"
|
|
data-search-terms="business, copy, document, office, paper"></i>print</div>
|
|
<div class="column"><i class="quote left icon"
|
|
data-search-terms="mention, note, phrase, text, type"></i>quote left</div>
|
|
<div class="column"><i class="quote right icon"
|
|
data-search-terms="mention, note, phrase, text, type"></i>quote right</div>
|
|
<div class="column"><i class="redo icon" data-search-terms="forward, refresh, reload, repeat"></i>redo
|
|
</div>
|
|
<div class="column"><i class="redo alternate icon"
|
|
data-search-terms="forward, refresh, reload, repeat"></i>redo alternate</div>
|
|
<div class="column"><i class="remove format icon"
|
|
data-search-terms="cancel, font, format, remove, style, text"></i>remove format</div>
|
|
<div class="column"><i class="reply icon" data-search-terms="mail, message, respond"></i>reply</div>
|
|
<div class="column"><i class="reply all icon" data-search-terms="mail, message, respond"></i>reply all
|
|
</div>
|
|
<div class="column"><i class="screwdriver icon"
|
|
data-search-terms="admin, fix, mechanic, repair, settings, tool"></i>screwdriver</div>
|
|
<div class="column"><i class="share icon" data-search-terms="forward, save, send, social"></i>share
|
|
</div>
|
|
<div class="column"><i class="spell check icon"
|
|
data-search-terms="dictionary, edit, editor, grammar, text"></i>spell check</div>
|
|
<div class="column"><i class="strikethrough icon"
|
|
data-search-terms="cancel, edit, font, format, text, type"></i>strikethrough</div>
|
|
<div class="column"><i class="subscript icon"
|
|
data-search-terms="edit, font, format, text, type"></i>subscript</div>
|
|
<div class="column"><i class="superscript icon"
|
|
data-search-terms="edit, exponential, font, format, text, type"></i>superscript</div>
|
|
<div class="column"><i class="sync icon"
|
|
data-search-terms="exchange, refresh, reload, rotate, swap"></i>sync</div>
|
|
<div class="column"><i class="sync alternate icon"
|
|
data-search-terms="exchange, refresh, reload, rotate, swap"></i>sync alternate</div>
|
|
<div class="column"><i class="table icon" data-search-terms="data, excel, spreadsheet"></i>table</div>
|
|
<div class="column"><i class="tasks icon"
|
|
data-search-terms="checklist, downloading, downloads, loading, progress, project management, settings, to do"></i>tasks
|
|
</div>
|
|
<div class="column"><i class="text height icon"
|
|
data-search-terms="edit, font, format, text, type"></i>text height</div>
|
|
<div class="column"><i class="text width icon"
|
|
data-search-terms="edit, font, format, text, type"></i>text width</div>
|
|
<div class="column"><i class="th icon" data-search-terms="blocks, boxes, grid, squares"></i>th</div>
|
|
<div class="column"><i class="th large icon" data-search-terms="blocks, boxes, grid, squares"></i>th
|
|
large</div>
|
|
<div class="column"><i class="th list icon"
|
|
data-search-terms="checklist, completed, done, finished, ol, todo, ul"></i>th list</div>
|
|
<div class="column"><i class="tools icon"
|
|
data-search-terms="admin, fix, repair, screwdriver, settings, tools, wrench"></i>tools</div>
|
|
<div class="column"><i class="trash icon" data-search-terms="delete, garbage, hide, remove"></i>trash
|
|
</div>
|
|
<div class="column"><i class="trash alternate icon"
|
|
data-search-terms="delete, garbage, hide, remove, trash-o"></i>trash alternate</div>
|
|
<div class="column"><i class="trash alternate outline icon"
|
|
data-search-terms="delete, garbage, hide, remove, trash-o"></i>trash alternate outline</div>
|
|
<div class="column"><i class="trash restore icon"
|
|
data-search-terms="back, control z, oops, undo"></i>trash restore</div>
|
|
<div class="column"><i class="trash restore alternate icon"
|
|
data-search-terms="back, control z, oops, undo"></i>trash restore alternate</div>
|
|
<div class="column"><i class="underline icon"
|
|
data-search-terms="edit, emphasis, format, text, writing"></i>underline</div>
|
|
<div class="column"><i class="undo icon"
|
|
data-search-terms="back, control z, exchange, oops, return, rotate, swap"></i>undo</div>
|
|
<div class="column"><i class="undo alternate icon"
|
|
data-search-terms="back, control z, exchange, oops, return, swap"></i>undo alternate</div>
|
|
<div class="column"><i class="unlink icon"
|
|
data-search-terms="attachment, chain, chain-broken, remove"></i>unlink</div>
|
|
<div class="column"><i class="wrench icon"
|
|
data-search-terms="construction, fix, mechanic, plumbing, settings, spanner, tool, update"></i>wrench
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Education</h4>
|
|
<p>Icons can represent education types and activities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="atom icon"
|
|
data-search-terms="atheism, chemistry, electron, ion, isotope, neutron, nuclear, proton, science"></i>atom
|
|
</div>
|
|
<div class="column"><i class="award icon"
|
|
data-search-terms="honor, praise, prize, recognition, ribbon, trophy"></i>award</div>
|
|
<div class="column"><i class="bell icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell</div>
|
|
<div class="column"><i class="bell outline icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell outline</div>
|
|
<div class="column"><i class="bell slash icon"
|
|
data-search-terms="alert, cancel, disabled, notification, off, reminder"></i>bell slash</div>
|
|
<div class="column"><i class="bell slash outline icon"
|
|
data-search-terms="alert, cancel, disabled, notification, off, reminder"></i>bell slash outline
|
|
</div>
|
|
<div class="column"><i class="book open icon"
|
|
data-search-terms="flyer, library, notebook, open book, pamphlet, reading"></i>book open</div>
|
|
<div class="column"><i class="book reader icon"
|
|
data-search-terms="flyer, library, notebook, open book, pamphlet, reading"></i>book reader</div>
|
|
<div class="column"><i class="chalkboard icon"
|
|
data-search-terms="blackboard, learning, school, teaching, whiteboard, writing"></i>chalkboard
|
|
</div>
|
|
<div class="column"><i class="chalkboard teacher icon"
|
|
data-search-terms="blackboard, instructor, learning, professor, school, whiteboard, writing"></i>chalkboard
|
|
teacher</div>
|
|
<div class="column"><i class="fruit-apple icon"
|
|
data-search-terms="fall, fruit, fuji, macintosh, orchard, seasonal, vegan"></i>fruit-apple</div>
|
|
<div class="column"><i class="graduation cap icon"
|
|
data-search-terms="ceremony, college, graduate, learning, school, student"></i>graduation cap
|
|
</div>
|
|
<div class="column"><i class="laptop code icon"
|
|
data-search-terms="computer, cpu, dell, demo, develop, device, mac, macbook, machine, pc"></i>laptop
|
|
code</div>
|
|
<div class="column"><i class="microscope icon"
|
|
data-search-terms="covid-19, electron, lens, optics, science, shrink"></i>microscope</div>
|
|
<div class="column"><i class="music icon"
|
|
data-search-terms="lyrics, melody, note, sing, sound"></i>music</div>
|
|
<div class="column"><i class="school icon"
|
|
data-search-terms="building, education, learn, student, teacher"></i>school</div>
|
|
<div class="column"><i class="shapes icon"
|
|
data-search-terms="blocks, build, circle, square, triangle"></i>shapes</div>
|
|
<div class="column"><i class="theater masks icon"
|
|
data-search-terms="comedy, perform, theatre, tragedy"></i>theater masks</div>
|
|
<div class="column"><i class="user graduate icon"
|
|
data-search-terms="cap, clothing, commencement, gown, graduation, person, student"></i>user
|
|
graduate</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Emoji</h4>
|
|
<p>Icons which represent emoji's</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="angry icon"
|
|
data-search-terms="disapprove, emoticon, face, mad, upset"></i>angry</div>
|
|
<div class="column"><i class="angry outline icon"
|
|
data-search-terms="disapprove, emoticon, face, mad, upset"></i>angry outline</div>
|
|
<div class="column"><i class="dizzy icon"
|
|
data-search-terms="dazed, dead, disapprove, emoticon, face"></i>dizzy</div>
|
|
<div class="column"><i class="dizzy outline icon"
|
|
data-search-terms="dazed, dead, disapprove, emoticon, face"></i>dizzy outline</div>
|
|
<div class="column"><i class="flushed icon" data-search-terms="embarrassed, emoticon, face"></i>flushed
|
|
</div>
|
|
<div class="column"><i class="flushed outline icon"
|
|
data-search-terms="embarrassed, emoticon, face"></i>flushed outline</div>
|
|
<div class="column"><i class="frown icon"
|
|
data-search-terms="disapprove, emoticon, face, rating, sad"></i>frown</div>
|
|
<div class="column"><i class="frown open icon"
|
|
data-search-terms="disapprove, emoticon, face, rating, sad"></i>frown open</div>
|
|
<div class="column"><i class="frown open outline icon"
|
|
data-search-terms="disapprove, emoticon, face, rating, sad"></i>frown open outline</div>
|
|
<div class="column"><i class="frown outline icon"
|
|
data-search-terms="disapprove, emoticon, face, rating, sad"></i>frown outline</div>
|
|
<div class="column"><i class="grimace icon"
|
|
data-search-terms="cringe, emoticon, face, teeth"></i>grimace</div>
|
|
<div class="column"><i class="grimace outline icon"
|
|
data-search-terms="cringe, emoticon, face, teeth"></i>grimace outline</div>
|
|
<div class="column"><i class="grin icon" data-search-terms="emoticon, face, laugh, smile"></i>grin</div>
|
|
<div class="column"><i class="grin alternate icon"
|
|
data-search-terms="emoticon, face, laugh, smile"></i>grin alternate</div>
|
|
<div class="column"><i class="grin alternate outline icon"
|
|
data-search-terms="emoticon, face, laugh, smile"></i>grin alternate outline</div>
|
|
<div class="column"><i class="grin beam icon" data-search-terms="emoticon, face, laugh, smile"></i>grin
|
|
beam</div>
|
|
<div class="column"><i class="grin beam outline icon"
|
|
data-search-terms="emoticon, face, laugh, smile"></i>grin beam outline</div>
|
|
<div class="column"><i class="grin beam sweat icon"
|
|
data-search-terms="embarass, emoticon, face, smile"></i>grin beam sweat</div>
|
|
<div class="column"><i class="grin beam sweat outline icon"
|
|
data-search-terms="embarass, emoticon, face, smile"></i>grin beam sweat outline</div>
|
|
<div class="column"><i class="grin hearts icon" data-search-terms="emoticon, face, love, smile"></i>grin
|
|
hearts</div>
|
|
<div class="column"><i class="grin hearts outline icon"
|
|
data-search-terms="emoticon, face, love, smile"></i>grin hearts outline</div>
|
|
<div class="column"><i class="grin outline icon"
|
|
data-search-terms="emoticon, face, laugh, smile"></i>grin outline</div>
|
|
<div class="column"><i class="grin squint icon"
|
|
data-search-terms="emoticon, face, laugh, smile"></i>grin squint</div>
|
|
<div class="column"><i class="grin squint outline icon"
|
|
data-search-terms="emoticon, face, laugh, smile"></i>grin squint outline</div>
|
|
<div class="column"><i class="grin squint tears icon"
|
|
data-search-terms="emoticon, face, happy, smile"></i>grin squint tears</div>
|
|
<div class="column"><i class="grin squint tears outline icon"
|
|
data-search-terms="emoticon, face, happy, smile"></i>grin squint tears outline</div>
|
|
<div class="column"><i class="grin stars icon" data-search-terms="emoticon, face, star-struck"></i>grin
|
|
stars</div>
|
|
<div class="column"><i class="grin stars outline icon"
|
|
data-search-terms="emoticon, face, star-struck"></i>grin stars outline</div>
|
|
<div class="column"><i class="grin tears icon" data-search-terms="LOL, emoticon, face"></i>grin tears
|
|
</div>
|
|
<div class="column"><i class="grin tears outline icon" data-search-terms="LOL, emoticon, face"></i>grin
|
|
tears outline</div>
|
|
<div class="column"><i class="grin tongue icon" data-search-terms="LOL, emoticon, face"></i>grin tongue
|
|
</div>
|
|
<div class="column"><i class="grin tongue outline icon" data-search-terms="LOL, emoticon, face"></i>grin
|
|
tongue outline</div>
|
|
<div class="column"><i class="grin tongue squint icon" data-search-terms="LOL, emoticon, face"></i>grin
|
|
tongue squint</div>
|
|
<div class="column"><i class="grin tongue squint outline icon"
|
|
data-search-terms="LOL, emoticon, face"></i>grin tongue squint outline</div>
|
|
<div class="column"><i class="grin tongue wink icon" data-search-terms="LOL, emoticon, face"></i>grin
|
|
tongue wink</div>
|
|
<div class="column"><i class="grin tongue wink outline icon"
|
|
data-search-terms="LOL, emoticon, face"></i>grin tongue wink outline</div>
|
|
<div class="column"><i class="grin wink icon"
|
|
data-search-terms="emoticon, face, flirt, laugh, smile"></i>grin wink</div>
|
|
<div class="column"><i class="grin wink outline icon"
|
|
data-search-terms="emoticon, face, flirt, laugh, smile"></i>grin wink outline</div>
|
|
<div class="column"><i class="kiss icon" data-search-terms="beso, emoticon, face, love, smooch"></i>kiss
|
|
</div>
|
|
<div class="column"><i class="kiss beam icon"
|
|
data-search-terms="beso, emoticon, face, love, smooch"></i>kiss beam</div>
|
|
<div class="column"><i class="kiss beam outline icon"
|
|
data-search-terms="beso, emoticon, face, love, smooch"></i>kiss beam outline</div>
|
|
<div class="column"><i class="kiss outline icon"
|
|
data-search-terms="beso, emoticon, face, love, smooch"></i>kiss outline</div>
|
|
<div class="column"><i class="kiss wink heart icon"
|
|
data-search-terms="beso, emoticon, face, love, smooch"></i>kiss wink heart</div>
|
|
<div class="column"><i class="kiss wink heart outline icon"
|
|
data-search-terms="beso, emoticon, face, love, smooch"></i>kiss wink heart outline</div>
|
|
<div class="column"><i class="laugh icon"
|
|
data-search-terms="LOL, emoticon, face, laugh, smile"></i>laugh</div>
|
|
<div class="column"><i class="laugh beam icon"
|
|
data-search-terms="LOL, emoticon, face, happy, smile"></i>laugh beam</div>
|
|
<div class="column"><i class="laugh beam outline icon"
|
|
data-search-terms="LOL, emoticon, face, happy, smile"></i>laugh beam outline</div>
|
|
<div class="column"><i class="laugh outline icon"
|
|
data-search-terms="LOL, emoticon, face, laugh, smile"></i>laugh outline</div>
|
|
<div class="column"><i class="laugh squint icon"
|
|
data-search-terms="LOL, emoticon, face, happy, smile"></i>laugh squint</div>
|
|
<div class="column"><i class="laugh squint outline icon"
|
|
data-search-terms="LOL, emoticon, face, happy, smile"></i>laugh squint outline</div>
|
|
<div class="column"><i class="laugh wink icon"
|
|
data-search-terms="LOL, emoticon, face, happy, smile"></i>laugh wink</div>
|
|
<div class="column"><i class="laugh wink outline icon"
|
|
data-search-terms="LOL, emoticon, face, happy, smile"></i>laugh wink outline</div>
|
|
<div class="column"><i class="meh icon" data-search-terms="emoticon, face, neutral, rating"></i>meh
|
|
</div>
|
|
<div class="column"><i class="meh blank icon"
|
|
data-search-terms="emoticon, face, neutral, rating"></i>meh blank</div>
|
|
<div class="column"><i class="meh blank outline icon"
|
|
data-search-terms="emoticon, face, neutral, rating"></i>meh blank outline</div>
|
|
<div class="column"><i class="meh outline icon"
|
|
data-search-terms="emoticon, face, neutral, rating"></i>meh outline</div>
|
|
<div class="column"><i class="meh rolling eyes icon"
|
|
data-search-terms="emoticon, face, neutral, rating"></i>meh rolling eyes</div>
|
|
<div class="column"><i class="meh rolling eyes outline icon"
|
|
data-search-terms="emoticon, face, neutral, rating"></i>meh rolling eyes outline</div>
|
|
<div class="column"><i class="sad cry icon" data-search-terms="emoticon, face, tear, tears"></i>sad cry
|
|
</div>
|
|
<div class="column"><i class="sad cry outline icon"
|
|
data-search-terms="emoticon, face, tear, tears"></i>sad cry outline</div>
|
|
<div class="column"><i class="sad tear icon" data-search-terms="emoticon, face, tear, tears"></i>sad
|
|
tear</div>
|
|
<div class="column"><i class="sad tear outline icon"
|
|
data-search-terms="emoticon, face, tear, tears"></i>sad tear outline</div>
|
|
<div class="column"><i class="smile icon"
|
|
data-search-terms="approve, emoticon, face, happy, rating, satisfied"></i>smile</div>
|
|
<div class="column"><i class="smile beam icon"
|
|
data-search-terms="emoticon, face, happy, positive"></i>smile beam</div>
|
|
<div class="column"><i class="smile beam outline icon"
|
|
data-search-terms="emoticon, face, happy, positive"></i>smile beam outline</div>
|
|
<div class="column"><i class="smile outline icon"
|
|
data-search-terms="approve, emoticon, face, happy, rating, satisfied"></i>smile outline</div>
|
|
<div class="column"><i class="smile wink icon"
|
|
data-search-terms="emoticon, face, happy, hint, joke"></i>smile wink</div>
|
|
<div class="column"><i class="smile wink outline icon"
|
|
data-search-terms="emoticon, face, happy, hint, joke"></i>smile wink outline</div>
|
|
<div class="column"><i class="surprise icon" data-search-terms="emoticon, face, shocked"></i>surprise
|
|
</div>
|
|
<div class="column"><i class="surprise outline icon"
|
|
data-search-terms="emoticon, face, shocked"></i>surprise outline</div>
|
|
<div class="column"><i class="tired icon"
|
|
data-search-terms="angry, emoticon, face, grumpy, upset"></i>tired</div>
|
|
<div class="column"><i class="tired outline icon"
|
|
data-search-terms="angry, emoticon, face, grumpy, upset"></i>tired outline</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Energy</h4>
|
|
<p>Icons which represent energy equipment, types and status</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="atom icon"
|
|
data-search-terms="atheism, chemistry, electron, ion, isotope, neutron, nuclear, proton, science"></i>atom
|
|
</div>
|
|
<div class="column"><i class="battery empty icon"
|
|
data-search-terms="charge, dead, power, status"></i>battery empty</div>
|
|
<div class="column"><i class="battery full icon" data-search-terms="charge, power, status"></i>battery
|
|
full</div>
|
|
<div class="column"><i class="battery half icon" data-search-terms="charge, power, status"></i>battery
|
|
half</div>
|
|
<div class="column"><i class="battery quarter icon"
|
|
data-search-terms="charge, low, power, status"></i>battery quarter</div>
|
|
<div class="column"><i class="battery three quarters icon"
|
|
data-search-terms="charge, power, status"></i>battery three quarters</div>
|
|
<div class="column"><i class="broadcast tower icon"
|
|
data-search-terms="airwaves, antenna, radio, reception, waves"></i>broadcast tower</div>
|
|
<div class="column"><i class="burn icon"
|
|
data-search-terms="caliente, energy, fire, flame, gas, heat, hot"></i>burn</div>
|
|
<div class="column"><i class="charging station icon"
|
|
data-search-terms="electric, ev, tesla, vehicle"></i>charging station</div>
|
|
<div class="column"><i class="fan icon"
|
|
data-search-terms="ac, air conditioning, blade, blower, cool, hot"></i>fan</div>
|
|
<div class="column"><i class="fire icon"
|
|
data-search-terms="burn, caliente, flame, heat, hot, popular"></i>fire</div>
|
|
<div class="column"><i class="fire alternate icon"
|
|
data-search-terms="burn, caliente, flame, heat, hot, popular"></i>fire alternate</div>
|
|
<div class="column"><i class="gas pump icon" data-search-terms="car, fuel, gasoline, petrol"></i>gas
|
|
pump</div>
|
|
<div class="column"><i class="industry icon"
|
|
data-search-terms="building, factory, industrial, manufacturing, mill, warehouse"></i>industry
|
|
</div>
|
|
<div class="column"><i class="leaf icon" data-search-terms="eco, flora, nature, plant, vegan"></i>leaf
|
|
</div>
|
|
<div class="column"><i class="lightbulb icon"
|
|
data-search-terms="energy, idea, inspiration, light"></i>lightbulb</div>
|
|
<div class="column"><i class="lightbulb outline icon"
|
|
data-search-terms="energy, idea, inspiration, light"></i>lightbulb outline</div>
|
|
<div class="column"><i class="plug icon" data-search-terms="connect, electric, online, power"></i>plug
|
|
</div>
|
|
<div class="column"><i class="poop icon" data-search-terms="crap, poop, shit, smile, turd"></i>poop
|
|
</div>
|
|
<div class="column"><i class="power off icon"
|
|
data-search-terms="cancel, computer, on, reboot, restart"></i>power off</div>
|
|
<div class="column"><i class="radiation icon"
|
|
data-search-terms="danger, dangerous, deadly, hazard, nuclear, radioactive, warning"></i>radiation
|
|
</div>
|
|
<div class="column"><i class="radiation alternate icon"
|
|
data-search-terms="danger, dangerous, deadly, hazard, nuclear, radioactive, warning"></i>radiation
|
|
alternate</div>
|
|
<div class="column"><i class="seedling icon" data-search-terms="flora, grow, plant, vegan"></i>seedling
|
|
</div>
|
|
<div class="column"><i class="solar panel icon"
|
|
data-search-terms="clean, eco-friendly, energy, green, sun"></i>solar panel</div>
|
|
<div class="column"><i class="sun icon"
|
|
data-search-terms="brighten, contrast, day, lighter, sol, solar, star, weather"></i>sun</div>
|
|
<div class="column"><i class="sun outline icon"
|
|
data-search-terms="brighten, contrast, day, lighter, sol, solar, star, weather"></i>sun outline
|
|
</div>
|
|
<div class="column"><i class="water icon"
|
|
data-search-terms="lake, liquid, ocean, sea, swim, wet"></i>water</div>
|
|
<div class="column"><i class="wind icon"
|
|
data-search-terms="air, blow, breeze, fall, seasonal, weather"></i>wind</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Files</h4>
|
|
<p>Icons can represent elements of a computer and its file system</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="archive icon" data-search-terms="box, package, save, storage"></i>archive
|
|
</div>
|
|
<div class="column"><i class="clone icon" data-search-terms="arrange, copy, duplicate, paste"></i>clone
|
|
</div>
|
|
<div class="column"><i class="clone outline icon"
|
|
data-search-terms="arrange, copy, duplicate, paste"></i>clone outline</div>
|
|
<div class="column"><i class="copy icon"
|
|
data-search-terms="clone, duplicate, file, files-o, paper, paste"></i>copy</div>
|
|
<div class="column"><i class="copy outline icon"
|
|
data-search-terms="clone, duplicate, file, files-o, paper, paste"></i>copy outline</div>
|
|
<div class="column"><i class="cut icon" data-search-terms="clip, scissors, snip"></i>cut</div>
|
|
<div class="column"><i class="file icon" data-search-terms="document, new, page, pdf, resume"></i>file
|
|
</div>
|
|
<div class="column"><i class="file alternate icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate</div>
|
|
<div class="column"><i class="file alternate outline icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate outline
|
|
</div>
|
|
<div class="column"><i class="file archive icon"
|
|
data-search-terms=".zip, bundle, compress, compression, download, zip"></i>file archive</div>
|
|
<div class="column"><i class="file archive outline icon"
|
|
data-search-terms=".zip, bundle, compress, compression, download, zip"></i>file archive outline
|
|
</div>
|
|
<div class="column"><i class="file audio icon"
|
|
data-search-terms="document, mp3, music, page, play, sound"></i>file audio</div>
|
|
<div class="column"><i class="file audio outline icon"
|
|
data-search-terms="document, mp3, music, page, play, sound"></i>file audio outline</div>
|
|
<div class="column"><i class="file code icon"
|
|
data-search-terms="css, development, document, html"></i>file code</div>
|
|
<div class="column"><i class="file code outline icon"
|
|
data-search-terms="css, development, document, html"></i>file code outline</div>
|
|
<div class="column"><i class="file excel icon"
|
|
data-search-terms="csv, document, numbers, spreadsheets, table"></i>file excel</div>
|
|
<div class="column"><i class="file excel outline icon"
|
|
data-search-terms="csv, document, numbers, spreadsheets, table"></i>file excel outline</div>
|
|
<div class="column"><i class="file image icon"
|
|
data-search-terms="document, image, jpg, photo, png"></i>file image</div>
|
|
<div class="column"><i class="file image outline icon"
|
|
data-search-terms="document, image, jpg, photo, png"></i>file image outline</div>
|
|
<div class="column"><i class="file outline icon"
|
|
data-search-terms="document, new, page, pdf, resume"></i>file outline</div>
|
|
<div class="column"><i class="file pdf icon"
|
|
data-search-terms="acrobat, document, preview, save"></i>file pdf</div>
|
|
<div class="column"><i class="file pdf outline icon"
|
|
data-search-terms="acrobat, document, preview, save"></i>file pdf outline</div>
|
|
<div class="column"><i class="file powerpoint icon"
|
|
data-search-terms="display, document, keynote, presentation"></i>file powerpoint</div>
|
|
<div class="column"><i class="file powerpoint outline icon"
|
|
data-search-terms="display, document, keynote, presentation"></i>file powerpoint outline</div>
|
|
<div class="column"><i class="file video icon"
|
|
data-search-terms="document, m4v, movie, mp4, play"></i>file video</div>
|
|
<div class="column"><i class="file video outline icon"
|
|
data-search-terms="document, m4v, movie, mp4, play"></i>file video outline</div>
|
|
<div class="column"><i class="file word icon"
|
|
data-search-terms="document, edit, page, text, writing"></i>file word</div>
|
|
<div class="column"><i class="file word outline icon"
|
|
data-search-terms="document, edit, page, text, writing"></i>file word outline</div>
|
|
<div class="column"><i class="folder icon"
|
|
data-search-terms="archive, directory, document, file"></i>folder</div>
|
|
<div class="column"><i class="folder open icon"
|
|
data-search-terms="archive, directory, document, empty, file, new"></i>folder open</div>
|
|
<div class="column"><i class="folder open outline icon"
|
|
data-search-terms="archive, directory, document, empty, file, new"></i>folder open outline</div>
|
|
<div class="column"><i class="folder outline icon"
|
|
data-search-terms="archive, directory, document, file"></i>folder outline</div>
|
|
<div class="column"><i class="paste icon" data-search-terms="clipboard, copy, document, paper"></i>paste
|
|
</div>
|
|
<div class="column"><i class="photo video icon"
|
|
data-search-terms="av, film, image, library, media"></i>photo video</div>
|
|
<div class="column"><i class="save icon" data-search-terms="disk, download, floppy, floppy-o"></i>save
|
|
</div>
|
|
<div class="column"><i class="save outline icon"
|
|
data-search-terms="disk, download, floppy, floppy-o"></i>save outline</div>
|
|
<div class="column"><i class="sticky note icon"
|
|
data-search-terms="message, note, paper, reminder, sticker"></i>sticky note</div>
|
|
<div class="column"><i class="sticky note outline icon"
|
|
data-search-terms="message, note, paper, reminder, sticker"></i>sticky note outline</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Finance</h4>
|
|
<p>Icons which represent financial activities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="balance scale icon"
|
|
data-search-terms="balanced, justice, legal, measure, weight"></i>balance scale</div>
|
|
<div class="column"><i class="balance scale left icon"
|
|
data-search-terms="justice, legal, measure, unbalanced, weight"></i>balance scale left</div>
|
|
<div class="column"><i class="balance scale right icon"
|
|
data-search-terms="justice, legal, measure, unbalanced, weight"></i>balance scale right</div>
|
|
<div class="column"><i class="book icon"
|
|
data-search-terms="diary, documentation, journal, library, read"></i>book</div>
|
|
<div class="column"><i class="cash register icon"
|
|
data-search-terms="buy, cha-ching, change, checkout, commerce, leaerboard, machine, pay, payment, purchase, store"></i>cash
|
|
register</div>
|
|
<div class="column"><i class="chart pie icon"
|
|
data-search-terms="analytics, chart, diagram, graph, pie"></i>chart pie</div>
|
|
<div class="column"><i class="chartline icon"
|
|
data-search-terms="activity, analytics, chart, dashboard, gain, graph, increase, line"></i>chartline
|
|
</div>
|
|
<div class="column"><i class="coins icon"
|
|
data-search-terms="currency, dime, financial, gold, money, penny"></i>coins</div>
|
|
<div class="column"><i class="comment dollar icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, money, note, notification, pay, sms, speech, spend, texting, transfer"></i>comment
|
|
dollar</div>
|
|
<div class="column"><i class="comments dollar icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, money, note, notification, pay, sms, speech, spend, texting, transfer"></i>comments
|
|
dollar</div>
|
|
<div class="column"><i class="credit card icon"
|
|
data-search-terms="buy, checkout, credit-card-alt, debit, money, payment, purchase"></i>credit
|
|
card</div>
|
|
<div class="column"><i class="credit card outline icon"
|
|
data-search-terms="buy, checkout, credit-card-alt, debit, money, payment, purchase"></i>credit
|
|
card outline</div>
|
|
<div class="column"><i class="donate icon"
|
|
data-search-terms="contribute, generosity, gift, give"></i>donate</div>
|
|
<div class="column"><i class="file invoice icon"
|
|
data-search-terms="account, bill, charge, document, payment, receipt"></i>file invoice</div>
|
|
<div class="column"><i class="file invoice dollar icon"
|
|
data-search-terms="$, account, bill, charge, document, dollar-sign, money, payment, receipt, usd"></i>file
|
|
invoice dollar</div>
|
|
<div class="column"><i class="hand holding usd icon"
|
|
data-search-terms="$, carry, dollar sign, donation, giving, lift, money, price"></i>hand holding
|
|
usd</div>
|
|
<div class="column"><i class="landmark icon"
|
|
data-search-terms="building, historic, memorable, monument, politics"></i>landmark</div>
|
|
<div class="column"><i class="money bill icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill</div>
|
|
<div class="column"><i class="money bill alternate icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill
|
|
alternate</div>
|
|
<div class="column"><i class="money bill alternate outline icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill
|
|
alternate outline</div>
|
|
<div class="column"><i class="money bill wave icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill wave
|
|
</div>
|
|
<div class="column"><i class="money bill wave alternate icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill wave
|
|
alternate</div>
|
|
<div class="column"><i class="money check icon"
|
|
data-search-terms="bank check, buy, checkout, cheque, money, payment, price, purchase"></i>money
|
|
check</div>
|
|
<div class="column"><i class="money check alternate icon"
|
|
data-search-terms="bank check, buy, checkout, cheque, money, payment, price, purchase"></i>money
|
|
check alternate</div>
|
|
<div class="column"><i class="percentage icon"
|
|
data-search-terms="discount, fraction, proportion, rate, ratio"></i>percentage</div>
|
|
<div class="column"><i class="piggy bank icon" data-search-terms="bank, save, savings"></i>piggy bank
|
|
</div>
|
|
<div class="column"><i class="receipt icon"
|
|
data-search-terms="check, invoice, money, pay, table"></i>receipt</div>
|
|
<div class="column"><i class="stamp icon"
|
|
data-search-terms="art, certificate, imprint, rubber, seal"></i>stamp</div>
|
|
<div class="column"><i class="wallet icon"
|
|
data-search-terms="billfold, cash, currency, money"></i>wallet</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Fitness</h4>
|
|
<p>Icons which represent fitness activities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="bicycle icon"
|
|
data-search-terms="bike, gears, pedal, transportation, vehicle"></i>bicycle</div>
|
|
<div class="column"><i class="biking icon"
|
|
data-search-terms="bicycle, bike, cycle, cycling, ride, wheel"></i>biking</div>
|
|
<div class="column"><i class="burn icon"
|
|
data-search-terms="caliente, energy, fire, flame, gas, heat, hot"></i>burn</div>
|
|
<div class="column"><i class="fire alternate icon"
|
|
data-search-terms="burn, caliente, flame, heat, hot, popular"></i>fire alternate</div>
|
|
<div class="column"><i class="heart icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart</div>
|
|
<div class="column"><i class="heart outline icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart outline</div>
|
|
<div class="column"><i class="heartbeat icon"
|
|
data-search-terms="ekg, electrocardiogram, health, lifeline, vital signs"></i>heartbeat</div>
|
|
<div class="column"><i class="hiking icon"
|
|
data-search-terms="activity, backpack, fall, fitness, outdoors, person, seasonal, walking"></i>hiking
|
|
</div>
|
|
<div class="column"><i class="running icon"
|
|
data-search-terms="exercise, health, jog, person, run, sport, sprint"></i>running</div>
|
|
<div class="column"><i class="shoe prints icon"
|
|
data-search-terms="feet, footprints, steps, walk"></i>shoe prints</div>
|
|
<div class="column"><i class="skating icon"
|
|
data-search-terms="activity, figure skating, fitness, ice, person, winter"></i>skating</div>
|
|
<div class="column"><i class="skiing icon"
|
|
data-search-terms="activity, downhill, fast, fitness, olympics, outdoors, person, seasonal, slalom"></i>skiing
|
|
</div>
|
|
<div class="column"><i class="skiing nordic icon"
|
|
data-search-terms="activity, cross country, fitness, outdoors, person, seasonal"></i>skiing
|
|
nordic</div>
|
|
<div class="column"><i class="snowboarding icon"
|
|
data-search-terms="activity, fitness, olympics, outdoors, person"></i>snowboarding</div>
|
|
<div class="column"><i class="spa icon"
|
|
data-search-terms="flora, massage, mindfulness, plant, wellness"></i>spa</div>
|
|
<div class="column"><i class="swimmer icon"
|
|
data-search-terms="athlete, head, man, olympics, person, pool, water"></i>swimmer</div>
|
|
<div class="column"><i class="walking icon"
|
|
data-search-terms="exercise, health, pedometer, person, steps"></i>walking</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Food</h4>
|
|
<p>Icons which represent food</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="bacon icon"
|
|
data-search-terms="blt, breakfast, ham, lard, meat, pancetta, pork, rasher"></i>bacon</div>
|
|
<div class="column"><i class="bone icon"
|
|
data-search-terms="calcium, dog, skeletal, skeleton, tibia"></i>bone</div>
|
|
<div class="column"><i class="bread slice icon"
|
|
data-search-terms="bake, bakery, baking, dough, flour, gluten, grain, sandwich, sourdough, toast, wheat, yeast"></i>bread
|
|
slice</div>
|
|
<div class="column"><i class="candy cane icon"
|
|
data-search-terms="candy, christmas, holiday, mint, peppermint, striped, xmas"></i>candy cane
|
|
</div>
|
|
<div class="column"><i class="carrot icon"
|
|
data-search-terms="bugs bunny, orange, vegan, vegetable"></i>carrot</div>
|
|
<div class="column"><i class="cheese icon"
|
|
data-search-terms="cheddar, curd, gouda, melt, parmesan, sandwich, swiss, wedge"></i>cheese
|
|
</div>
|
|
<div class="column"><i class="cloud meatball icon"
|
|
data-search-terms="FLDSMDFR, food, spaghetti, storm"></i>cloud meatball</div>
|
|
<div class="column"><i class="cookie icon"
|
|
data-search-terms="baked good, chips, chocolate, eat, snack, sweet, treat"></i>cookie</div>
|
|
<div class="column"><i class="drumstick bite icon"
|
|
data-search-terms="bone, chicken, leg, meat, poultry, turkey"></i>drumstick bite</div>
|
|
<div class="column"><i class="egg icon"
|
|
data-search-terms="breakfast, chicken, easter, shell, yolk"></i>egg</div>
|
|
<div class="column"><i class="fish icon" data-search-terms="fauna, gold, seafood, swimming"></i>fish
|
|
</div>
|
|
<div class="column"><i class="fruit-apple icon"
|
|
data-search-terms="fall, fruit, fuji, macintosh, orchard, seasonal, vegan"></i>fruit-apple</div>
|
|
<div class="column"><i class="hamburger icon"
|
|
data-search-terms="bacon, beef, burger, burger king, cheeseburger, fast food, grill, ground beef, mcdonalds, sandwich"></i>hamburger
|
|
</div>
|
|
<div class="column"><i class="hotdog icon"
|
|
data-search-terms="bun, chili, frankfurt, frankfurter, kosher, polish, sandwich, sausage, vienna, weiner"></i>hotdog
|
|
</div>
|
|
<div class="column"><i class="ice cream icon"
|
|
data-search-terms="chocolate, cone, dessert, frozen, scoop, sorbet, vanilla, yogurt"></i>ice
|
|
cream</div>
|
|
<div class="column"><i class="lemon icon" data-search-terms="citrus, lemonade, lime, tart"></i>lemon
|
|
</div>
|
|
<div class="column"><i class="lemon outline icon"
|
|
data-search-terms="citrus, lemonade, lime, tart"></i>lemon outline</div>
|
|
<div class="column"><i class="pepper hot icon"
|
|
data-search-terms="buffalo wings, capsicum, chili, chilli, habanero, jalapeno, mexican, spicy, tabasco, vegetable"></i>pepper
|
|
hot</div>
|
|
<div class="column"><i class="pizza slice icon"
|
|
data-search-terms="cheese, chicago, italian, mozzarella, new york, pepperoni, pie, slice, teenage mutant ninja turtles, tomato"></i>pizza
|
|
slice</div>
|
|
<div class="column"><i class="seedling icon" data-search-terms="flora, grow, plant, vegan"></i>seedling
|
|
</div>
|
|
<div class="column"><i class="stroopwafel icon"
|
|
data-search-terms="caramel, cookie, dessert, sweets, waffle"></i>stroopwafel</div>
|
|
</div>
|
|
<div class="existing code">
|
|
<i class="bacon icon"></i>
|
|
<i class="bone icon"></i>
|
|
<i class="bread slice icon"></i>
|
|
<i class="candy cane icon"></i>
|
|
<i class="carrot icon"></i>
|
|
<i class="cheese icon"></i>
|
|
<i class="cloud meatball icon"></i>
|
|
<i class="cookie icon"></i>
|
|
<i class="drumstick bite icon"></i>
|
|
<i class="egg icon"></i>
|
|
<i class="fish icon"></i>
|
|
<i class="fruit-apple icon"></i>
|
|
<i class="hamburger icon"></i>
|
|
<i class="hotdog icon"></i>
|
|
<i class="ice cream icon"></i>
|
|
<i class="lemon icon"></i>
|
|
<i class="lemon outline icon"></i>
|
|
<i class="pepper hot icon"></i>
|
|
<i class="pizza slice icon"></i>
|
|
<i class="seedling icon"></i>
|
|
<i class="stroopwafel icon"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Fruits & Vegetables</h4>
|
|
<p>Icons which represent fruit and vegetables</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="carrot icon"
|
|
data-search-terms="bugs bunny, orange, vegan, vegetable"></i>carrot</div>
|
|
<div class="column"><i class="fruit-apple icon"
|
|
data-search-terms="fall, fruit, fuji, macintosh, orchard, seasonal, vegan"></i>fruit-apple</div>
|
|
<div class="column"><i class="leaf icon" data-search-terms="eco, flora, nature, plant, vegan"></i>leaf
|
|
</div>
|
|
<div class="column"><i class="lemon icon" data-search-terms="citrus, lemonade, lime, tart"></i>lemon
|
|
</div>
|
|
<div class="column"><i class="lemon outline icon"
|
|
data-search-terms="citrus, lemonade, lime, tart"></i>lemon outline</div>
|
|
<div class="column"><i class="pepper hot icon"
|
|
data-search-terms="buffalo wings, capsicum, chili, chilli, habanero, jalapeno, mexican, spicy, tabasco, vegetable"></i>pepper
|
|
hot</div>
|
|
<div class="column"><i class="seedling icon" data-search-terms="flora, grow, plant, vegan"></i>seedling
|
|
</div>
|
|
</div>
|
|
<div class="existing code">
|
|
<i class="carrot icon"></i>
|
|
<i class="fruit-apple icon"></i>
|
|
<i class="leaf icon"></i>
|
|
<i class="lemon icon"></i>
|
|
<i class="lemon outline icon"></i>
|
|
<i class="pepper hot icon"></i>
|
|
<i class="seedling icon"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Games</h4>
|
|
<p>Icons which represent gaming equipment and platforms</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="chess icon"
|
|
data-search-terms="board, castle, checkmate, game, king, rook, strategy, tournament"></i>chess
|
|
</div>
|
|
<div class="column"><i class="chess bishop icon"
|
|
data-search-terms="board, checkmate, game, strategy"></i>chess bishop</div>
|
|
<div class="column"><i class="chess board icon"
|
|
data-search-terms="board, checkmate, game, strategy"></i>chess board</div>
|
|
<div class="column"><i class="chess king icon"
|
|
data-search-terms="board, checkmate, game, strategy"></i>chess king</div>
|
|
<div class="column"><i class="chess knight icon"
|
|
data-search-terms="board, checkmate, game, horse, strategy"></i>chess knight</div>
|
|
<div class="column"><i class="chess pawn icon"
|
|
data-search-terms="board, checkmate, game, strategy"></i>chess pawn</div>
|
|
<div class="column"><i class="chess queen icon"
|
|
data-search-terms="board, checkmate, game, strategy"></i>chess queen</div>
|
|
<div class="column"><i class="chess rook icon"
|
|
data-search-terms="board, castle, checkmate, game, strategy"></i>chess rook</div>
|
|
<div class="column"><i class="dice icon" data-search-terms="chance, gambling, game, roll"></i>dice</div>
|
|
<div class="column"><i class="dice d20 icon"
|
|
data-search-terms="Dungeons & Dragons, chance, d&d, dnd, fantasy, gambling, game, roll"></i>dice
|
|
d20</div>
|
|
<div class="column"><i class="dice d6 icon"
|
|
data-search-terms="Dungeons & Dragons, chance, d&d, dnd, fantasy, gambling, game, roll"></i>dice
|
|
d6</div>
|
|
<div class="column"><i class="dice five icon" data-search-terms="chance, gambling, game, roll"></i>dice
|
|
five</div>
|
|
<div class="column"><i class="dice four icon" data-search-terms="chance, gambling, game, roll"></i>dice
|
|
four</div>
|
|
<div class="column"><i class="dice one icon" data-search-terms="chance, gambling, game, roll"></i>dice
|
|
one</div>
|
|
<div class="column"><i class="dice six icon" data-search-terms="chance, gambling, game, roll"></i>dice
|
|
six</div>
|
|
<div class="column"><i class="dice three icon" data-search-terms="chance, gambling, game, roll"></i>dice
|
|
three</div>
|
|
<div class="column"><i class="dice two icon" data-search-terms="chance, gambling, game, roll"></i>dice
|
|
two</div>
|
|
<div class="column"><i class="gamepad icon"
|
|
data-search-terms="arcade, controller, d-pad, joystick, video, video game"></i>gamepad</div>
|
|
<div class="column"><i class="ghost icon"
|
|
data-search-terms="apparition, blinky, clyde, floating, halloween, holiday, inky, pinky, spirit"></i>ghost
|
|
</div>
|
|
<div class="column"><i class="headset icon"
|
|
data-search-terms="audio, gamer, gaming, listen, live chat, microphone, shot caller, sound, support, telemarketer"></i>headset
|
|
</div>
|
|
<div class="column"><i class="heart icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart</div>
|
|
<div class="column"><i class="heart outline icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart outline</div>
|
|
<div class="column"><i class="playstation icon" data-search-terms=""></i>playstation</div>
|
|
<div class="column"><i class="puzzle piece icon"
|
|
data-search-terms="add-on, addon, game, section"></i>puzzle piece</div>
|
|
<div class="column"><i class="steam icon" data-search-terms=""></i>steam</div>
|
|
<div class="column"><i class="steam square icon" data-search-terms=""></i>steam square</div>
|
|
<div class="column"><i class="steam symbol icon" data-search-terms=""></i>steam symbol</div>
|
|
<div class="column"><i class="twitch icon" data-search-terms=""></i>twitch</div>
|
|
<div class="column"><i class="xbox icon" data-search-terms=""></i>xbox</div>
|
|
</div>
|
|
<div class="existing code">
|
|
<i class="chess icon"></i>
|
|
<i class="chess bishop icon"></i>
|
|
<i class="chess board icon"></i>
|
|
<i class="chess king icon"></i>
|
|
<i class="chess knight icon"></i>
|
|
<i class="chess pawn icon"></i>
|
|
<i class="chess queen icon"></i>
|
|
<i class="chess rook icon"></i>
|
|
<i class="dice icon"></i>
|
|
<i class="dice d20 icon"></i>
|
|
<i class="dice d6 icon"></i>
|
|
<i class="dice five icon"></i>
|
|
<i class="dice four icon"></i>
|
|
<i class="dice one icon"></i>
|
|
<i class="dice six icon"></i>
|
|
<i class="dice three icon"></i>
|
|
<i class="dice two icon"></i>
|
|
<i class="gamepad icon"></i>
|
|
<i class="ghost icon"></i>
|
|
<i class="headset icon"></i>
|
|
<i class="heart icon"></i>
|
|
<i class="heart outline icon"></i>
|
|
<i class="playstation icon"></i>
|
|
<i class="puzzle piece icon"></i>
|
|
<i class="steam icon"></i>
|
|
<i class="steam square icon"></i>
|
|
<i class="steam symbol icon"></i>
|
|
<i class="twitch icon"></i>
|
|
<i class="xbox icon"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Genders</h4>
|
|
<p>Icons can represent genders or types of sexuality</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="genderless icon"
|
|
data-search-terms="androgynous, asexual, sexless"></i>genderless</div>
|
|
<div class="column"><i class="mars icon" data-search-terms="male"></i>mars</div>
|
|
<div class="column"><i class="mars double icon" data-search-terms=""></i>mars double</div>
|
|
<div class="column"><i class="mars stroke icon" data-search-terms=""></i>mars stroke</div>
|
|
<div class="column"><i class="mars stroke horizontal icon" data-search-terms=""></i>mars stroke
|
|
horizontal</div>
|
|
<div class="column"><i class="mars stroke vertical icon" data-search-terms=""></i>mars stroke vertical
|
|
</div>
|
|
<div class="column"><i class="mercury icon" data-search-terms="transgender"></i>mercury</div>
|
|
<div class="column"><i class="neuter icon" data-search-terms=""></i>neuter</div>
|
|
<div class="column"><i class="transgender icon" data-search-terms="intersex"></i>transgender</div>
|
|
<div class="column"><i class="transgender alternate icon" data-search-terms="intersex"></i>transgender
|
|
alternate</div>
|
|
<div class="column"><i class="venus icon" data-search-terms="female"></i>venus</div>
|
|
<div class="column"><i class="venus double icon" data-search-terms="female"></i>venus double</div>
|
|
<div class="column"><i class="venus mars icon" data-search-terms="Gender"></i>venus mars</div>
|
|
</div>
|
|
<div class="existing code">
|
|
<i class="genderless icon"></i>
|
|
<i class="mars icon"></i>
|
|
<i class="mars double icon"></i>
|
|
<i class="mars stroke icon"></i>
|
|
<i class="mars stroke horizontal icon"></i>
|
|
<i class="mars stroke vertical icon"></i>
|
|
<i class="mercury icon"></i>
|
|
<i class="neuter icon"></i>
|
|
<i class="transgender icon"></i>
|
|
<i class="transgender alternate icon"></i>
|
|
<i class="venus icon"></i>
|
|
<i class="venus double icon"></i>
|
|
<i class="venus mars icon"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Halloween</h4>
|
|
<p>Icons which represent Halloween</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="book dead icon"
|
|
data-search-terms="Dungeons & Dragons, crossbones, d&d, dark arts, death, dnd, documentation, evil, fantasy, halloween, holiday, necronomicon, read, skull, spell"></i>book
|
|
dead</div>
|
|
<div class="column"><i class="broom icon"
|
|
data-search-terms="clean, firebolt, fly, halloween, nimbus 2000, quidditch, sweep, witch"></i>broom
|
|
</div>
|
|
<div class="column"><i class="cat icon"
|
|
data-search-terms="feline, halloween, holiday, kitten, kitty, meow, pet"></i>cat</div>
|
|
<div class="column"><i class="cloud moon icon"
|
|
data-search-terms="crescent, evening, lunar, night, partly cloudy, sky"></i>cloud moon</div>
|
|
<div class="column"><i class="crow icon"
|
|
data-search-terms="bird, bullfrog, fauna, halloween, holiday, toad"></i>crow</div>
|
|
<div class="column"><i class="ghost icon"
|
|
data-search-terms="apparition, blinky, clyde, floating, halloween, holiday, inky, pinky, spirit"></i>ghost
|
|
</div>
|
|
<div class="column"><i class="hat wizard icon"
|
|
data-search-terms="Dungeons & Dragons, accessory, buckle, clothing, d&d, dnd, fantasy, halloween, head, holiday, mage, magic, pointy, witch"></i>hat
|
|
wizard</div>
|
|
<div class="column"><i class="mask icon"
|
|
data-search-terms="carnivale, costume, disguise, halloween, secret, super hero"></i>mask</div>
|
|
<div class="column"><i class="skull crossbones icon"
|
|
data-search-terms="Dungeons & Dragons, alert, bones, d&d, danger, dead, deadly, death, dnd, fantasy, halloween, holiday, jolly-roger, pirate, poison, skeleton, warning"></i>skull
|
|
crossbones</div>
|
|
<div class="column"><i class="spider icon"
|
|
data-search-terms="arachnid, bug, charlotte, crawl, eight, halloween"></i>spider</div>
|
|
<div class="column"><i class="toilet paper icon"
|
|
data-search-terms="bathroom, covid-19, halloween, holiday, lavatory, prank, restroom, roll"></i>toilet
|
|
paper</div>
|
|
</div>
|
|
<div class="existing code">
|
|
<i class="book dead icon"></i>
|
|
<i class="broom icon"></i>
|
|
<i class="cat icon"></i>
|
|
<i class="cloud moon icon"></i>
|
|
<i class="crow icon"></i>
|
|
<i class="ghost icon"></i>
|
|
<i class="hat wizard icon"></i>
|
|
<i class="mask icon"></i>
|
|
<i class="skull crossbones icon"></i>
|
|
<i class="spider icon"></i>
|
|
<i class="toilet paper icon"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Hands</h4>
|
|
<p>Icons can represent hand signals and gestures</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="allergies icon"
|
|
data-search-terms="allergy, freckles, hand, hives, pox, skin, spots"></i>allergies</div>
|
|
<div class="column"><i class="fist raised icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, hand, ki, monk, resist, strength, unarmed combat"></i>fist
|
|
raised</div>
|
|
<div class="column"><i class="hand holding icon" data-search-terms="carry, lift"></i>hand holding</div>
|
|
<div class="column"><i class="hand holding heart icon"
|
|
data-search-terms="carry, charity, gift, lift, package"></i>hand holding heart</div>
|
|
<div class="column"><i class="hand holding medical icon"
|
|
data-search-terms="care, covid-19, donate, help"></i>hand holding medical</div>
|
|
<div class="column"><i class="hand holding usd icon"
|
|
data-search-terms="$, carry, dollar sign, donation, giving, lift, money, price"></i>hand holding
|
|
usd</div>
|
|
<div class="column"><i class="hand holding water icon"
|
|
data-search-terms="carry, covid-19, drought, grow, lift"></i>hand holding water</div>
|
|
<div class="column"><i class="hand lizard icon" data-search-terms="game, roshambo"></i>hand lizard</div>
|
|
<div class="column"><i class="hand lizard outline icon" data-search-terms="game, roshambo"></i>hand
|
|
lizard outline</div>
|
|
<div class="column"><i class="hand middle finger icon"
|
|
data-search-terms="flip the bird, gesture, hate, rude"></i>hand middle finger</div>
|
|
<div class="column"><i class="hand paper icon" data-search-terms="game, halt, roshambo, stop"></i>hand
|
|
paper</div>
|
|
<div class="column"><i class="hand paper outline icon"
|
|
data-search-terms="game, halt, roshambo, stop"></i>hand paper outline</div>
|
|
<div class="column"><i class="hand peace icon" data-search-terms="rest, truce"></i>hand peace</div>
|
|
<div class="column"><i class="hand peace outline icon" data-search-terms="rest, truce"></i>hand peace
|
|
outline</div>
|
|
<div class="column"><i class="hand point down icon"
|
|
data-search-terms="finger, hand-o-down, point"></i>hand point down</div>
|
|
<div class="column"><i class="hand point down outline icon"
|
|
data-search-terms="finger, hand-o-down, point"></i>hand point down outline</div>
|
|
<div class="column"><i class="hand point left icon"
|
|
data-search-terms="back, finger, hand-o-left, left, point, previous"></i>hand point left</div>
|
|
<div class="column"><i class="hand point left outline icon"
|
|
data-search-terms="back, finger, hand-o-left, left, point, previous"></i>hand point left outline
|
|
</div>
|
|
<div class="column"><i class="hand point right icon"
|
|
data-search-terms="finger, forward, hand-o-right, next, point, right"></i>hand point right</div>
|
|
<div class="column"><i class="hand point right outline icon"
|
|
data-search-terms="finger, forward, hand-o-right, next, point, right"></i>hand point right
|
|
outline</div>
|
|
<div class="column"><i class="hand point up icon" data-search-terms="finger, hand-o-up, point"></i>hand
|
|
point up</div>
|
|
<div class="column"><i class="hand point up outline icon"
|
|
data-search-terms="finger, hand-o-up, point"></i>hand point up outline</div>
|
|
<div class="column"><i class="hand pointer icon" data-search-terms="arrow, cursor, select"></i>hand
|
|
pointer</div>
|
|
<div class="column"><i class="hand pointer outline icon"
|
|
data-search-terms="arrow, cursor, select"></i>hand pointer outline</div>
|
|
<div class="column"><i class="hand rock icon" data-search-terms="fist, game, roshambo"></i>hand rock
|
|
</div>
|
|
<div class="column"><i class="hand rock outline icon" data-search-terms="fist, game, roshambo"></i>hand
|
|
rock outline</div>
|
|
<div class="column"><i class="hand scissors icon" data-search-terms="cut, game, roshambo"></i>hand
|
|
scissors</div>
|
|
<div class="column"><i class="hand scissors outline icon"
|
|
data-search-terms="cut, game, roshambo"></i>hand scissors outline</div>
|
|
<div class="column"><i class="hand sparkles icon"
|
|
data-search-terms="clean, covid-19, hygiene, magic, soap, wash"></i>hand sparkles</div>
|
|
<div class="column"><i class="hand spock icon"
|
|
data-search-terms="live long, prosper, salute, star trek, vulcan"></i>hand spock</div>
|
|
<div class="column"><i class="hand spock outline icon"
|
|
data-search-terms="live long, prosper, salute, star trek, vulcan"></i>hand spock outline</div>
|
|
<div class="column"><i class="hands icon" data-search-terms="carry, hold, lift"></i>hands</div>
|
|
<div class="column"><i class="hands helping icon"
|
|
data-search-terms="aid, assistance, handshake, partnership, volunteering"></i>hands helping
|
|
</div>
|
|
<div class="column"><i class="hands wash icon"
|
|
data-search-terms="covid-19, hygiene, soap, wash"></i>hands wash</div>
|
|
<div class="column"><i class="handshake icon"
|
|
data-search-terms="agreement, greeting, meeting, partnership"></i>handshake</div>
|
|
<div class="column"><i class="handshake alternate slash icon"
|
|
data-search-terms="broken, covid-19, social distance"></i>handshake alternate slash</div>
|
|
<div class="column"><i class="handshake outline icon"
|
|
data-search-terms="agreement, greeting, meeting, partnership"></i>handshake outline</div>
|
|
<div class="column"><i class="handshake slash icon"
|
|
data-search-terms="broken, covid-19, social distance"></i>handshake slash</div>
|
|
<div class="column"><i class="praying hands icon"
|
|
data-search-terms="kneel, preach, religion, worship"></i>praying hands</div>
|
|
<div class="column"><i class="thumbs down icon"
|
|
data-search-terms="disagree, disapprove, dislike, hand, social, thumbs-o-down"></i>thumbs down
|
|
</div>
|
|
<div class="column"><i class="thumbs down outline icon"
|
|
data-search-terms="disagree, disapprove, dislike, hand, social, thumbs-o-down"></i>thumbs down
|
|
outline</div>
|
|
<div class="column"><i class="thumbs up icon"
|
|
data-search-terms="agree, approve, favorite, hand, like, ok, okay, social, success, thumbs-o-up, yes, you got it dude"></i>thumbs
|
|
up</div>
|
|
<div class="column"><i class="thumbs up outline icon"
|
|
data-search-terms="agree, approve, favorite, hand, like, ok, okay, social, success, thumbs-o-up, yes, you got it dude"></i>thumbs
|
|
up outline</div>
|
|
</div>
|
|
<div class="existing code">
|
|
<i class="allergies icon"></i>
|
|
<i class="fist raised icon"></i>
|
|
<i class="hand holding icon"></i>
|
|
<i class="hand holding heart icon"></i>
|
|
<i class="hand holding medical icon"></i>
|
|
<i class="hand holding usd icon"></i>
|
|
<i class="hand holding water icon"></i>
|
|
<i class="hand lizard icon"></i>
|
|
<i class="hand lizard outline icon"></i>
|
|
<i class="hand middle finger icon"></i>
|
|
<i class="hand paper icon"></i>
|
|
<i class="hand paper outline icon"></i>
|
|
<i class="hand peace icon"></i>
|
|
<i class="hand peace outline icon"></i>
|
|
<i class="hand point down icon"></i>
|
|
<i class="hand point down outline icon"></i>
|
|
<i class="hand point left icon"></i>
|
|
<i class="hand point left outline icon"></i>
|
|
<i class="hand point right icon"></i>
|
|
<i class="hand point right outline icon"></i>
|
|
<i class="hand point up icon"></i>
|
|
<i class="hand point up outline icon"></i>
|
|
<i class="hand pointer icon"></i>
|
|
<i class="hand pointer outline icon"></i>
|
|
<i class="hand rock icon"></i>
|
|
<i class="hand rock outline icon"></i>
|
|
<i class="hand scissors icon"></i>
|
|
<i class="hand scissors outline icon"></i>
|
|
<i class="hand sparkles icon"></i>
|
|
<i class="hand spock icon"></i>
|
|
<i class="hand spock outline icon"></i>
|
|
<i class="hands icon"></i>
|
|
<i class="hands helping icon"></i>
|
|
<i class="hands wash icon"></i>
|
|
<i class="handshake icon"></i>
|
|
<i class="handshake alternate slash icon"></i>
|
|
<i class="handshake outline icon"></i>
|
|
<i class="handshake slash icon"></i>
|
|
<i class="praying hands icon"></i>
|
|
<i class="thumbs down icon"></i>
|
|
<i class="thumbs down outline icon"></i>
|
|
<i class="thumbs up icon"></i>
|
|
<i class="thumbs up outline icon"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Health</h4>
|
|
<p>Icons which represent common health symbols</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="accessible icon"
|
|
data-search-terms="accessibility, handicap, person, wheelchair, wheelchair-alt"></i>accessible
|
|
</div>
|
|
<div class="column"><i class="ambulance icon"
|
|
data-search-terms="covid-19, emergency, emt, er, help, hospital, support, vehicle"></i>ambulance
|
|
</div>
|
|
<div class="column"><i class="h square icon"
|
|
data-search-terms="directions, emergency, hospital, hotel, map"></i>h square</div>
|
|
<div class="column"><i class="heart icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart</div>
|
|
<div class="column"><i class="heart outline icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart outline</div>
|
|
<div class="column"><i class="heartbeat icon"
|
|
data-search-terms="ekg, electrocardiogram, health, lifeline, vital signs"></i>heartbeat</div>
|
|
<div class="column"><i class="hospital icon"
|
|
data-search-terms="building, covid-19, emergency room, medical center"></i>hospital</div>
|
|
<div class="column"><i class="hospital outline icon"
|
|
data-search-terms="building, covid-19, emergency room, medical center"></i>hospital outline
|
|
</div>
|
|
<div class="column"><i class="medkit icon"
|
|
data-search-terms="first aid, firstaid, health, help, support"></i>medkit</div>
|
|
<div class="column"><i class="plus square icon"
|
|
data-search-terms="add, create, expand, new, positive, shape"></i>plus square</div>
|
|
<div class="column"><i class="plus square outline icon"
|
|
data-search-terms="add, create, expand, new, positive, shape"></i>plus square outline</div>
|
|
<div class="column"><i class="prescription icon"
|
|
data-search-terms="drugs, medical, medicine, pharmacy, rx"></i>prescription</div>
|
|
<div class="column"><i class="stethoscope icon"
|
|
data-search-terms="covid-19, diagnosis, doctor, general practitioner, hospital, infirmary, medicine, office, outpatient"></i>stethoscope
|
|
</div>
|
|
<div class="column"><i class="user md icon"
|
|
data-search-terms="covid-19, job, medical, nurse, occupation, physician, profile, surgeon"></i>user
|
|
md</div>
|
|
<div class="column"><i class="wheelchair icon"
|
|
data-search-terms="accessible, handicap, person"></i>wheelchair</div>
|
|
</div>
|
|
<div class="existing code">
|
|
<i class="accessible icon"></i>
|
|
<i class="ambulance icon"></i>
|
|
<i class="h square icon"></i>
|
|
<i class="heart icon"></i>
|
|
<i class="heart outline icon"></i>
|
|
<i class="heartbeat icon"></i>
|
|
<i class="hospital icon"></i>
|
|
<i class="hospital outline icon"></i>
|
|
<i class="medkit icon"></i>
|
|
<i class="plus square icon"></i>
|
|
<i class="plus square outline icon"></i>
|
|
<i class="prescription icon"></i>
|
|
<i class="stethoscope icon"></i>
|
|
<i class="user md icon"></i>
|
|
<i class="wheelchair icon"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Holiday</h4>
|
|
<p>Icons which represent holiday items</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="candy cane icon"
|
|
data-search-terms="candy, christmas, holiday, mint, peppermint, striped, xmas"></i>candy cane
|
|
</div>
|
|
<div class="column"><i class="carrot icon"
|
|
data-search-terms="bugs bunny, orange, vegan, vegetable"></i>carrot</div>
|
|
<div class="column"><i class="cookie bite icon"
|
|
data-search-terms="baked good, bitten, chips, chocolate, eat, snack, sweet, treat"></i>cookie
|
|
bite</div>
|
|
<div class="column"><i class="gift icon"
|
|
data-search-terms="christmas, generosity, giving, holiday, party, present, wrapped, xmas"></i>gift
|
|
</div>
|
|
<div class="column"><i class="gifts icon"
|
|
data-search-terms="christmas, generosity, giving, holiday, party, present, wrapped, xmas"></i>gifts
|
|
</div>
|
|
<div class="column"><i class="glass cheers icon"
|
|
data-search-terms="alcohol, bar, beverage, celebration, champagne, clink, drink, holiday, new year's eve, party, toast"></i>glass
|
|
cheers</div>
|
|
<div class="column"><i class="holly berry icon"
|
|
data-search-terms="catwoman, christmas, decoration, flora, halle, holiday, ororo munroe, plant, storm, xmas"></i>holly
|
|
berry</div>
|
|
<div class="column"><i class="mug hot icon"
|
|
data-search-terms="caliente, cocoa, coffee, cup, drink, holiday, hot chocolate, steam, tea, warmth"></i>mug
|
|
hot</div>
|
|
<div class="column"><i class="sleigh icon"
|
|
data-search-terms="christmas, claus, fly, holiday, santa, sled, snow, xmas"></i>sleigh</div>
|
|
<div class="column"><i class="snowman icon"
|
|
data-search-terms="decoration, frost, frosty, holiday"></i>snowman</div>
|
|
</div>
|
|
<div class="existing code">
|
|
<i class="candy cane icon"></i>
|
|
<i class="carrot icon"></i>
|
|
<i class="cookie bite icon"></i>
|
|
<i class="gift icon"></i>
|
|
<i class="gifts icon"></i>
|
|
<i class="glass cheers icon"></i>
|
|
<i class="holly berry icon"></i>
|
|
<i class="mug hot icon"></i>
|
|
<i class="sleigh icon"></i>
|
|
<i class="snowman icon"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Hotel</h4>
|
|
<p>Icons which represent hotel items and utilities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="baby carriage icon"
|
|
data-search-terms="buggy, carrier, infant, push, stroller, transportation, walk, wheels"></i>baby
|
|
carriage</div>
|
|
<div class="column"><i class="bath icon" data-search-terms="clean, shower, tub, wash"></i>bath</div>
|
|
<div class="column"><i class="bed icon"
|
|
data-search-terms="lodging, mattress, rest, sleep, travel"></i>bed</div>
|
|
<div class="column"><i class="briefcase icon"
|
|
data-search-terms="bag, business, luggage, office, work"></i>briefcase</div>
|
|
<div class="column"><i class="car icon"
|
|
data-search-terms="auto, automobile, sedan, transportation, travel, vehicle"></i>car</div>
|
|
<div class="column"><i class="cocktail icon"
|
|
data-search-terms="alcohol, beverage, drink, gin, glass, margarita, martini, vodka"></i>cocktail
|
|
</div>
|
|
<div class="column"><i class="coffee icon"
|
|
data-search-terms="beverage, breakfast, cafe, drink, fall, morning, mug, seasonal, tea"></i>coffee
|
|
</div>
|
|
<div class="column"><i class="concierge bell icon"
|
|
data-search-terms="attention, hotel, receptionist, service, support"></i>concierge bell</div>
|
|
<div class="column"><i class="dice icon" data-search-terms="chance, gambling, game, roll"></i>dice</div>
|
|
<div class="column"><i class="dice five icon" data-search-terms="chance, gambling, game, roll"></i>dice
|
|
five</div>
|
|
<div class="column"><i class="door closed icon" data-search-terms="enter, exit, locked"></i>door closed
|
|
</div>
|
|
<div class="column"><i class="door open icon" data-search-terms="enter, exit, welcome"></i>door open
|
|
</div>
|
|
<div class="column"><i class="dumbbell icon"
|
|
data-search-terms="exercise, gym, strength, weight, weight-lifting"></i>dumbbell</div>
|
|
<div class="column"><i class="glass martini icon"
|
|
data-search-terms="alcohol, bar, beverage, drink, liquor"></i>glass martini</div>
|
|
<div class="column"><i class="glass martini alternate icon"
|
|
data-search-terms="alcohol, bar, beverage, drink, liquor"></i>glass martini alternate</div>
|
|
<div class="column"><i class="hot tub icon"
|
|
data-search-terms="bath, jacuzzi, massage, sauna, spa"></i>hot tub</div>
|
|
<div class="column"><i class="hotel icon"
|
|
data-search-terms="building, inn, lodging, motel, resort, travel"></i>hotel</div>
|
|
<div class="column"><i class="infinity icon" data-search-terms="eternity, forever, math"></i>infinity
|
|
</div>
|
|
<div class="column"><i class="key icon"
|
|
data-search-terms="lock, password, private, secret, unlock"></i>key</div>
|
|
<div class="column"><i class="luggage cart icon"
|
|
data-search-terms="bag, baggage, suitcase, travel"></i>luggage cart</div>
|
|
<div class="column"><i class="shower icon" data-search-terms="bath, clean, faucet, water"></i>shower
|
|
</div>
|
|
<div class="column"><i class="shuttle van icon"
|
|
data-search-terms="airport, machine, public-transportation, transportation, travel, vehicle"></i>shuttle
|
|
van</div>
|
|
<div class="column"><i class="smoking icon"
|
|
data-search-terms="cancer, cigarette, nicotine, smoking status, tobacco"></i>smoking</div>
|
|
<div class="column"><i class="smoking ban icon"
|
|
data-search-terms="ban, cancel, no smoking, non-smoking"></i>smoking ban</div>
|
|
<div class="column"><i class="snowflake icon"
|
|
data-search-terms="precipitation, rain, winter"></i>snowflake</div>
|
|
<div class="column"><i class="snowflake outline icon"
|
|
data-search-terms="precipitation, rain, winter"></i>snowflake outline</div>
|
|
<div class="column"><i class="spa icon"
|
|
data-search-terms="flora, massage, mindfulness, plant, wellness"></i>spa</div>
|
|
<div class="column"><i class="suitcase icon"
|
|
data-search-terms="baggage, luggage, move, suitcase, travel, trip"></i>suitcase</div>
|
|
<div class="column"><i class="suitcase rolling icon"
|
|
data-search-terms="baggage, luggage, move, suitcase, travel, trip"></i>suitcase rolling</div>
|
|
<div class="column"><i class="swimmer icon"
|
|
data-search-terms="athlete, head, man, olympics, person, pool, water"></i>swimmer</div>
|
|
<div class="column"><i class="swimming pool icon"
|
|
data-search-terms="ladder, recreation, swim, water"></i>swimming pool</div>
|
|
<div class="column"><i class="tv icon" data-search-terms="computer, display, monitor, television"></i>tv
|
|
</div>
|
|
<div class="column"><i class="umbrella beach icon"
|
|
data-search-terms="protection, recreation, sand, shade, summer, sun"></i>umbrella beach</div>
|
|
<div class="column"><i class="utensils icon"
|
|
data-search-terms="cutlery, dining, dinner, eat, food, fork, knife, restaurant"></i>utensils
|
|
</div>
|
|
<div class="column"><i class="wheelchair icon"
|
|
data-search-terms="accessible, handicap, person"></i>wheelchair</div>
|
|
<div class="column"><i class="wifi icon"
|
|
data-search-terms="connection, hotspot, internet, network, wireless"></i>wifi</div>
|
|
</div>
|
|
<div class="existing code">
|
|
<i class="baby carriage icon"></i>
|
|
<i class="bath icon"></i>
|
|
<i class="bed icon"></i>
|
|
<i class="briefcase icon"></i>
|
|
<i class="car icon"></i>
|
|
<i class="cocktail icon"></i>
|
|
<i class="coffee icon"></i>
|
|
<i class="concierge bell icon"></i>
|
|
<i class="dice icon"></i>
|
|
<i class="dice five icon"></i>
|
|
<i class="door closed icon"></i>
|
|
<i class="door open icon"></i>
|
|
<i class="dumbbell icon"></i>
|
|
<i class="glass martini icon"></i>
|
|
<i class="glass martini alternate icon"></i>
|
|
<i class="hot tub icon"></i>
|
|
<i class="hotel icon"></i>
|
|
<i class="infinity icon"></i>
|
|
<i class="key icon"></i>
|
|
<i class="luggage cart icon"></i>
|
|
<i class="shower icon"></i>
|
|
<i class="shuttle van icon"></i>
|
|
<i class="smoking icon"></i>
|
|
<i class="smoking ban icon"></i>
|
|
<i class="snowflake icon"></i>
|
|
<i class="snowflake outline icon"></i>
|
|
<i class="spa icon"></i>
|
|
<i class="suitcase icon"></i>
|
|
<i class="suitcase rolling icon"></i>
|
|
<i class="swimmer icon"></i>
|
|
<i class="swimming pool icon"></i>
|
|
<i class="tv icon"></i>
|
|
<i class="umbrella beach icon"></i>
|
|
<i class="utensils icon"></i>
|
|
<i class="wheelchair icon"></i>
|
|
<i class="wifi icon"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Household</h4>
|
|
<p>Icons which represent household items and utilities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="bath icon" data-search-terms="clean, shower, tub, wash"></i>bath</div>
|
|
<div class="column"><i class="bed icon"
|
|
data-search-terms="lodging, mattress, rest, sleep, travel"></i>bed</div>
|
|
<div class="column"><i class="bell icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell</div>
|
|
<div class="column"><i class="bell outline icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell outline</div>
|
|
<div class="column"><i class="blender icon"
|
|
data-search-terms="cocktail, milkshake, mixer, puree, smoothie"></i>blender</div>
|
|
<div class="column"><i class="box tissue icon"
|
|
data-search-terms="cough, covid-19, kleenex, mucus, nose, sneeze, snot"></i>box tissue</div>
|
|
<div class="column"><i class="chair icon" data-search-terms="furniture, seat, sit"></i>chair</div>
|
|
<div class="column"><i class="coffee icon"
|
|
data-search-terms="beverage, breakfast, cafe, drink, fall, morning, mug, seasonal, tea"></i>coffee
|
|
</div>
|
|
<div class="column"><i class="couch icon"
|
|
data-search-terms="chair, cushion, furniture, relax, sofa"></i>couch</div>
|
|
<div class="column"><i class="door closed icon" data-search-terms="enter, exit, locked"></i>door closed
|
|
</div>
|
|
<div class="column"><i class="door open icon" data-search-terms="enter, exit, welcome"></i>door open
|
|
</div>
|
|
<div class="column"><i class="dungeon icon"
|
|
data-search-terms="Dungeons & Dragons, building, d&d, dnd, door, entrance, fantasy, gate"></i>dungeon
|
|
</div>
|
|
<div class="column"><i class="fan icon"
|
|
data-search-terms="ac, air conditioning, blade, blower, cool, hot"></i>fan</div>
|
|
<div class="column"><i class="faucet icon"
|
|
data-search-terms="covid-19, drip, house, hygiene, kitchen, sink, water"></i>faucet</div>
|
|
<div class="column"><i class="house user icon"
|
|
data-search-terms="covid-19, home, isolation, quarantine"></i>house user</div>
|
|
<div class="column"><i class="laptop house icon"
|
|
data-search-terms="computer, covid-19, device, office, remote, work from home"></i>laptop house
|
|
</div>
|
|
<div class="column"><i class="lightbulb icon"
|
|
data-search-terms="energy, idea, inspiration, light"></i>lightbulb</div>
|
|
<div class="column"><i class="lightbulb outline icon"
|
|
data-search-terms="energy, idea, inspiration, light"></i>lightbulb outline</div>
|
|
<div class="column"><i class="plug icon" data-search-terms="connect, electric, online, power"></i>plug
|
|
</div>
|
|
<div class="column"><i class="pump soap icon"
|
|
data-search-terms="anti-bacterial, clean, covid-19, disinfect, hygiene, sanitizer, soap"></i>pump
|
|
soap</div>
|
|
<div class="column"><i class="shower icon" data-search-terms="bath, clean, faucet, water"></i>shower
|
|
</div>
|
|
<div class="column"><i class="sink icon"
|
|
data-search-terms="bathroom, covid-19, faucet, kitchen, wash"></i>sink</div>
|
|
<div class="column"><i class="snowflake icon"
|
|
data-search-terms="precipitation, rain, winter"></i>snowflake</div>
|
|
<div class="column"><i class="snowflake outline icon"
|
|
data-search-terms="precipitation, rain, winter"></i>snowflake outline</div>
|
|
<div class="column"><i class="soap icon"
|
|
data-search-terms="bubbles, clean, covid-19, hygiene, wash"></i>soap</div>
|
|
<div class="column"><i class="toilet paper icon"
|
|
data-search-terms="bathroom, covid-19, halloween, holiday, lavatory, prank, restroom, roll"></i>toilet
|
|
paper</div>
|
|
<div class="column"><i class="toilet paper slash icon"
|
|
data-search-terms="bathroom, covid-19, halloween, holiday, lavatory, leaves, prank, restroom, roll, trouble, ut oh"></i>toilet
|
|
paper slash</div>
|
|
<div class="column"><i class="tv icon" data-search-terms="computer, display, monitor, television"></i>tv
|
|
</div>
|
|
</div>
|
|
<div class="existing code">
|
|
<i class="bath icon"></i>
|
|
<i class="bed icon"></i>
|
|
<i class="bell icon"></i>
|
|
<i class="bell outline icon"></i>
|
|
<i class="blender icon"></i>
|
|
<i class="box tissue icon"></i>
|
|
<i class="chair icon"></i>
|
|
<i class="coffee icon"></i>
|
|
<i class="couch icon"></i>
|
|
<i class="door closed icon"></i>
|
|
<i class="door open icon"></i>
|
|
<i class="dungeon icon"></i>
|
|
<i class="fan icon"></i>
|
|
<i class="faucet icon"></i>
|
|
<i class="house user icon"></i>
|
|
<i class="laptop house icon"></i>
|
|
<i class="lightbulb icon"></i>
|
|
<i class="lightbulb outline icon"></i>
|
|
<i class="plug icon"></i>
|
|
<i class="pump soap icon"></i>
|
|
<i class="shower icon"></i>
|
|
<i class="sink icon"></i>
|
|
<i class="snowflake icon"></i>
|
|
<i class="snowflake outline icon"></i>
|
|
<i class="soap icon"></i>
|
|
<i class="toilet paper icon"></i>
|
|
<i class="toilet paper slash icon"></i>
|
|
<i class="tv icon"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Images</h4>
|
|
<p>Icons that represent common image symbols and actions</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="adjust icon"
|
|
data-search-terms="contrast, dark, light, saturation"></i>adjust</div>
|
|
<div class="column"><i class="bolt icon"
|
|
data-search-terms="electricity, lightning, weather, zap"></i>bolt</div>
|
|
<div class="column"><i class="camera icon"
|
|
data-search-terms="image, lens, photo, picture, record, shutter, video"></i>camera</div>
|
|
<div class="column"><i class="camera retro icon"
|
|
data-search-terms="image, lens, photo, picture, record, shutter, video"></i>camera retro</div>
|
|
<div class="column"><i class="chalkboard icon"
|
|
data-search-terms="blackboard, learning, school, teaching, whiteboard, writing"></i>chalkboard
|
|
</div>
|
|
<div class="column"><i class="clone icon" data-search-terms="arrange, copy, duplicate, paste"></i>clone
|
|
</div>
|
|
<div class="column"><i class="clone outline icon"
|
|
data-search-terms="arrange, copy, duplicate, paste"></i>clone outline</div>
|
|
<div class="column"><i class="compress icon"
|
|
data-search-terms="collapse, fullscreen, minimize, move, resize, shrink, smaller"></i>compress
|
|
</div>
|
|
<div class="column"><i class="compress arrows alternate icon"
|
|
data-search-terms="collapse, fullscreen, minimize, move, resize, shrink, smaller"></i>compress
|
|
arrows alternate</div>
|
|
<div class="column"><i class="expand icon"
|
|
data-search-terms="bigger, enlarge, fullscreen, resize"></i>expand</div>
|
|
<div class="column"><i class="eye icon"
|
|
data-search-terms="look, optic, see, seen, show, sight, views, visible"></i>eye</div>
|
|
<div class="column"><i class="eye dropper icon"
|
|
data-search-terms="beaker, clone, color, copy, eyedropper, pipette"></i>eye dropper</div>
|
|
<div class="column"><i class="eye outline icon"
|
|
data-search-terms="look, optic, see, seen, show, sight, views, visible"></i>eye outline</div>
|
|
<div class="column"><i class="eye slash icon"
|
|
data-search-terms="blind, hide, show, toggle, unseen, views, visible, visiblity"></i>eye slash
|
|
</div>
|
|
<div class="column"><i class="eye slash outline icon"
|
|
data-search-terms="blind, hide, show, toggle, unseen, views, visible, visiblity"></i>eye slash
|
|
outline</div>
|
|
<div class="column"><i class="file image icon"
|
|
data-search-terms="document, image, jpg, photo, png"></i>file image</div>
|
|
<div class="column"><i class="file image outline icon"
|
|
data-search-terms="document, image, jpg, photo, png"></i>file image outline</div>
|
|
<div class="column"><i class="film icon" data-search-terms="cinema, movie, strip, video"></i>film</div>
|
|
<div class="column"><i class="id badge icon"
|
|
data-search-terms="address, contact, identification, license, profile"></i>id badge</div>
|
|
<div class="column"><i class="id badge outline icon"
|
|
data-search-terms="address, contact, identification, license, profile"></i>id badge outline
|
|
</div>
|
|
<div class="column"><i class="id card icon"
|
|
data-search-terms="contact, demographics, document, identification, issued, profile"></i>id card
|
|
</div>
|
|
<div class="column"><i class="id card outline icon"
|
|
data-search-terms="contact, demographics, document, identification, issued, profile"></i>id card
|
|
outline</div>
|
|
<div class="column"><i class="image icon" data-search-terms="album, landscape, photo, picture"></i>image
|
|
</div>
|
|
<div class="column"><i class="image outline icon"
|
|
data-search-terms="album, landscape, photo, picture"></i>image outline</div>
|
|
<div class="column"><i class="images icon"
|
|
data-search-terms="album, landscape, photo, picture"></i>images</div>
|
|
<div class="column"><i class="images outline icon"
|
|
data-search-terms="album, landscape, photo, picture"></i>images outline</div>
|
|
<div class="column"><i class="photo video icon"
|
|
data-search-terms="av, film, image, library, media"></i>photo video</div>
|
|
<div class="column"><i class="portrait icon"
|
|
data-search-terms="id, image, photo, picture, selfie"></i>portrait</div>
|
|
<div class="column"><i class="sliders horizontal icon"
|
|
data-search-terms="adjust, settings, sliders, toggle"></i>sliders horizontal</div>
|
|
<div class="column"><i class="tint icon"
|
|
data-search-terms="color, drop, droplet, raindrop, waterdrop"></i>tint</div>
|
|
<div class="column"><i class="unsplash icon" data-search-terms=""></i>unsplash</div>
|
|
</div>
|
|
<div class="existing code">
|
|
<i class="adjust icon"></i>
|
|
<i class="bolt icon"></i>
|
|
<i class="camera icon"></i>
|
|
<i class="camera retro icon"></i>
|
|
<i class="chalkboard icon"></i>
|
|
<i class="clone icon"></i>
|
|
<i class="clone outline icon"></i>
|
|
<i class="compress icon"></i>
|
|
<i class="compress arrows alternate icon"></i>
|
|
<i class="expand icon"></i>
|
|
<i class="eye icon"></i>
|
|
<i class="eye dropper icon"></i>
|
|
<i class="eye outline icon"></i>
|
|
<i class="eye slash icon"></i>
|
|
<i class="eye slash outline icon"></i>
|
|
<i class="file image icon"></i>
|
|
<i class="file image outline icon"></i>
|
|
<i class="film icon"></i>
|
|
<i class="id badge icon"></i>
|
|
<i class="id badge outline icon"></i>
|
|
<i class="id card icon"></i>
|
|
<i class="id card outline icon"></i>
|
|
<i class="image icon"></i>
|
|
<i class="image outline icon"></i>
|
|
<i class="images icon"></i>
|
|
<i class="images outline icon"></i>
|
|
<i class="photo video icon"></i>
|
|
<i class="portrait icon"></i>
|
|
<i class="sliders horizontal icon"></i>
|
|
<i class="tint icon"></i>
|
|
<i class="unsplash icon"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Interfaces</h4>
|
|
<p>Icons can represent common actions a user can take or use</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="award icon"
|
|
data-search-terms="honor, praise, prize, recognition, ribbon, trophy"></i>award</div>
|
|
<div class="column"><i class="ban icon"
|
|
data-search-terms="abort, ban, block, cancel, delete, hide, prohibit, remove, stop, trash"></i>ban
|
|
</div>
|
|
<div class="column"><i class="barcode icon"
|
|
data-search-terms="info, laser, price, scan, upc"></i>barcode</div>
|
|
<div class="column"><i class="bars icon"
|
|
data-search-terms="checklist, drag, hamburger, list, menu, nav, navigation, ol, reorder, settings, todo, ul"></i>bars
|
|
</div>
|
|
<div class="column"><i class="beer icon"
|
|
data-search-terms="alcohol, ale, bar, beverage, brewery, drink, lager, liquor, mug, stein"></i>beer
|
|
</div>
|
|
<div class="column"><i class="bell icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell</div>
|
|
<div class="column"><i class="bell outline icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell outline</div>
|
|
<div class="column"><i class="bell slash icon"
|
|
data-search-terms="alert, cancel, disabled, notification, off, reminder"></i>bell slash</div>
|
|
<div class="column"><i class="bell slash outline icon"
|
|
data-search-terms="alert, cancel, disabled, notification, off, reminder"></i>bell slash outline
|
|
</div>
|
|
<div class="column"><i class="blog icon"
|
|
data-search-terms="journal, log, online, personal, post, web 2.0, wordpress, writing"></i>blog
|
|
</div>
|
|
<div class="column"><i class="bug icon" data-search-terms="beetle, error, insect, report"></i>bug</div>
|
|
<div class="column"><i class="bullhorn icon"
|
|
data-search-terms="announcement, broadcast, louder, megaphone, share"></i>bullhorn</div>
|
|
<div class="column"><i class="bullseye icon"
|
|
data-search-terms="archery, goal, objective, target"></i>bullseye</div>
|
|
<div class="column"><i class="calculator icon"
|
|
data-search-terms="abacus, addition, arithmetic, counting, math, multiplication, subtraction"></i>calculator
|
|
</div>
|
|
<div class="column"><i class="calendar icon"
|
|
data-search-terms="calendar-o, date, event, schedule, time, when"></i>calendar</div>
|
|
<div class="column"><i class="calendar alternate icon"
|
|
data-search-terms="calendar, date, event, schedule, time, when"></i>calendar alternate</div>
|
|
<div class="column"><i class="calendar alternate outline icon"
|
|
data-search-terms="calendar, date, event, schedule, time, when"></i>calendar alternate outline
|
|
</div>
|
|
<div class="column"><i class="calendar check icon"
|
|
data-search-terms="accept, agree, appointment, confirm, correct, date, done, event, ok, schedule, select, success, tick, time, todo, when"></i>calendar
|
|
check</div>
|
|
<div class="column"><i class="calendar check outline icon"
|
|
data-search-terms="accept, agree, appointment, confirm, correct, date, done, event, ok, schedule, select, success, tick, time, todo, when"></i>calendar
|
|
check outline</div>
|
|
<div class="column"><i class="calendar minus icon"
|
|
data-search-terms="calendar, date, delete, event, negative, remove, schedule, time, when"></i>calendar
|
|
minus</div>
|
|
<div class="column"><i class="calendar minus outline icon"
|
|
data-search-terms="calendar, date, delete, event, negative, remove, schedule, time, when"></i>calendar
|
|
minus outline</div>
|
|
<div class="column"><i class="calendar outline icon"
|
|
data-search-terms="calendar-o, date, event, schedule, time, when"></i>calendar outline</div>
|
|
<div class="column"><i class="calendar plus icon"
|
|
data-search-terms="add, calendar, create, date, event, new, positive, schedule, time, when"></i>calendar
|
|
plus</div>
|
|
<div class="column"><i class="calendar plus outline icon"
|
|
data-search-terms="add, calendar, create, date, event, new, positive, schedule, time, when"></i>calendar
|
|
plus outline</div>
|
|
<div class="column"><i class="calendar times icon"
|
|
data-search-terms="archive, calendar, date, delete, event, remove, schedule, time, when, x"></i>calendar
|
|
times</div>
|
|
<div class="column"><i class="calendar times outline icon"
|
|
data-search-terms="archive, calendar, date, delete, event, remove, schedule, time, when, x"></i>calendar
|
|
times outline</div>
|
|
<div class="column"><i class="certificate icon"
|
|
data-search-terms="badge, star, verified"></i>certificate</div>
|
|
<div class="column"><i class="check icon"
|
|
data-search-terms="accept, agree, checkmark, confirm, correct, done, notice, notification, notify, ok, select, success, tick, todo, yes"></i>check
|
|
</div>
|
|
<div class="column"><i class="check circle icon"
|
|
data-search-terms="accept, agree, confirm, correct, done, ok, select, success, tick, todo, yes"></i>check
|
|
circle</div>
|
|
<div class="column"><i class="check circle outline icon"
|
|
data-search-terms="accept, agree, confirm, correct, done, ok, select, success, tick, todo, yes"></i>check
|
|
circle outline</div>
|
|
<div class="column"><i class="check double icon"
|
|
data-search-terms="accept, agree, checkmark, confirm, correct, done, notice, notification, notify, ok, select, success, tick, todo"></i>check
|
|
double</div>
|
|
<div class="column"><i class="check square icon"
|
|
data-search-terms="accept, agree, checkmark, confirm, correct, done, ok, select, success, tick, todo, yes"></i>check
|
|
square</div>
|
|
<div class="column"><i class="check square outline icon"
|
|
data-search-terms="accept, agree, checkmark, confirm, correct, done, ok, select, success, tick, todo, yes"></i>check
|
|
square outline</div>
|
|
<div class="column"><i class="circle icon"
|
|
data-search-terms="circle-thin, diameter, dot, ellipse, notification, round"></i>circle</div>
|
|
<div class="column"><i class="circle outline icon"
|
|
data-search-terms="circle-thin, diameter, dot, ellipse, notification, round"></i>circle outline
|
|
</div>
|
|
<div class="column"><i class="clipboard icon"
|
|
data-search-terms="copy, notes, paste, record"></i>clipboard</div>
|
|
<div class="column"><i class="clipboard outline icon"
|
|
data-search-terms="copy, notes, paste, record"></i>clipboard outline</div>
|
|
<div class="column"><i class="clone icon" data-search-terms="arrange, copy, duplicate, paste"></i>clone
|
|
</div>
|
|
<div class="column"><i class="clone outline icon"
|
|
data-search-terms="arrange, copy, duplicate, paste"></i>clone outline</div>
|
|
<div class="column"><i class="cloud icon"
|
|
data-search-terms="atmosphere, fog, overcast, save, upload, weather"></i>cloud</div>
|
|
<div class="column"><i class="cloud download alternate icon"
|
|
data-search-terms="download, export, save"></i>cloud download alternate</div>
|
|
<div class="column"><i class="cloud upload alternate icon"
|
|
data-search-terms="cloud-upload, import, save, upload"></i>cloud upload alternate</div>
|
|
<div class="column"><i class="coffee icon"
|
|
data-search-terms="beverage, breakfast, cafe, drink, fall, morning, mug, seasonal, tea"></i>coffee
|
|
</div>
|
|
<div class="column"><i class="cog icon"
|
|
data-search-terms="gear, mechanical, settings, sprocket, wheel"></i>cog</div>
|
|
<div class="column"><i class="cogs icon"
|
|
data-search-terms="gears, mechanical, settings, sprocket, wheel"></i>cogs</div>
|
|
<div class="column"><i class="copy icon"
|
|
data-search-terms="clone, duplicate, file, files-o, paper, paste"></i>copy</div>
|
|
<div class="column"><i class="copy outline icon"
|
|
data-search-terms="clone, duplicate, file, files-o, paper, paste"></i>copy outline</div>
|
|
<div class="column"><i class="cut icon" data-search-terms="clip, scissors, snip"></i>cut</div>
|
|
<div class="column"><i class="database icon"
|
|
data-search-terms="computer, development, directory, memory, storage"></i>database</div>
|
|
<div class="column"><i class="dot circle icon"
|
|
data-search-terms="bullseye, notification, target"></i>dot circle</div>
|
|
<div class="column"><i class="dot circle outline icon"
|
|
data-search-terms="bullseye, notification, target"></i>dot circle outline</div>
|
|
<div class="column"><i class="download icon"
|
|
data-search-terms="export, hard drive, save, transfer"></i>download</div>
|
|
<div class="column"><i class="edit icon" data-search-terms="edit, pen, pencil, update, write"></i>edit
|
|
</div>
|
|
<div class="column"><i class="edit outline icon"
|
|
data-search-terms="edit, pen, pencil, update, write"></i>edit outline</div>
|
|
<div class="column"><i class="ellipsis horizontal icon"
|
|
data-search-terms="dots, drag, kebab, list, menu, nav, navigation, ol, reorder, settings, ul"></i>ellipsis
|
|
horizontal</div>
|
|
<div class="column"><i class="ellipsis vertical icon"
|
|
data-search-terms="dots, drag, kebab, list, menu, nav, navigation, ol, reorder, settings, ul"></i>ellipsis
|
|
vertical</div>
|
|
<div class="column"><i class="envelope icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
</div>
|
|
<div class="column"><i class="envelope open icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
open</div>
|
|
<div class="column"><i class="envelope open outline icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
open outline</div>
|
|
<div class="column"><i class="envelope outline icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
outline</div>
|
|
<div class="column"><i class="eraser icon" data-search-terms="art, delete, remove, rubber"></i>eraser
|
|
</div>
|
|
<div class="column"><i class="exclamation icon"
|
|
data-search-terms="alert, danger, error, important, notice, notification, notify, problem, warning"></i>exclamation
|
|
</div>
|
|
<div class="column"><i class="exclamation circle icon"
|
|
data-search-terms="alert, danger, error, important, notice, notification, notify, problem, warning"></i>exclamation
|
|
circle</div>
|
|
<div class="column"><i class="exclamation triangle icon"
|
|
data-search-terms="alert, danger, error, important, notice, notification, notify, problem, warning"></i>exclamation
|
|
triangle</div>
|
|
<div class="column"><i class="external alternate icon"
|
|
data-search-terms="external-link, new, open, share"></i>external alternate</div>
|
|
<div class="column"><i class="external link square alternate icon"
|
|
data-search-terms="external-link-square, new, open, share"></i>external link square alternate
|
|
</div>
|
|
<div class="column"><i class="eye icon"
|
|
data-search-terms="look, optic, see, seen, show, sight, views, visible"></i>eye</div>
|
|
<div class="column"><i class="eye outline icon"
|
|
data-search-terms="look, optic, see, seen, show, sight, views, visible"></i>eye outline</div>
|
|
<div class="column"><i class="eye slash icon"
|
|
data-search-terms="blind, hide, show, toggle, unseen, views, visible, visiblity"></i>eye slash
|
|
</div>
|
|
<div class="column"><i class="eye slash outline icon"
|
|
data-search-terms="blind, hide, show, toggle, unseen, views, visible, visiblity"></i>eye slash
|
|
outline</div>
|
|
<div class="column"><i class="file icon" data-search-terms="document, new, page, pdf, resume"></i>file
|
|
</div>
|
|
<div class="column"><i class="file alternate icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate</div>
|
|
<div class="column"><i class="file alternate outline icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate outline
|
|
</div>
|
|
<div class="column"><i class="file download icon" data-search-terms="document, export, save"></i>file
|
|
download</div>
|
|
<div class="column"><i class="file export icon" data-search-terms="download, save"></i>file export</div>
|
|
<div class="column"><i class="file import icon"
|
|
data-search-terms="copy, document, send, upload"></i>file import</div>
|
|
<div class="column"><i class="file outline icon"
|
|
data-search-terms="document, new, page, pdf, resume"></i>file outline</div>
|
|
<div class="column"><i class="file upload icon"
|
|
data-search-terms="document, import, page, save"></i>file upload</div>
|
|
<div class="column"><i class="filter icon"
|
|
data-search-terms="funnel, options, separate, sort"></i>filter</div>
|
|
<div class="column"><i class="fingerprint icon"
|
|
data-search-terms="human, id, identification, lock, smudge, touch, unique, unlock"></i>fingerprint
|
|
</div>
|
|
<div class="column"><i class="flag icon"
|
|
data-search-terms="country, notice, notification, notify, pole, report, symbol"></i>flag</div>
|
|
<div class="column"><i class="flag checkered icon"
|
|
data-search-terms="notice, notification, notify, pole, racing, report, symbol"></i>flag
|
|
checkered</div>
|
|
<div class="column"><i class="flag outline icon"
|
|
data-search-terms="country, notice, notification, notify, pole, report, symbol"></i>flag outline
|
|
</div>
|
|
<div class="column"><i class="folder icon"
|
|
data-search-terms="archive, directory, document, file"></i>folder</div>
|
|
<div class="column"><i class="folder open icon"
|
|
data-search-terms="archive, directory, document, empty, file, new"></i>folder open</div>
|
|
<div class="column"><i class="folder open outline icon"
|
|
data-search-terms="archive, directory, document, empty, file, new"></i>folder open outline</div>
|
|
<div class="column"><i class="folder outline icon"
|
|
data-search-terms="archive, directory, document, file"></i>folder outline</div>
|
|
<div class="column"><i class="frown icon"
|
|
data-search-terms="disapprove, emoticon, face, rating, sad"></i>frown</div>
|
|
<div class="column"><i class="frown outline icon"
|
|
data-search-terms="disapprove, emoticon, face, rating, sad"></i>frown outline</div>
|
|
<div class="column"><i class="glasses icon"
|
|
data-search-terms="hipster, nerd, reading, sight, spectacles, vision"></i>glasses</div>
|
|
<div class="column"><i class="grip horizontal icon"
|
|
data-search-terms="affordance, drag, drop, grab, handle"></i>grip horizontal</div>
|
|
<div class="column"><i class="grip lines icon"
|
|
data-search-terms="affordance, drag, drop, grab, handle"></i>grip lines</div>
|
|
<div class="column"><i class="grip lines vertical icon"
|
|
data-search-terms="affordance, drag, drop, grab, handle"></i>grip lines vertical</div>
|
|
<div class="column"><i class="grip vertical icon"
|
|
data-search-terms="affordance, drag, drop, grab, handle"></i>grip vertical</div>
|
|
<div class="column"><i class="hashtag icon"
|
|
data-search-terms="Twitter, instagram, pound, social media, tag"></i>hashtag</div>
|
|
<div class="column"><i class="heart icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart</div>
|
|
<div class="column"><i class="heart outline icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart outline</div>
|
|
<div class="column"><i class="history icon"
|
|
data-search-terms="Rewind, clock, reverse, time, time machine"></i>history</div>
|
|
<div class="column"><i class="home icon" data-search-terms="abode, building, house, main"></i>home</div>
|
|
<div class="column"><i class="i cursor icon" data-search-terms="editing, i-beam, type, writing"></i>i
|
|
cursor</div>
|
|
<div class="column"><i class="info icon"
|
|
data-search-terms="details, help, information, more, support"></i>info</div>
|
|
<div class="column"><i class="info circle icon"
|
|
data-search-terms="details, help, information, more, support"></i>info circle</div>
|
|
<div class="column"><i class="language icon"
|
|
data-search-terms="dialect, idiom, localize, speech, translate, vernacular"></i>language</div>
|
|
<div class="column"><i class="magic icon"
|
|
data-search-terms="autocomplete, automatic, mage, magic, spell, wand, witch, wizard"></i>magic
|
|
</div>
|
|
<div class="column"><i class="marker icon"
|
|
data-search-terms="design, edit, sharpie, update, write"></i>marker</div>
|
|
<div class="column"><i class="medal icon" data-search-terms="award, ribbon, star, trophy"></i>medal
|
|
</div>
|
|
<div class="column"><i class="meh icon" data-search-terms="emoticon, face, neutral, rating"></i>meh
|
|
</div>
|
|
<div class="column"><i class="meh outline icon"
|
|
data-search-terms="emoticon, face, neutral, rating"></i>meh outline</div>
|
|
<div class="column"><i class="microphone icon"
|
|
data-search-terms="audio, podcast, record, sing, sound, voice"></i>microphone</div>
|
|
<div class="column"><i class="microphone alternate icon"
|
|
data-search-terms="audio, podcast, record, sing, sound, voice"></i>microphone alternate</div>
|
|
<div class="column"><i class="microphone slash icon"
|
|
data-search-terms="audio, disable, mute, podcast, record, sing, sound, voice"></i>microphone
|
|
slash</div>
|
|
<div class="column"><i class="minus icon"
|
|
data-search-terms="collapse, delete, hide, minify, negative, remove, trash"></i>minus</div>
|
|
<div class="column"><i class="minus circle icon"
|
|
data-search-terms="delete, hide, negative, remove, shape, trash"></i>minus circle</div>
|
|
<div class="column"><i class="minus square icon"
|
|
data-search-terms="collapse, delete, hide, minify, negative, remove, shape, trash"></i>minus
|
|
square</div>
|
|
<div class="column"><i class="minus square outline icon"
|
|
data-search-terms="collapse, delete, hide, minify, negative, remove, shape, trash"></i>minus
|
|
square outline</div>
|
|
<div class="column"><i class="paste icon" data-search-terms="clipboard, copy, document, paper"></i>paste
|
|
</div>
|
|
<div class="column"><i class="pen icon" data-search-terms="design, edit, update, write"></i>pen</div>
|
|
<div class="column"><i class="pen alternate icon"
|
|
data-search-terms="design, edit, update, write"></i>pen alternate</div>
|
|
<div class="column"><i class="pen fancy icon"
|
|
data-search-terms="design, edit, fountain pen, update, write"></i>pen fancy</div>
|
|
<div class="column"><i class="pencil alternate icon"
|
|
data-search-terms="design, edit, pencil, update, write"></i>pencil alternate</div>
|
|
<div class="column"><i class="plus icon"
|
|
data-search-terms="add, create, expand, new, positive, shape"></i>plus</div>
|
|
<div class="column"><i class="plus circle icon"
|
|
data-search-terms="add, create, expand, new, positive, shape"></i>plus circle</div>
|
|
<div class="column"><i class="plus square icon"
|
|
data-search-terms="add, create, expand, new, positive, shape"></i>plus square</div>
|
|
<div class="column"><i class="plus square outline icon"
|
|
data-search-terms="add, create, expand, new, positive, shape"></i>plus square outline</div>
|
|
<div class="column"><i class="poo icon" data-search-terms="crap, poop, shit, smile, turd"></i>poo</div>
|
|
<div class="column"><i class="qrcode icon"
|
|
data-search-terms="barcode, info, information, scan"></i>qrcode</div>
|
|
<div class="column"><i class="question icon"
|
|
data-search-terms="help, information, support, unknown"></i>question</div>
|
|
<div class="column"><i class="question circle icon"
|
|
data-search-terms="help, information, support, unknown"></i>question circle</div>
|
|
<div class="column"><i class="question circle outline icon"
|
|
data-search-terms="help, information, support, unknown"></i>question circle outline</div>
|
|
<div class="column"><i class="quote left icon"
|
|
data-search-terms="mention, note, phrase, text, type"></i>quote left</div>
|
|
<div class="column"><i class="quote right icon"
|
|
data-search-terms="mention, note, phrase, text, type"></i>quote right</div>
|
|
<div class="column"><i class="redo icon" data-search-terms="forward, refresh, reload, repeat"></i>redo
|
|
</div>
|
|
<div class="column"><i class="redo alternate icon"
|
|
data-search-terms="forward, refresh, reload, repeat"></i>redo alternate</div>
|
|
<div class="column"><i class="reply icon" data-search-terms="mail, message, respond"></i>reply</div>
|
|
<div class="column"><i class="reply all icon" data-search-terms="mail, message, respond"></i>reply all
|
|
</div>
|
|
<div class="column"><i class="rss icon" data-search-terms="blog, feed, journal, news, writing"></i>rss
|
|
</div>
|
|
<div class="column"><i class="rss square icon"
|
|
data-search-terms="blog, feed, journal, news, writing"></i>rss square</div>
|
|
<div class="column"><i class="save icon" data-search-terms="disk, download, floppy, floppy-o"></i>save
|
|
</div>
|
|
<div class="column"><i class="save outline icon"
|
|
data-search-terms="disk, download, floppy, floppy-o"></i>save outline</div>
|
|
<div class="column"><i class="screwdriver icon"
|
|
data-search-terms="admin, fix, mechanic, repair, settings, tool"></i>screwdriver</div>
|
|
<div class="column"><i class="search icon"
|
|
data-search-terms="bigger, enlarge, find, magnify, preview, zoom"></i>search</div>
|
|
<div class="column"><i class="search minus icon"
|
|
data-search-terms="minify, negative, smaller, zoom, zoom out"></i>search minus</div>
|
|
<div class="column"><i class="search plus icon"
|
|
data-search-terms="bigger, enlarge, magnify, positive, zoom, zoom in"></i>search plus</div>
|
|
<div class="column"><i class="share icon" data-search-terms="forward, save, send, social"></i>share
|
|
</div>
|
|
<div class="column"><i class="share alternate icon"
|
|
data-search-terms="forward, save, send, social"></i>share alternate</div>
|
|
<div class="column"><i class="share alternate square icon"
|
|
data-search-terms="forward, save, send, social"></i>share alternate square</div>
|
|
<div class="column"><i class="share square icon"
|
|
data-search-terms="forward, save, send, social"></i>share square</div>
|
|
<div class="column"><i class="share square outline icon"
|
|
data-search-terms="forward, save, send, social"></i>share square outline</div>
|
|
<div class="column"><i class="shield alternate icon"
|
|
data-search-terms="achievement, award, block, defend, security, winner"></i>shield alternate
|
|
</div>
|
|
<div class="column"><i class="sign in alternate icon"
|
|
data-search-terms="arrow, enter, join, log in, login, sign in, sign up, sign-in, signin, signup"></i>sign
|
|
in alternate</div>
|
|
<div class="column"><i class="sign out alternate icon"
|
|
data-search-terms="arrow, exit, leave, log out, logout, sign-out"></i>sign out alternate</div>
|
|
<div class="column"><i class="signal icon"
|
|
data-search-terms="bars, graph, online, reception, status"></i>signal</div>
|
|
<div class="column"><i class="sitemap icon"
|
|
data-search-terms="directory, hierarchy, ia, information architecture, organization"></i>sitemap
|
|
</div>
|
|
<div class="column"><i class="sliders horizontal icon"
|
|
data-search-terms="adjust, settings, sliders, toggle"></i>sliders horizontal</div>
|
|
<div class="column"><i class="smile icon"
|
|
data-search-terms="approve, emoticon, face, happy, rating, satisfied"></i>smile</div>
|
|
<div class="column"><i class="smile outline icon"
|
|
data-search-terms="approve, emoticon, face, happy, rating, satisfied"></i>smile outline</div>
|
|
<div class="column"><i class="sort icon" data-search-terms="filter, order"></i>sort</div>
|
|
<div class="column"><i class="sort alphabet down icon"
|
|
data-search-terms="alphabetical, arrange, filter, order, sort-alpha-asc"></i>sort alphabet down
|
|
</div>
|
|
<div class="column"><i class="sort alphabet down alternate icon"
|
|
data-search-terms="alphabetical, arrange, filter, order, sort-alpha-asc"></i>sort alphabet down
|
|
alternate</div>
|
|
<div class="column"><i class="sort alphabet up icon"
|
|
data-search-terms="alphabetical, arrange, filter, order, sort-alpha-desc"></i>sort alphabet up
|
|
</div>
|
|
<div class="column"><i class="sort alphabet up alternate icon"
|
|
data-search-terms="alphabetical, arrange, filter, order, sort-alpha-desc"></i>sort alphabet up
|
|
alternate</div>
|
|
<div class="column"><i class="sort amount down icon"
|
|
data-search-terms="arrange, filter, number, order, sort-amount-asc"></i>sort amount down</div>
|
|
<div class="column"><i class="sort amount down alternate icon"
|
|
data-search-terms="arrange, filter, order, sort-amount-asc"></i>sort amount down alternate</div>
|
|
<div class="column"><i class="sort amount up icon"
|
|
data-search-terms="arrange, filter, order, sort-amount-desc"></i>sort amount up</div>
|
|
<div class="column"><i class="sort amount up alternate icon"
|
|
data-search-terms="arrange, filter, order, sort-amount-desc"></i>sort amount up alternate</div>
|
|
<div class="column"><i class="sort down icon"
|
|
data-search-terms="arrow, descending, filter, order, sort-desc"></i>sort down</div>
|
|
<div class="column"><i class="sort numeric down icon"
|
|
data-search-terms="arrange, filter, numbers, order, sort-numeric-asc"></i>sort numeric down
|
|
</div>
|
|
<div class="column"><i class="sort numeric down alternate icon"
|
|
data-search-terms="arrange, filter, numbers, order, sort-numeric-asc"></i>sort numeric down
|
|
alternate</div>
|
|
<div class="column"><i class="sort numeric up icon"
|
|
data-search-terms="arrange, filter, numbers, order, sort-numeric-desc"></i>sort numeric up</div>
|
|
<div class="column"><i class="sort numeric up alternate icon"
|
|
data-search-terms="arrange, filter, numbers, order, sort-numeric-desc"></i>sort numeric up
|
|
alternate</div>
|
|
<div class="column"><i class="sort up icon"
|
|
data-search-terms="arrow, ascending, filter, order, sort-asc"></i>sort up</div>
|
|
<div class="column"><i class="star icon"
|
|
data-search-terms="achievement, award, favorite, important, night, rating, score"></i>star</div>
|
|
<div class="column"><i class="star half icon"
|
|
data-search-terms="achievement, award, rating, score, star-half-empty, star-half-full"></i>star
|
|
half</div>
|
|
<div class="column"><i class="star half outline icon"
|
|
data-search-terms="achievement, award, rating, score, star-half-empty, star-half-full"></i>star
|
|
half outline</div>
|
|
<div class="column"><i class="star outline icon"
|
|
data-search-terms="achievement, award, favorite, important, night, rating, score"></i>star
|
|
outline</div>
|
|
<div class="column"><i class="sync icon"
|
|
data-search-terms="exchange, refresh, reload, rotate, swap"></i>sync</div>
|
|
<div class="column"><i class="sync alternate icon"
|
|
data-search-terms="exchange, refresh, reload, rotate, swap"></i>sync alternate</div>
|
|
<div class="column"><i class="thumbs down icon"
|
|
data-search-terms="disagree, disapprove, dislike, hand, social, thumbs-o-down"></i>thumbs down
|
|
</div>
|
|
<div class="column"><i class="thumbs down outline icon"
|
|
data-search-terms="disagree, disapprove, dislike, hand, social, thumbs-o-down"></i>thumbs down
|
|
outline</div>
|
|
<div class="column"><i class="thumbs up icon"
|
|
data-search-terms="agree, approve, favorite, hand, like, ok, okay, social, success, thumbs-o-up, yes, you got it dude"></i>thumbs
|
|
up</div>
|
|
<div class="column"><i class="thumbs up outline icon"
|
|
data-search-terms="agree, approve, favorite, hand, like, ok, okay, social, success, thumbs-o-up, yes, you got it dude"></i>thumbs
|
|
up outline</div>
|
|
<div class="column"><i class="times icon"
|
|
data-search-terms="close, cross, error, exit, incorrect, notice, notification, notify, problem, wrong, x"></i>times
|
|
</div>
|
|
<div class="column"><i class="times circle icon"
|
|
data-search-terms="close, cross, exit, incorrect, notice, notification, notify, problem, wrong, x"></i>times
|
|
circle</div>
|
|
<div class="column"><i class="times circle outline icon"
|
|
data-search-terms="close, cross, exit, incorrect, notice, notification, notify, problem, wrong, x"></i>times
|
|
circle outline</div>
|
|
<div class="column"><i class="toggle off icon" data-search-terms="switch"></i>toggle off</div>
|
|
<div class="column"><i class="toggle on icon" data-search-terms="switch"></i>toggle on</div>
|
|
<div class="column"><i class="tools icon"
|
|
data-search-terms="admin, fix, repair, screwdriver, settings, tools, wrench"></i>tools</div>
|
|
<div class="column"><i class="trash icon" data-search-terms="delete, garbage, hide, remove"></i>trash
|
|
</div>
|
|
<div class="column"><i class="trash alternate icon"
|
|
data-search-terms="delete, garbage, hide, remove, trash-o"></i>trash alternate</div>
|
|
<div class="column"><i class="trash alternate outline icon"
|
|
data-search-terms="delete, garbage, hide, remove, trash-o"></i>trash alternate outline</div>
|
|
<div class="column"><i class="trash restore icon"
|
|
data-search-terms="back, control z, oops, undo"></i>trash restore</div>
|
|
<div class="column"><i class="trash restore alternate icon"
|
|
data-search-terms="back, control z, oops, undo"></i>trash restore alternate</div>
|
|
<div class="column"><i class="trophy icon"
|
|
data-search-terms="achievement, award, cup, game, winner"></i>trophy</div>
|
|
<div class="column"><i class="undo icon"
|
|
data-search-terms="back, control z, exchange, oops, return, rotate, swap"></i>undo</div>
|
|
<div class="column"><i class="undo alternate icon"
|
|
data-search-terms="back, control z, exchange, oops, return, swap"></i>undo alternate</div>
|
|
<div class="column"><i class="upload icon" data-search-terms="hard drive, import, publish"></i>upload
|
|
</div>
|
|
<div class="column"><i class="user icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user</div>
|
|
<div class="column"><i class="user alternate icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user alternate</div>
|
|
<div class="column"><i class="user circle icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user circle</div>
|
|
<div class="column"><i class="user circle outline icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user circle outline
|
|
</div>
|
|
<div class="column"><i class="user outline icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user outline</div>
|
|
<div class="column"><i class="volume down icon"
|
|
data-search-terms="audio, lower, music, quieter, sound, speaker"></i>volume down</div>
|
|
<div class="column"><i class="volume mute icon"
|
|
data-search-terms="audio, music, quiet, sound, speaker"></i>volume mute</div>
|
|
<div class="column"><i class="volume off icon"
|
|
data-search-terms="audio, ban, music, mute, quiet, silent, sound"></i>volume off</div>
|
|
<div class="column"><i class="volume up icon"
|
|
data-search-terms="audio, higher, louder, music, sound, speaker"></i>volume up</div>
|
|
<div class="column"><i class="wifi icon"
|
|
data-search-terms="connection, hotspot, internet, network, wireless"></i>wifi</div>
|
|
<div class="column"><i class="wrench icon"
|
|
data-search-terms="construction, fix, mechanic, plumbing, settings, spanner, tool, update"></i>wrench
|
|
</div>
|
|
</div>
|
|
<div class="existing code">
|
|
<i class="award icon"></i>
|
|
<i class="ban icon"></i>
|
|
<i class="barcode icon"></i>
|
|
<i class="bars icon"></i>
|
|
<i class="beer icon"></i>
|
|
<i class="bell icon"></i>
|
|
<i class="bell outline icon"></i>
|
|
<i class="bell slash icon"></i>
|
|
<i class="bell slash outline icon"></i>
|
|
<i class="blog icon"></i>
|
|
<i class="bug icon"></i>
|
|
<i class="bullhorn icon"></i>
|
|
<i class="bullseye icon"></i>
|
|
<i class="calculator icon"></i>
|
|
<i class="calendar icon"></i>
|
|
<i class="calendar alternate icon"></i>
|
|
<i class="calendar alternate outline icon"></i>
|
|
<i class="calendar check icon"></i>
|
|
<i class="calendar check outline icon"></i>
|
|
<i class="calendar minus icon"></i>
|
|
<i class="calendar minus outline icon"></i>
|
|
<i class="calendar outline icon"></i>
|
|
<i class="calendar plus icon"></i>
|
|
<i class="calendar plus outline icon"></i>
|
|
<i class="calendar times icon"></i>
|
|
<i class="calendar times outline icon"></i>
|
|
<i class="certificate icon"></i>
|
|
<i class="check icon"></i>
|
|
<i class="check circle icon"></i>
|
|
<i class="check circle outline icon"></i>
|
|
<i class="check double icon"></i>
|
|
<i class="check square icon"></i>
|
|
<i class="check square outline icon"></i>
|
|
<i class="circle icon"></i>
|
|
<i class="circle outline icon"></i>
|
|
<i class="clipboard icon"></i>
|
|
<i class="clipboard outline icon"></i>
|
|
<i class="clone icon"></i>
|
|
<i class="clone outline icon"></i>
|
|
<i class="cloud icon"></i>
|
|
<i class="cloud download alternate icon"></i>
|
|
<i class="cloud upload alternate icon"></i>
|
|
<i class="coffee icon"></i>
|
|
<i class="cog icon"></i>
|
|
<i class="cogs icon"></i>
|
|
<i class="copy icon"></i>
|
|
<i class="copy outline icon"></i>
|
|
<i class="cut icon"></i>
|
|
<i class="database icon"></i>
|
|
<i class="dot circle icon"></i>
|
|
<i class="dot circle outline icon"></i>
|
|
<i class="download icon"></i>
|
|
<i class="edit icon"></i>
|
|
<i class="edit outline icon"></i>
|
|
<i class="ellipsis horizontal icon"></i>
|
|
<i class="ellipsis vertical icon"></i>
|
|
<i class="envelope icon"></i>
|
|
<i class="envelope open icon"></i>
|
|
<i class="envelope open outline icon"></i>
|
|
<i class="envelope outline icon"></i>
|
|
<i class="eraser icon"></i>
|
|
<i class="exclamation icon"></i>
|
|
<i class="exclamation circle icon"></i>
|
|
<i class="exclamation triangle icon"></i>
|
|
<i class="external alternate icon"></i>
|
|
<i class="external link square alternate icon"></i>
|
|
<i class="eye icon"></i>
|
|
<i class="eye outline icon"></i>
|
|
<i class="eye slash icon"></i>
|
|
<i class="eye slash outline icon"></i>
|
|
<i class="file icon"></i>
|
|
<i class="file alternate icon"></i>
|
|
<i class="file alternate outline icon"></i>
|
|
<i class="file download icon"></i>
|
|
<i class="file export icon"></i>
|
|
<i class="file import icon"></i>
|
|
<i class="file outline icon"></i>
|
|
<i class="file upload icon"></i>
|
|
<i class="filter icon"></i>
|
|
<i class="fingerprint icon"></i>
|
|
<i class="flag icon"></i>
|
|
<i class="flag checkered icon"></i>
|
|
<i class="flag outline icon"></i>
|
|
<i class="folder icon"></i>
|
|
<i class="folder open icon"></i>
|
|
<i class="folder open outline icon"></i>
|
|
<i class="folder outline icon"></i>
|
|
<i class="frown icon"></i>
|
|
<i class="frown outline icon"></i>
|
|
<i class="glasses icon"></i>
|
|
<i class="grip horizontal icon"></i>
|
|
<i class="grip lines icon"></i>
|
|
<i class="grip lines vertical icon"></i>
|
|
<i class="grip vertical icon"></i>
|
|
<i class="hashtag icon"></i>
|
|
<i class="heart icon"></i>
|
|
<i class="heart outline icon"></i>
|
|
<i class="history icon"></i>
|
|
<i class="home icon"></i>
|
|
<i class="i cursor icon"></i>
|
|
<i class="info icon"></i>
|
|
<i class="info circle icon"></i>
|
|
<i class="language icon"></i>
|
|
<i class="magic icon"></i>
|
|
<i class="marker icon"></i>
|
|
<i class="medal icon"></i>
|
|
<i class="meh icon"></i>
|
|
<i class="meh outline icon"></i>
|
|
<i class="microphone icon"></i>
|
|
<i class="microphone alternate icon"></i>
|
|
<i class="microphone slash icon"></i>
|
|
<i class="minus icon"></i>
|
|
<i class="minus circle icon"></i>
|
|
<i class="minus square icon"></i>
|
|
<i class="minus square outline icon"></i>
|
|
<i class="paste icon"></i>
|
|
<i class="pen icon"></i>
|
|
<i class="pen alternate icon"></i>
|
|
<i class="pen fancy icon"></i>
|
|
<i class="pencil alternate icon"></i>
|
|
<i class="plus icon"></i>
|
|
<i class="plus circle icon"></i>
|
|
<i class="plus square icon"></i>
|
|
<i class="plus square outline icon"></i>
|
|
<i class="poo icon"></i>
|
|
<i class="qrcode icon"></i>
|
|
<i class="question icon"></i>
|
|
<i class="question circle icon"></i>
|
|
<i class="question circle outline icon"></i>
|
|
<i class="quote left icon"></i>
|
|
<i class="quote right icon"></i>
|
|
<i class="redo icon"></i>
|
|
<i class="redo alternate icon"></i>
|
|
<i class="reply icon"></i>
|
|
<i class="reply all icon"></i>
|
|
<i class="rss icon"></i>
|
|
<i class="rss square icon"></i>
|
|
<i class="save icon"></i>
|
|
<i class="save outline icon"></i>
|
|
<i class="screwdriver icon"></i>
|
|
<i class="search icon"></i>
|
|
<i class="search minus icon"></i>
|
|
<i class="search plus icon"></i>
|
|
<i class="share icon"></i>
|
|
<i class="share alternate icon"></i>
|
|
<i class="share alternate square icon"></i>
|
|
<i class="share square icon"></i>
|
|
<i class="share square outline icon"></i>
|
|
<i class="shield alternate icon"></i>
|
|
<i class="sign in alternate icon"></i>
|
|
<i class="sign out alternate icon"></i>
|
|
<i class="signal icon"></i>
|
|
<i class="sitemap icon"></i>
|
|
<i class="sliders horizontal icon"></i>
|
|
<i class="smile icon"></i>
|
|
<i class="smile outline icon"></i>
|
|
<i class="sort icon"></i>
|
|
<i class="sort alphabet down icon"></i>
|
|
<i class="sort alphabet down alternate icon"></i>
|
|
<i class="sort alphabet up icon"></i>
|
|
<i class="sort alphabet up alternate icon"></i>
|
|
<i class="sort amount down icon"></i>
|
|
<i class="sort amount down alternate icon"></i>
|
|
<i class="sort amount up icon"></i>
|
|
<i class="sort amount up alternate icon"></i>
|
|
<i class="sort down icon"></i>
|
|
<i class="sort numeric down icon"></i>
|
|
<i class="sort numeric down alternate icon"></i>
|
|
<i class="sort numeric up icon"></i>
|
|
<i class="sort numeric up alternate icon"></i>
|
|
<i class="sort up icon"></i>
|
|
<i class="star icon"></i>
|
|
<i class="star half icon"></i>
|
|
<i class="star half outline icon"></i>
|
|
<i class="star outline icon"></i>
|
|
<i class="sync icon"></i>
|
|
<i class="sync alternate icon"></i>
|
|
<i class="thumbs down icon"></i>
|
|
<i class="thumbs down outline icon"></i>
|
|
<i class="thumbs up icon"></i>
|
|
<i class="thumbs up outline icon"></i>
|
|
<i class="times icon"></i>
|
|
<i class="times circle icon"></i>
|
|
<i class="times circle outline icon"></i>
|
|
<i class="toggle off icon"></i>
|
|
<i class="toggle on icon"></i>
|
|
<i class="tools icon"></i>
|
|
<i class="trash icon"></i>
|
|
<i class="trash alternate icon"></i>
|
|
<i class="trash alternate outline icon"></i>
|
|
<i class="trash restore icon"></i>
|
|
<i class="trash restore alternate icon"></i>
|
|
<i class="trophy icon"></i>
|
|
<i class="undo icon"></i>
|
|
<i class="undo alternate icon"></i>
|
|
<i class="upload icon"></i>
|
|
<i class="user icon"></i>
|
|
<i class="user alternate icon"></i>
|
|
<i class="user circle icon"></i>
|
|
<i class="user circle outline icon"></i>
|
|
<i class="user outline icon"></i>
|
|
<i class="volume down icon"></i>
|
|
<i class="volume mute icon"></i>
|
|
<i class="volume off icon"></i>
|
|
<i class="volume up icon"></i>
|
|
<i class="wifi icon"></i>
|
|
<i class="wrench icon"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Logistics</h4>
|
|
<p>Icons can represent common logistic activity</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="box icon" data-search-terms="archive, container, package, storage"></i>box
|
|
</div>
|
|
<div class="column"><i class="boxes icon"
|
|
data-search-terms="archives, inventory, storage, warehouse"></i>boxes</div>
|
|
<div class="column"><i class="clipboard check icon"
|
|
data-search-terms="accept, agree, confirm, done, ok, select, success, tick, todo, yes"></i>clipboard
|
|
check</div>
|
|
<div class="column"><i class="clipboard list icon"
|
|
data-search-terms="checklist, completed, done, finished, intinerary, ol, schedule, tick, todo, ul"></i>clipboard
|
|
list</div>
|
|
<div class="column"><i class="dolly icon" data-search-terms="carry, shipping, transport"></i>dolly</div>
|
|
<div class="column"><i class="dolly flatbed icon"
|
|
data-search-terms="carry, inventory, shipping, transport"></i>dolly flatbed</div>
|
|
<div class="column"><i class="hard hat icon"
|
|
data-search-terms="construction, hardhat, helmet, safety"></i>hard hat</div>
|
|
<div class="column"><i class="pallet icon"
|
|
data-search-terms="archive, box, inventory, shipping, warehouse"></i>pallet</div>
|
|
<div class="column"><i class="shipping fast icon"
|
|
data-search-terms="express, fedex, mail, overnight, package, ups"></i>shipping fast</div>
|
|
<div class="column"><i class="truck icon"
|
|
data-search-terms="cargo, delivery, shipping, vehicle"></i>truck</div>
|
|
<div class="column"><i class="warehouse icon"
|
|
data-search-terms="building, capacity, garage, inventory, storage"></i>warehouse</div>
|
|
</div>
|
|
<div class="existing code">
|
|
<i class="box icon"></i>
|
|
<i class="boxes icon"></i>
|
|
<i class="clipboard check icon"></i>
|
|
<i class="clipboard list icon"></i>
|
|
<i class="dolly icon"></i>
|
|
<i class="dolly flatbed icon"></i>
|
|
<i class="hard hat icon"></i>
|
|
<i class="pallet icon"></i>
|
|
<i class="shipping fast icon"></i>
|
|
<i class="truck icon"></i>
|
|
<i class="warehouse icon"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Maps</h4>
|
|
<p>Icons can be used to represent elements on a map</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="ambulance icon"
|
|
data-search-terms="covid-19, emergency, emt, er, help, hospital, support, vehicle"></i>ambulance
|
|
</div>
|
|
<div class="column"><i class="anchor icon"
|
|
data-search-terms="berth, boat, dock, embed, link, maritime, moor, secure"></i>anchor</div>
|
|
<div class="column"><i class="balance scale icon"
|
|
data-search-terms="balanced, justice, legal, measure, weight"></i>balance scale</div>
|
|
<div class="column"><i class="balance scale left icon"
|
|
data-search-terms="justice, legal, measure, unbalanced, weight"></i>balance scale left</div>
|
|
<div class="column"><i class="balance scale right icon"
|
|
data-search-terms="justice, legal, measure, unbalanced, weight"></i>balance scale right</div>
|
|
<div class="column"><i class="bath icon" data-search-terms="clean, shower, tub, wash"></i>bath</div>
|
|
<div class="column"><i class="bed icon"
|
|
data-search-terms="lodging, mattress, rest, sleep, travel"></i>bed</div>
|
|
<div class="column"><i class="beer icon"
|
|
data-search-terms="alcohol, ale, bar, beverage, brewery, drink, lager, liquor, mug, stein"></i>beer
|
|
</div>
|
|
<div class="column"><i class="bell icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell</div>
|
|
<div class="column"><i class="bell outline icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell outline</div>
|
|
<div class="column"><i class="bell slash icon"
|
|
data-search-terms="alert, cancel, disabled, notification, off, reminder"></i>bell slash</div>
|
|
<div class="column"><i class="bell slash outline icon"
|
|
data-search-terms="alert, cancel, disabled, notification, off, reminder"></i>bell slash outline
|
|
</div>
|
|
<div class="column"><i class="bicycle icon"
|
|
data-search-terms="bike, gears, pedal, transportation, vehicle"></i>bicycle</div>
|
|
<div class="column"><i class="binoculars icon"
|
|
data-search-terms="glasses, magnify, scenic, spyglass, view"></i>binoculars</div>
|
|
<div class="column"><i class="birthday cake icon"
|
|
data-search-terms="anniversary, bakery, candles, celebration, dessert, frosting, holiday, party, pastry"></i>birthday
|
|
cake</div>
|
|
<div class="column"><i class="blind icon" data-search-terms="cane, disability, person, sight"></i>blind
|
|
</div>
|
|
<div class="column"><i class="bomb icon"
|
|
data-search-terms="error, explode, fuse, grenade, warning"></i>bomb</div>
|
|
<div class="column"><i class="book icon"
|
|
data-search-terms="diary, documentation, journal, library, read"></i>book</div>
|
|
<div class="column"><i class="bookmark icon"
|
|
data-search-terms="favorite, marker, read, remember, save"></i>bookmark</div>
|
|
<div class="column"><i class="bookmark outline icon"
|
|
data-search-terms="favorite, marker, read, remember, save"></i>bookmark outline</div>
|
|
<div class="column"><i class="briefcase icon"
|
|
data-search-terms="bag, business, luggage, office, work"></i>briefcase</div>
|
|
<div class="column"><i class="building icon"
|
|
data-search-terms="apartment, business, city, company, office, work"></i>building</div>
|
|
<div class="column"><i class="building outline icon"
|
|
data-search-terms="apartment, business, city, company, office, work"></i>building outline</div>
|
|
<div class="column"><i class="car icon"
|
|
data-search-terms="auto, automobile, sedan, transportation, travel, vehicle"></i>car</div>
|
|
<div class="column"><i class="coffee icon"
|
|
data-search-terms="beverage, breakfast, cafe, drink, fall, morning, mug, seasonal, tea"></i>coffee
|
|
</div>
|
|
<div class="column"><i class="crosshairs icon"
|
|
data-search-terms="aim, bullseye, gpd, picker, position"></i>crosshairs</div>
|
|
<div class="column"><i class="directions icon"
|
|
data-search-terms="map, navigation, sign, turn"></i>directions</div>
|
|
<div class="column"><i class="dollar sign icon"
|
|
data-search-terms="$, cost, dollar-sign, money, price, usd"></i>dollar sign</div>
|
|
<div class="column"><i class="draw polygon icon"
|
|
data-search-terms="anchors, lines, object, render, shape"></i>draw polygon</div>
|
|
<div class="column"><i class="eye icon"
|
|
data-search-terms="look, optic, see, seen, show, sight, views, visible"></i>eye</div>
|
|
<div class="column"><i class="eye outline icon"
|
|
data-search-terms="look, optic, see, seen, show, sight, views, visible"></i>eye outline</div>
|
|
<div class="column"><i class="eye slash icon"
|
|
data-search-terms="blind, hide, show, toggle, unseen, views, visible, visiblity"></i>eye slash
|
|
</div>
|
|
<div class="column"><i class="eye slash outline icon"
|
|
data-search-terms="blind, hide, show, toggle, unseen, views, visible, visiblity"></i>eye slash
|
|
outline</div>
|
|
<div class="column"><i class="fighter jet icon"
|
|
data-search-terms="airplane, fast, fly, goose, maverick, plane, quick, top gun, transportation, travel"></i>fighter
|
|
jet</div>
|
|
<div class="column"><i class="fire icon"
|
|
data-search-terms="burn, caliente, flame, heat, hot, popular"></i>fire</div>
|
|
<div class="column"><i class="fire alternate icon"
|
|
data-search-terms="burn, caliente, flame, heat, hot, popular"></i>fire alternate</div>
|
|
<div class="column"><i class="fire extinguisher icon"
|
|
data-search-terms="burn, caliente, fire fighter, flame, heat, hot, rescue"></i>fire extinguisher
|
|
</div>
|
|
<div class="column"><i class="flag icon"
|
|
data-search-terms="country, notice, notification, notify, pole, report, symbol"></i>flag</div>
|
|
<div class="column"><i class="flag checkered icon"
|
|
data-search-terms="notice, notification, notify, pole, racing, report, symbol"></i>flag
|
|
checkered</div>
|
|
<div class="column"><i class="flag outline icon"
|
|
data-search-terms="country, notice, notification, notify, pole, report, symbol"></i>flag outline
|
|
</div>
|
|
<div class="column"><i class="flask icon"
|
|
data-search-terms="beaker, experimental, labs, science"></i>flask</div>
|
|
<div class="column"><i class="gamepad icon"
|
|
data-search-terms="arcade, controller, d-pad, joystick, video, video game"></i>gamepad</div>
|
|
<div class="column"><i class="gavel icon"
|
|
data-search-terms="hammer, judge, law, lawyer, opinion"></i>gavel</div>
|
|
<div class="column"><i class="gift icon"
|
|
data-search-terms="christmas, generosity, giving, holiday, party, present, wrapped, xmas"></i>gift
|
|
</div>
|
|
<div class="column"><i class="glass martini icon"
|
|
data-search-terms="alcohol, bar, beverage, drink, liquor"></i>glass martini</div>
|
|
<div class="column"><i class="globe icon"
|
|
data-search-terms="all, coordinates, country, earth, global, gps, language, localize, location, map, online, place, planet, translate, travel, world"></i>globe
|
|
</div>
|
|
<div class="column"><i class="graduation cap icon"
|
|
data-search-terms="ceremony, college, graduate, learning, school, student"></i>graduation cap
|
|
</div>
|
|
<div class="column"><i class="h square icon"
|
|
data-search-terms="directions, emergency, hospital, hotel, map"></i>h square</div>
|
|
<div class="column"><i class="heart icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart</div>
|
|
<div class="column"><i class="heart outline icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart outline</div>
|
|
<div class="column"><i class="heartbeat icon"
|
|
data-search-terms="ekg, electrocardiogram, health, lifeline, vital signs"></i>heartbeat</div>
|
|
<div class="column"><i class="helicopter icon"
|
|
data-search-terms="airwolf, apache, chopper, flight, fly, travel"></i>helicopter</div>
|
|
<div class="column"><i class="home icon" data-search-terms="abode, building, house, main"></i>home</div>
|
|
<div class="column"><i class="hospital icon"
|
|
data-search-terms="building, covid-19, emergency room, medical center"></i>hospital</div>
|
|
<div class="column"><i class="hospital outline icon"
|
|
data-search-terms="building, covid-19, emergency room, medical center"></i>hospital outline
|
|
</div>
|
|
<div class="column"><i class="image icon" data-search-terms="album, landscape, photo, picture"></i>image
|
|
</div>
|
|
<div class="column"><i class="image outline icon"
|
|
data-search-terms="album, landscape, photo, picture"></i>image outline</div>
|
|
<div class="column"><i class="images icon"
|
|
data-search-terms="album, landscape, photo, picture"></i>images</div>
|
|
<div class="column"><i class="images outline icon"
|
|
data-search-terms="album, landscape, photo, picture"></i>images outline</div>
|
|
<div class="column"><i class="industry icon"
|
|
data-search-terms="building, factory, industrial, manufacturing, mill, warehouse"></i>industry
|
|
</div>
|
|
<div class="column"><i class="info icon"
|
|
data-search-terms="details, help, information, more, support"></i>info</div>
|
|
<div class="column"><i class="info circle icon"
|
|
data-search-terms="details, help, information, more, support"></i>info circle</div>
|
|
<div class="column"><i class="key icon"
|
|
data-search-terms="lock, password, private, secret, unlock"></i>key</div>
|
|
<div class="column"><i class="landmark icon"
|
|
data-search-terms="building, historic, memorable, monument, politics"></i>landmark</div>
|
|
<div class="column"><i class="layer group icon"
|
|
data-search-terms="arrange, develop, layers, map, stack"></i>layer group</div>
|
|
<div class="column"><i class="leaf icon" data-search-terms="eco, flora, nature, plant, vegan"></i>leaf
|
|
</div>
|
|
<div class="column"><i class="lemon icon" data-search-terms="citrus, lemonade, lime, tart"></i>lemon
|
|
</div>
|
|
<div class="column"><i class="lemon outline icon"
|
|
data-search-terms="citrus, lemonade, lime, tart"></i>lemon outline</div>
|
|
<div class="column"><i class="life ring icon"
|
|
data-search-terms="coast guard, help, overboard, save, support"></i>life ring</div>
|
|
<div class="column"><i class="life ring outline icon"
|
|
data-search-terms="coast guard, help, overboard, save, support"></i>life ring outline</div>
|
|
<div class="column"><i class="lightbulb icon"
|
|
data-search-terms="energy, idea, inspiration, light"></i>lightbulb</div>
|
|
<div class="column"><i class="lightbulb outline icon"
|
|
data-search-terms="energy, idea, inspiration, light"></i>lightbulb outline</div>
|
|
<div class="column"><i class="location arrow icon"
|
|
data-search-terms="address, compass, coordinate, direction, gps, map, navigation, place"></i>location
|
|
arrow</div>
|
|
<div class="column"><i class="low vision icon" data-search-terms="blind, eye, sight"></i>low vision
|
|
</div>
|
|
<div class="column"><i class="magnet icon" data-search-terms="Attract, lodestone, tool"></i>magnet</div>
|
|
<div class="column"><i class="male icon" data-search-terms="human, man, person, profile, user"></i>male
|
|
</div>
|
|
<div class="column"><i class="map icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
</div>
|
|
<div class="column"><i class="map marker icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
marker</div>
|
|
<div class="column"><i class="map marker alternate icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
marker alternate</div>
|
|
<div class="column"><i class="map outline icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
outline</div>
|
|
<div class="column"><i class="map pin icon"
|
|
data-search-terms="address, agree, coordinates, destination, gps, localize, location, map, marker, navigation, pin, place, position, travel"></i>map
|
|
pin</div>
|
|
<div class="column"><i class="map signs icon"
|
|
data-search-terms="directions, directory, map, signage, wayfinding"></i>map signs</div>
|
|
<div class="column"><i class="medkit icon"
|
|
data-search-terms="first aid, firstaid, health, help, support"></i>medkit</div>
|
|
<div class="column"><i class="money bill icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill</div>
|
|
<div class="column"><i class="money bill alternate icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill
|
|
alternate</div>
|
|
<div class="column"><i class="money bill alternate outline icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill
|
|
alternate outline</div>
|
|
<div class="column"><i class="motorcycle icon"
|
|
data-search-terms="bike, machine, transportation, vehicle"></i>motorcycle</div>
|
|
<div class="column"><i class="music icon"
|
|
data-search-terms="lyrics, melody, note, sing, sound"></i>music</div>
|
|
<div class="column"><i class="newspaper icon"
|
|
data-search-terms="article, editorial, headline, journal, journalism, news, press"></i>newspaper
|
|
</div>
|
|
<div class="column"><i class="newspaper outline icon"
|
|
data-search-terms="article, editorial, headline, journal, journalism, news, press"></i>newspaper
|
|
outline</div>
|
|
<div class="column"><i class="parking icon" data-search-terms="auto, car, garage, meter"></i>parking
|
|
</div>
|
|
<div class="column"><i class="paw icon" data-search-terms="animal, cat, dog, pet, print"></i>paw</div>
|
|
<div class="column"><i class="phone icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone</div>
|
|
<div class="column"><i class="phone alternate icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone alternate</div>
|
|
<div class="column"><i class="phone square icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone square</div>
|
|
<div class="column"><i class="phone square alternate icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone square alternate
|
|
</div>
|
|
<div class="column"><i class="phone volume icon"
|
|
data-search-terms="call, earphone, number, sound, support, telephone, voice, volume-control-phone"></i>phone
|
|
volume</div>
|
|
<div class="column"><i class="plane icon"
|
|
data-search-terms="airplane, destination, fly, location, mode, travel, trip"></i>plane</div>
|
|
<div class="column"><i class="plug icon" data-search-terms="connect, electric, online, power"></i>plug
|
|
</div>
|
|
<div class="column"><i class="plus icon"
|
|
data-search-terms="add, create, expand, new, positive, shape"></i>plus</div>
|
|
<div class="column"><i class="plus square icon"
|
|
data-search-terms="add, create, expand, new, positive, shape"></i>plus square</div>
|
|
<div class="column"><i class="plus square outline icon"
|
|
data-search-terms="add, create, expand, new, positive, shape"></i>plus square outline</div>
|
|
<div class="column"><i class="print icon"
|
|
data-search-terms="business, copy, document, office, paper"></i>print</div>
|
|
<div class="column"><i class="recycle icon"
|
|
data-search-terms="Waste, compost, garbage, reuse, trash"></i>recycle</div>
|
|
<div class="column"><i class="restroom icon"
|
|
data-search-terms="bathroom, john, loo, potty, washroom, waste, wc"></i>restroom</div>
|
|
<div class="column"><i class="road icon"
|
|
data-search-terms="highway, map, pavement, route, street, travel"></i>road</div>
|
|
<div class="column"><i class="rocket icon"
|
|
data-search-terms="aircraft, app, jet, launch, nasa, space"></i>rocket</div>
|
|
<div class="column"><i class="route icon" data-search-terms="directions, navigation, travel"></i>route
|
|
</div>
|
|
<div class="column"><i class="search icon"
|
|
data-search-terms="bigger, enlarge, find, magnify, preview, zoom"></i>search</div>
|
|
<div class="column"><i class="search minus icon"
|
|
data-search-terms="minify, negative, smaller, zoom, zoom out"></i>search minus</div>
|
|
<div class="column"><i class="search plus icon"
|
|
data-search-terms="bigger, enlarge, magnify, positive, zoom, zoom in"></i>search plus</div>
|
|
<div class="column"><i class="ship icon" data-search-terms="boat, sea, water"></i>ship</div>
|
|
<div class="column"><i class="shoe prints icon"
|
|
data-search-terms="feet, footprints, steps, walk"></i>shoe prints</div>
|
|
<div class="column"><i class="shopping bag icon"
|
|
data-search-terms="buy, checkout, grocery, payment, purchase"></i>shopping bag</div>
|
|
<div class="column"><i class="shopping basket icon"
|
|
data-search-terms="buy, checkout, grocery, payment, purchase"></i>shopping basket</div>
|
|
<div class="column"><i class="shopping cart icon"
|
|
data-search-terms="buy, checkout, grocery, payment, purchase"></i>shopping cart</div>
|
|
<div class="column"><i class="shower icon" data-search-terms="bath, clean, faucet, water"></i>shower
|
|
</div>
|
|
<div class="column"><i class="snowplow icon"
|
|
data-search-terms="clean up, cold, road, storm, winter"></i>snowplow</div>
|
|
<div class="column"><i class="street view icon"
|
|
data-search-terms="directions, location, map, navigation"></i>street view</div>
|
|
<div class="column"><i class="subway icon"
|
|
data-search-terms="machine, railway, train, transportation, vehicle"></i>subway</div>
|
|
<div class="column"><i class="suitcase icon"
|
|
data-search-terms="baggage, luggage, move, suitcase, travel, trip"></i>suitcase</div>
|
|
<div class="column"><i class="tag icon" data-search-terms="discount, label, price, shopping"></i>tag
|
|
</div>
|
|
<div class="column"><i class="tags icon" data-search-terms="discount, label, price, shopping"></i>tags
|
|
</div>
|
|
<div class="column"><i class="taxi icon"
|
|
data-search-terms="cab, cabbie, car, car service, lyft, machine, transportation, travel, uber, vehicle"></i>taxi
|
|
</div>
|
|
<div class="column"><i class="thumbtack icon"
|
|
data-search-terms="coordinates, location, marker, pin, thumb-tack"></i>thumbtack</div>
|
|
<div class="column"><i class="ticket alternate icon"
|
|
data-search-terms="movie, pass, support, ticket"></i>ticket alternate</div>
|
|
<div class="column"><i class="tint icon"
|
|
data-search-terms="color, drop, droplet, raindrop, waterdrop"></i>tint</div>
|
|
<div class="column"><i class="traffic light icon"
|
|
data-search-terms="direction, road, signal, travel"></i>traffic light</div>
|
|
<div class="column"><i class="train icon"
|
|
data-search-terms="bullet, commute, locomotive, railway, subway"></i>train</div>
|
|
<div class="column"><i class="tram icon"
|
|
data-search-terms="crossing, machine, mountains, seasonal, transportation"></i>tram</div>
|
|
<div class="column"><i class="tree icon"
|
|
data-search-terms="bark, fall, flora, forest, nature, plant, seasonal"></i>tree</div>
|
|
<div class="column"><i class="trophy icon"
|
|
data-search-terms="achievement, award, cup, game, winner"></i>trophy</div>
|
|
<div class="column"><i class="truck icon"
|
|
data-search-terms="cargo, delivery, shipping, vehicle"></i>truck</div>
|
|
<div class="column"><i class="tty icon"
|
|
data-search-terms="communication, deaf, telephone, teletypewriter, text"></i>tty</div>
|
|
<div class="column"><i class="umbrella icon"
|
|
data-search-terms="protection, rain, storm, wet"></i>umbrella</div>
|
|
<div class="column"><i class="university icon"
|
|
data-search-terms="bank, building, college, higher education - students, institution"></i>university
|
|
</div>
|
|
<div class="column"><i class="utensil spoon icon"
|
|
data-search-terms="cutlery, dining, scoop, silverware, spoon"></i>utensil spoon</div>
|
|
<div class="column"><i class="utensils icon"
|
|
data-search-terms="cutlery, dining, dinner, eat, food, fork, knife, restaurant"></i>utensils
|
|
</div>
|
|
<div class="column"><i class="vest icon" data-search-terms="biker, fashion, style"></i>vest</div>
|
|
<div class="column"><i class="vest patches icon" data-search-terms="biker, fashion, style"></i>vest
|
|
patches</div>
|
|
<div class="column"><i class="wheelchair icon"
|
|
data-search-terms="accessible, handicap, person"></i>wheelchair</div>
|
|
<div class="column"><i class="wifi icon"
|
|
data-search-terms="connection, hotspot, internet, network, wireless"></i>wifi</div>
|
|
<div class="column"><i class="wine glass icon"
|
|
data-search-terms="alcohol, beverage, cabernet, drink, grapes, merlot, sauvignon"></i>wine glass
|
|
</div>
|
|
<div class="column"><i class="wrench icon"
|
|
data-search-terms="construction, fix, mechanic, plumbing, settings, spanner, tool, update"></i>wrench
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Maritime</h4>
|
|
<p>Icons which represent maritime tools and activities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="anchor icon"
|
|
data-search-terms="berth, boat, dock, embed, link, maritime, moor, secure"></i>anchor</div>
|
|
<div class="column"><i class="binoculars icon"
|
|
data-search-terms="glasses, magnify, scenic, spyglass, view"></i>binoculars</div>
|
|
<div class="column"><i class="compass icon"
|
|
data-search-terms="directions, directory, location, menu, navigation, safari, travel"></i>compass
|
|
</div>
|
|
<div class="column"><i class="compass outline icon"
|
|
data-search-terms="directions, directory, location, menu, navigation, safari, travel"></i>compass
|
|
outline</div>
|
|
<div class="column"><i class="dharmachakra icon"
|
|
data-search-terms="buddhism, buddhist, wheel of dharma"></i>dharmachakra</div>
|
|
<div class="column"><i class="frog icon"
|
|
data-search-terms="amphibian, bullfrog, fauna, hop, kermit, kiss, prince, ribbit, toad, wart"></i>frog
|
|
</div>
|
|
<div class="column"><i class="ship icon" data-search-terms="boat, sea, water"></i>ship</div>
|
|
<div class="column"><i class="skull crossbones icon"
|
|
data-search-terms="Dungeons & Dragons, alert, bones, d&d, danger, dead, deadly, death, dnd, fantasy, halloween, holiday, jolly-roger, pirate, poison, skeleton, warning"></i>skull
|
|
crossbones</div>
|
|
<div class="column"><i class="swimmer icon"
|
|
data-search-terms="athlete, head, man, olympics, person, pool, water"></i>swimmer</div>
|
|
<div class="column"><i class="water icon"
|
|
data-search-terms="lake, liquid, ocean, sea, swim, wet"></i>water</div>
|
|
<div class="column"><i class="wind icon"
|
|
data-search-terms="air, blow, breeze, fall, seasonal, weather"></i>wind</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Marketing</h4>
|
|
<p>Icons can represent marketing materials and symbols</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="ad icon"
|
|
data-search-terms="advertisement, media, newspaper, promotion, publicity"></i>ad</div>
|
|
<div class="column"><i class="bullhorn icon"
|
|
data-search-terms="announcement, broadcast, louder, megaphone, share"></i>bullhorn</div>
|
|
<div class="column"><i class="bullseye icon"
|
|
data-search-terms="archery, goal, objective, target"></i>bullseye</div>
|
|
<div class="column"><i class="comment dollar icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, money, note, notification, pay, sms, speech, spend, texting, transfer"></i>comment
|
|
dollar</div>
|
|
<div class="column"><i class="comments dollar icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, money, note, notification, pay, sms, speech, spend, texting, transfer"></i>comments
|
|
dollar</div>
|
|
<div class="column"><i class="envelope open text icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
open text</div>
|
|
<div class="column"><i class="funnel dollar icon"
|
|
data-search-terms="filter, money, options, separate, sort"></i>funnel dollar</div>
|
|
<div class="column"><i class="lightbulb icon"
|
|
data-search-terms="energy, idea, inspiration, light"></i>lightbulb</div>
|
|
<div class="column"><i class="lightbulb outline icon"
|
|
data-search-terms="energy, idea, inspiration, light"></i>lightbulb outline</div>
|
|
<div class="column"><i class="mail bulk icon"
|
|
data-search-terms="archive, envelope, letter, post office, postal, postcard, send, stamp, usps"></i>mail
|
|
bulk</div>
|
|
<div class="column"><i class="poll icon"
|
|
data-search-terms="results, survey, trend, vote, voting"></i>poll</div>
|
|
<div class="column"><i class="poll horizontal icon"
|
|
data-search-terms="results, survey, trend, vote, voting"></i>poll horizontal</div>
|
|
<div class="column"><i class="search dollar icon"
|
|
data-search-terms="bigger, enlarge, find, magnify, money, preview, zoom"></i>search dollar</div>
|
|
<div class="column"><i class="search location icon"
|
|
data-search-terms="bigger, enlarge, find, magnify, preview, zoom"></i>search location</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Mathematics</h4>
|
|
<p>Icons which represent common mathematic symbols</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="calculator icon"
|
|
data-search-terms="abacus, addition, arithmetic, counting, math, multiplication, subtraction"></i>calculator
|
|
</div>
|
|
<div class="column"><i class="divide icon"
|
|
data-search-terms="arithmetic, calculus, division, math"></i>divide</div>
|
|
<div class="column"><i class="equals icon" data-search-terms="arithmetic, even, match, math"></i>equals
|
|
</div>
|
|
<div class="column"><i class="greater than icon"
|
|
data-search-terms="arithmetic, compare, math"></i>greater than</div>
|
|
<div class="column"><i class="greater than equal icon"
|
|
data-search-terms="arithmetic, compare, math"></i>greater than equal</div>
|
|
<div class="column"><i class="infinity icon" data-search-terms="eternity, forever, math"></i>infinity
|
|
</div>
|
|
<div class="column"><i class="less than icon" data-search-terms="arithmetic, compare, math"></i>less
|
|
than</div>
|
|
<div class="column"><i class="less than equal icon"
|
|
data-search-terms="arithmetic, compare, math"></i>less than equal</div>
|
|
<div class="column"><i class="minus icon"
|
|
data-search-terms="collapse, delete, hide, minify, negative, remove, trash"></i>minus</div>
|
|
<div class="column"><i class="not equal icon" data-search-terms="arithmetic, compare, math"></i>not
|
|
equal</div>
|
|
<div class="column"><i class="percentage icon"
|
|
data-search-terms="discount, fraction, proportion, rate, ratio"></i>percentage</div>
|
|
<div class="column"><i class="plus icon"
|
|
data-search-terms="add, create, expand, new, positive, shape"></i>plus</div>
|
|
<div class="column"><i class="square root alternate icon"
|
|
data-search-terms="arithmetic, calculus, division, math"></i>square root alternate</div>
|
|
<div class="column"><i class="subscript icon"
|
|
data-search-terms="edit, font, format, text, type"></i>subscript</div>
|
|
<div class="column"><i class="superscript icon"
|
|
data-search-terms="edit, exponential, font, format, text, type"></i>superscript</div>
|
|
<div class="column"><i class="times icon"
|
|
data-search-terms="close, cross, error, exit, incorrect, notice, notification, notify, problem, wrong, x"></i>times
|
|
</div>
|
|
<div class="column"><i class="wave square icon" data-search-terms="frequency, pulse, signal"></i>wave
|
|
square</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Medical</h4>
|
|
<p>Icons can represent common medical actions</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="allergies icon"
|
|
data-search-terms="allergy, freckles, hand, hives, pox, skin, spots"></i>allergies</div>
|
|
<div class="column"><i class="ambulance icon"
|
|
data-search-terms="covid-19, emergency, emt, er, help, hospital, support, vehicle"></i>ambulance
|
|
</div>
|
|
<div class="column"><i class="bacteria icon"
|
|
data-search-terms="antibiotic, antibody, covid-19, health, organism, sick"></i>bacteria</div>
|
|
<div class="column"><i class="bacterium icon"
|
|
data-search-terms="antibiotic, antibody, covid-19, health, organism, sick"></i>bacterium</div>
|
|
<div class="column"><i class="band aid icon"
|
|
data-search-terms="bandage, boo boo, first aid, ouch"></i>band aid</div>
|
|
<div class="column"><i class="biohazard icon"
|
|
data-search-terms="covid-19, danger, dangerous, hazmat, medical, radioactive, toxic, waste, zombie"></i>biohazard
|
|
</div>
|
|
<div class="column"><i class="bone icon"
|
|
data-search-terms="calcium, dog, skeletal, skeleton, tibia"></i>bone</div>
|
|
<div class="column"><i class="bong icon"
|
|
data-search-terms="aparatus, cannabis, marijuana, pipe, smoke, smoking"></i>bong</div>
|
|
<div class="column"><i class="book medical icon"
|
|
data-search-terms="diary, documentation, health, history, journal, library, read, record"></i>book
|
|
medical</div>
|
|
<div class="column"><i class="brain icon"
|
|
data-search-terms="cerebellum, gray matter, intellect, medulla oblongata, mind, noodle, wit"></i>brain
|
|
</div>
|
|
<div class="column"><i class="briefcase medical icon"
|
|
data-search-terms="doctor, emt, first aid, health"></i>briefcase medical</div>
|
|
<div class="column"><i class="burn icon"
|
|
data-search-terms="caliente, energy, fire, flame, gas, heat, hot"></i>burn</div>
|
|
<div class="column"><i class="cannabis icon"
|
|
data-search-terms="bud, chronic, drugs, endica, endo, ganja, marijuana, mary jane, pot, reefer, sativa, spliff, weed, whacky-tabacky"></i>cannabis
|
|
</div>
|
|
<div class="column"><i class="capsules icon"
|
|
data-search-terms="drugs, medicine, pills, prescription"></i>capsules</div>
|
|
<div class="column"><i class="clinic medical icon"
|
|
data-search-terms="covid-19, doctor, general practitioner, hospital, infirmary, medicine, office, outpatient"></i>clinic
|
|
medical</div>
|
|
<div class="column"><i class="comment medical icon"
|
|
data-search-terms="advice, bubble, chat, commenting, conversation, diagnose, feedback, message, note, notification, prescription, sms, speech, texting"></i>comment
|
|
medical</div>
|
|
<div class="column"><i class="crutch icon"
|
|
data-search-terms="cane, injury, mobility, wheelchair"></i>crutch</div>
|
|
<div class="column"><i class="diagnoses icon"
|
|
data-search-terms="analyze, detect, diagnosis, examine, medicine"></i>diagnoses</div>
|
|
<div class="column"><i class="disease icon"
|
|
data-search-terms="bacteria, cancer, covid-19, illness, infection, sickness, virus"></i>disease
|
|
</div>
|
|
<div class="column"><i class="dna icon"
|
|
data-search-terms="double helix, genetic, helix, molecule, protein"></i>dna</div>
|
|
<div class="column"><i class="file medical icon"
|
|
data-search-terms="document, health, history, prescription, record"></i>file medical</div>
|
|
<div class="column"><i class="file medical alternate icon"
|
|
data-search-terms="document, health, history, prescription, record"></i>file medical alternate
|
|
</div>
|
|
<div class="column"><i class="file prescription icon"
|
|
data-search-terms="document, drugs, medical, medicine, rx"></i>file prescription</div>
|
|
<div class="column"><i class="first aid icon"
|
|
data-search-terms="emergency, emt, health, medical, rescue"></i>first aid</div>
|
|
<div class="column"><i class="hand holding medical icon"
|
|
data-search-terms="care, covid-19, donate, help"></i>hand holding medical</div>
|
|
<div class="column"><i class="head side cough icon"
|
|
data-search-terms="cough, covid-19, germs, lungs, respiratory, sick"></i>head side cough</div>
|
|
<div class="column"><i class="head side cough slash icon"
|
|
data-search-terms="cough, covid-19, germs, lungs, respiratory, sick"></i>head side cough slash
|
|
</div>
|
|
<div class="column"><i class="head side mask icon"
|
|
data-search-terms="breath, covid-19, filter, respirator, virus"></i>head side mask</div>
|
|
<div class="column"><i class="head side virus icon"
|
|
data-search-terms="cold, covid-19, flu, sick"></i>head side virus</div>
|
|
<div class="column"><i class="heart icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart</div>
|
|
<div class="column"><i class="heart outline icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart outline</div>
|
|
<div class="column"><i class="heartbeat icon"
|
|
data-search-terms="ekg, electrocardiogram, health, lifeline, vital signs"></i>heartbeat</div>
|
|
<div class="column"><i class="hospital icon"
|
|
data-search-terms="building, covid-19, emergency room, medical center"></i>hospital</div>
|
|
<div class="column"><i class="hospital alternate icon"
|
|
data-search-terms="building, covid-19, emergency room, medical center"></i>hospital alternate
|
|
</div>
|
|
<div class="column"><i class="hospital outline icon"
|
|
data-search-terms="building, covid-19, emergency room, medical center"></i>hospital outline
|
|
</div>
|
|
<div class="column"><i class="hospital symbol icon"
|
|
data-search-terms="clinic, covid-19, emergency, map"></i>hospital symbol</div>
|
|
<div class="column"><i class="hospital user icon"
|
|
data-search-terms="covid-19, doctor, network, patient, primary care"></i>hospital user</div>
|
|
<div class="column"><i class="id card alternate icon"
|
|
data-search-terms="contact, demographics, document, identification, issued, profile"></i>id card
|
|
alternate</div>
|
|
<div class="column"><i class="joint icon"
|
|
data-search-terms="blunt, cannabis, doobie, drugs, marijuana, roach, smoke, smoking, spliff"></i>joint
|
|
</div>
|
|
<div class="column"><i class="laptop medical icon"
|
|
data-search-terms="computer, device, ehr, electronic health records, history"></i>laptop medical
|
|
</div>
|
|
<div class="column"><i class="lungs icon"
|
|
data-search-terms="air, breath, covid-19, organ, respiratory"></i>lungs</div>
|
|
<div class="column"><i class="lungs virus icon"
|
|
data-search-terms="breath, covid-19, respiratory, sick"></i>lungs virus</div>
|
|
<div class="column"><i class="microscope icon"
|
|
data-search-terms="covid-19, electron, lens, optics, science, shrink"></i>microscope</div>
|
|
<div class="column"><i class="mortar pestle icon"
|
|
data-search-terms="crush, culinary, grind, medical, mix, pharmacy, prescription, spices"></i>mortar
|
|
pestle</div>
|
|
<div class="column"><i class="notes medical icon"
|
|
data-search-terms="clipboard, doctor, ehr, health, history, records"></i>notes medical</div>
|
|
<div class="column"><i class="pager icon" data-search-terms="beeper, cellphone, communication"></i>pager
|
|
</div>
|
|
<div class="column"><i class="pills icon"
|
|
data-search-terms="drugs, medicine, prescription, tablets"></i>pills</div>
|
|
<div class="column"><i class="plus icon"
|
|
data-search-terms="add, create, expand, new, positive, shape"></i>plus</div>
|
|
<div class="column"><i class="poop icon" data-search-terms="crap, poop, shit, smile, turd"></i>poop
|
|
</div>
|
|
<div class="column"><i class="prescription icon"
|
|
data-search-terms="drugs, medical, medicine, pharmacy, rx"></i>prescription</div>
|
|
<div class="column"><i class="prescription bottle icon"
|
|
data-search-terms="drugs, medical, medicine, pharmacy, rx"></i>prescription bottle</div>
|
|
<div class="column"><i class="prescription bottle alternate icon"
|
|
data-search-terms="drugs, medical, medicine, pharmacy, rx"></i>prescription bottle alternate
|
|
</div>
|
|
<div class="column"><i class="procedures icon"
|
|
data-search-terms="EKG, bed, electrocardiogram, health, hospital, life, patient, vital"></i>procedures
|
|
</div>
|
|
<div class="column"><i class="pump medical icon"
|
|
data-search-terms="anti-bacterial, clean, covid-19, disinfect, hygiene, medical grade, sanitizer, soap"></i>pump
|
|
medical</div>
|
|
<div class="column"><i class="radiation icon"
|
|
data-search-terms="danger, dangerous, deadly, hazard, nuclear, radioactive, warning"></i>radiation
|
|
</div>
|
|
<div class="column"><i class="radiation alternate icon"
|
|
data-search-terms="danger, dangerous, deadly, hazard, nuclear, radioactive, warning"></i>radiation
|
|
alternate</div>
|
|
<div class="column"><i class="shield virus icon"
|
|
data-search-terms="antibodies, barrier, covid-19, health, protect"></i>shield virus</div>
|
|
<div class="column"><i class="smoking icon"
|
|
data-search-terms="cancer, cigarette, nicotine, smoking status, tobacco"></i>smoking</div>
|
|
<div class="column"><i class="smoking ban icon"
|
|
data-search-terms="ban, cancel, no smoking, non-smoking"></i>smoking ban</div>
|
|
<div class="column"><i class="star of life icon"
|
|
data-search-terms="doctor, emt, first aid, health, medical"></i>star of life</div>
|
|
<div class="column"><i class="stethoscope icon"
|
|
data-search-terms="covid-19, diagnosis, doctor, general practitioner, hospital, infirmary, medicine, office, outpatient"></i>stethoscope
|
|
</div>
|
|
<div class="column"><i class="syringe icon"
|
|
data-search-terms="covid-19, doctor, immunizations, medical, needle"></i>syringe</div>
|
|
<div class="column"><i class="tablets icon"
|
|
data-search-terms="drugs, medicine, pills, prescription"></i>tablets</div>
|
|
<div class="column"><i class="teeth icon"
|
|
data-search-terms="bite, dental, dentist, gums, mouth, smile, tooth"></i>teeth</div>
|
|
<div class="column"><i class="teeth open icon"
|
|
data-search-terms="dental, dentist, gums bite, mouth, smile, tooth"></i>teeth open</div>
|
|
<div class="column"><i class="thermometer icon"
|
|
data-search-terms="covid-19, mercury, status, temperature"></i>thermometer</div>
|
|
<div class="column"><i class="tooth icon"
|
|
data-search-terms="bicuspid, dental, dentist, molar, mouth, teeth"></i>tooth</div>
|
|
<div class="column"><i class="user md icon"
|
|
data-search-terms="covid-19, job, medical, nurse, occupation, physician, profile, surgeon"></i>user
|
|
md</div>
|
|
<div class="column"><i class="user nurse icon"
|
|
data-search-terms="covid-19, doctor, midwife, practitioner, surgeon"></i>user nurse</div>
|
|
<div class="column"><i class="vial icon"
|
|
data-search-terms="experiment, lab, sample, science, test, test tube"></i>vial</div>
|
|
<div class="column"><i class="vials icon"
|
|
data-search-terms="experiment, lab, sample, science, test, test tube"></i>vials</div>
|
|
<div class="column"><i class="virus icon"
|
|
data-search-terms="bug, covid-19, flu, health, sick, viral"></i>virus</div>
|
|
<div class="column"><i class="virus slash icon"
|
|
data-search-terms="bug, covid-19, cure, eliminate, flu, health, sick, viral"></i>virus slash
|
|
</div>
|
|
<div class="column"><i class="viruses icon"
|
|
data-search-terms="bugs, covid-19, flu, health, multiply, sick, spread, viral"></i>viruses</div>
|
|
<div class="column"><i class="weight icon"
|
|
data-search-terms="health, measurement, scale, weight"></i>weight</div>
|
|
<div class="column"><i class="x ray icon"
|
|
data-search-terms="health, medical, radiological images, radiology, skeleton"></i>x ray</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Moving</h4>
|
|
<p>Icons can represent moving activities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="archive icon" data-search-terms="box, package, save, storage"></i>archive
|
|
</div>
|
|
<div class="column"><i class="box open icon"
|
|
data-search-terms="archive, container, package, storage, unpack"></i>box open</div>
|
|
<div class="column"><i class="caravan icon"
|
|
data-search-terms="camper, motor home, rv, trailer, travel"></i>caravan</div>
|
|
<div class="column"><i class="couch icon"
|
|
data-search-terms="chair, cushion, furniture, relax, sofa"></i>couch</div>
|
|
<div class="column"><i class="dolly icon" data-search-terms="carry, shipping, transport"></i>dolly</div>
|
|
<div class="column"><i class="people carry icon"
|
|
data-search-terms="box, carry, fragile, help, movers, package"></i>people carry</div>
|
|
<div class="column"><i class="route icon" data-search-terms="directions, navigation, travel"></i>route
|
|
</div>
|
|
<div class="column"><i class="sign icon"
|
|
data-search-terms="directions, real estate, signage, wayfinding"></i>sign</div>
|
|
<div class="column"><i class="suitcase icon"
|
|
data-search-terms="baggage, luggage, move, suitcase, travel, trip"></i>suitcase</div>
|
|
<div class="column"><i class="tape icon" data-search-terms="design, package, sticky"></i>tape</div>
|
|
<div class="column"><i class="trailer icon" data-search-terms="carry, haul, moving, travel"></i>trailer
|
|
</div>
|
|
<div class="column"><i class="truck moving icon"
|
|
data-search-terms="cargo, inventory, rental, vehicle"></i>truck moving</div>
|
|
<div class="column"><i class="truck packing icon"
|
|
data-search-terms="box, cargo, delivery, inventory, moving, rental, vehicle"></i>truck packing
|
|
</div>
|
|
<div class="column"><i class="wine glass icon"
|
|
data-search-terms="alcohol, beverage, cabernet, drink, grapes, merlot, sauvignon"></i>wine glass
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Music</h4>
|
|
<p>Icons which represent musical instruments, items and platforms</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="compact disc icon"
|
|
data-search-terms="album, bluray, cd, disc, dvd, media, movie, music, record, video, vinyl"></i>compact
|
|
disc</div>
|
|
<div class="column"><i class="drum icon"
|
|
data-search-terms="instrument, music, percussion, snare, sound"></i>drum</div>
|
|
<div class="column"><i class="drum steelpan icon"
|
|
data-search-terms="calypso, instrument, music, percussion, reggae, snare, sound, steel, tropical"></i>drum
|
|
steelpan</div>
|
|
<div class="column"><i class="file audio icon"
|
|
data-search-terms="document, mp3, music, page, play, sound"></i>file audio</div>
|
|
<div class="column"><i class="file audio outline icon"
|
|
data-search-terms="document, mp3, music, page, play, sound"></i>file audio outline</div>
|
|
<div class="column"><i class="guitar icon"
|
|
data-search-terms="acoustic, instrument, music, rock, rock and roll, song, strings"></i>guitar
|
|
</div>
|
|
<div class="column"><i class="headphones icon"
|
|
data-search-terms="audio, listen, music, sound, speaker"></i>headphones</div>
|
|
<div class="column"><i class="headphones alternate icon"
|
|
data-search-terms="audio, listen, music, sound, speaker"></i>headphones alternate</div>
|
|
<div class="column"><i class="microphone icon"
|
|
data-search-terms="audio, podcast, record, sing, sound, voice"></i>microphone</div>
|
|
<div class="column"><i class="microphone alternate icon"
|
|
data-search-terms="audio, podcast, record, sing, sound, voice"></i>microphone alternate</div>
|
|
<div class="column"><i class="microphone alternate slash icon"
|
|
data-search-terms="audio, disable, mute, podcast, record, sing, sound, voice"></i>microphone
|
|
alternate slash</div>
|
|
<div class="column"><i class="microphone slash icon"
|
|
data-search-terms="audio, disable, mute, podcast, record, sing, sound, voice"></i>microphone
|
|
slash</div>
|
|
<div class="column"><i class="music icon"
|
|
data-search-terms="lyrics, melody, note, sing, sound"></i>music</div>
|
|
<div class="column"><i class="napster icon" data-search-terms=""></i>napster</div>
|
|
<div class="column"><i class="play icon"
|
|
data-search-terms="audio, music, playing, sound, start, video"></i>play</div>
|
|
<div class="column"><i class="record vinyl icon"
|
|
data-search-terms="LP, album, analog, music, phonograph, sound"></i>record vinyl</div>
|
|
<div class="column"><i class="sliders horizontal icon"
|
|
data-search-terms="adjust, settings, sliders, toggle"></i>sliders horizontal</div>
|
|
<div class="column"><i class="soundcloud icon" data-search-terms=""></i>soundcloud</div>
|
|
<div class="column"><i class="spotify icon" data-search-terms=""></i>spotify</div>
|
|
<div class="column"><i class="volume down icon"
|
|
data-search-terms="audio, lower, music, quieter, sound, speaker"></i>volume down</div>
|
|
<div class="column"><i class="volume mute icon"
|
|
data-search-terms="audio, music, quiet, sound, speaker"></i>volume mute</div>
|
|
<div class="column"><i class="volume off icon"
|
|
data-search-terms="audio, ban, music, mute, quiet, silent, sound"></i>volume off</div>
|
|
<div class="column"><i class="volume up icon"
|
|
data-search-terms="audio, higher, louder, music, sound, speaker"></i>volume up</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Objects</h4>
|
|
<p>Icons can be used to represent common objects</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="ambulance icon"
|
|
data-search-terms="covid-19, emergency, emt, er, help, hospital, support, vehicle"></i>ambulance
|
|
</div>
|
|
<div class="column"><i class="anchor icon"
|
|
data-search-terms="berth, boat, dock, embed, link, maritime, moor, secure"></i>anchor</div>
|
|
<div class="column"><i class="archive icon" data-search-terms="box, package, save, storage"></i>archive
|
|
</div>
|
|
<div class="column"><i class="award icon"
|
|
data-search-terms="honor, praise, prize, recognition, ribbon, trophy"></i>award</div>
|
|
<div class="column"><i class="baby carriage icon"
|
|
data-search-terms="buggy, carrier, infant, push, stroller, transportation, walk, wheels"></i>baby
|
|
carriage</div>
|
|
<div class="column"><i class="balance scale icon"
|
|
data-search-terms="balanced, justice, legal, measure, weight"></i>balance scale</div>
|
|
<div class="column"><i class="balance scale left icon"
|
|
data-search-terms="justice, legal, measure, unbalanced, weight"></i>balance scale left</div>
|
|
<div class="column"><i class="balance scale right icon"
|
|
data-search-terms="justice, legal, measure, unbalanced, weight"></i>balance scale right</div>
|
|
<div class="column"><i class="bath icon" data-search-terms="clean, shower, tub, wash"></i>bath</div>
|
|
<div class="column"><i class="bed icon"
|
|
data-search-terms="lodging, mattress, rest, sleep, travel"></i>bed</div>
|
|
<div class="column"><i class="beer icon"
|
|
data-search-terms="alcohol, ale, bar, beverage, brewery, drink, lager, liquor, mug, stein"></i>beer
|
|
</div>
|
|
<div class="column"><i class="bell icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell</div>
|
|
<div class="column"><i class="bell outline icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell outline</div>
|
|
<div class="column"><i class="bicycle icon"
|
|
data-search-terms="bike, gears, pedal, transportation, vehicle"></i>bicycle</div>
|
|
<div class="column"><i class="binoculars icon"
|
|
data-search-terms="glasses, magnify, scenic, spyglass, view"></i>binoculars</div>
|
|
<div class="column"><i class="birthday cake icon"
|
|
data-search-terms="anniversary, bakery, candles, celebration, dessert, frosting, holiday, party, pastry"></i>birthday
|
|
cake</div>
|
|
<div class="column"><i class="blender icon"
|
|
data-search-terms="cocktail, milkshake, mixer, puree, smoothie"></i>blender</div>
|
|
<div class="column"><i class="bomb icon"
|
|
data-search-terms="error, explode, fuse, grenade, warning"></i>bomb</div>
|
|
<div class="column"><i class="book icon"
|
|
data-search-terms="diary, documentation, journal, library, read"></i>book</div>
|
|
<div class="column"><i class="book dead icon"
|
|
data-search-terms="Dungeons & Dragons, crossbones, d&d, dark arts, death, dnd, documentation, evil, fantasy, halloween, holiday, necronomicon, read, skull, spell"></i>book
|
|
dead</div>
|
|
<div class="column"><i class="bookmark icon"
|
|
data-search-terms="favorite, marker, read, remember, save"></i>bookmark</div>
|
|
<div class="column"><i class="bookmark outline icon"
|
|
data-search-terms="favorite, marker, read, remember, save"></i>bookmark outline</div>
|
|
<div class="column"><i class="briefcase icon"
|
|
data-search-terms="bag, business, luggage, office, work"></i>briefcase</div>
|
|
<div class="column"><i class="broadcast tower icon"
|
|
data-search-terms="airwaves, antenna, radio, reception, waves"></i>broadcast tower</div>
|
|
<div class="column"><i class="bug icon" data-search-terms="beetle, error, insect, report"></i>bug</div>
|
|
<div class="column"><i class="building icon"
|
|
data-search-terms="apartment, business, city, company, office, work"></i>building</div>
|
|
<div class="column"><i class="building outline icon"
|
|
data-search-terms="apartment, business, city, company, office, work"></i>building outline</div>
|
|
<div class="column"><i class="bullhorn icon"
|
|
data-search-terms="announcement, broadcast, louder, megaphone, share"></i>bullhorn</div>
|
|
<div class="column"><i class="bullseye icon"
|
|
data-search-terms="archery, goal, objective, target"></i>bullseye</div>
|
|
<div class="column"><i class="bus icon"
|
|
data-search-terms="public transportation, transportation, travel, vehicle"></i>bus</div>
|
|
<div class="column"><i class="calculator icon"
|
|
data-search-terms="abacus, addition, arithmetic, counting, math, multiplication, subtraction"></i>calculator
|
|
</div>
|
|
<div class="column"><i class="calendar icon"
|
|
data-search-terms="calendar-o, date, event, schedule, time, when"></i>calendar</div>
|
|
<div class="column"><i class="calendar alternate icon"
|
|
data-search-terms="calendar, date, event, schedule, time, when"></i>calendar alternate</div>
|
|
<div class="column"><i class="calendar alternate outline icon"
|
|
data-search-terms="calendar, date, event, schedule, time, when"></i>calendar alternate outline
|
|
</div>
|
|
<div class="column"><i class="calendar outline icon"
|
|
data-search-terms="calendar-o, date, event, schedule, time, when"></i>calendar outline</div>
|
|
<div class="column"><i class="camera icon"
|
|
data-search-terms="image, lens, photo, picture, record, shutter, video"></i>camera</div>
|
|
<div class="column"><i class="camera retro icon"
|
|
data-search-terms="image, lens, photo, picture, record, shutter, video"></i>camera retro</div>
|
|
<div class="column"><i class="candy cane icon"
|
|
data-search-terms="candy, christmas, holiday, mint, peppermint, striped, xmas"></i>candy cane
|
|
</div>
|
|
<div class="column"><i class="car icon"
|
|
data-search-terms="auto, automobile, sedan, transportation, travel, vehicle"></i>car</div>
|
|
<div class="column"><i class="carrot icon"
|
|
data-search-terms="bugs bunny, orange, vegan, vegetable"></i>carrot</div>
|
|
<div class="column"><i class="church icon"
|
|
data-search-terms="building, cathedral, chapel, community, religion"></i>church</div>
|
|
<div class="column"><i class="clipboard icon"
|
|
data-search-terms="copy, notes, paste, record"></i>clipboard</div>
|
|
<div class="column"><i class="clipboard outline icon"
|
|
data-search-terms="copy, notes, paste, record"></i>clipboard outline</div>
|
|
<div class="column"><i class="cloud icon"
|
|
data-search-terms="atmosphere, fog, overcast, save, upload, weather"></i>cloud</div>
|
|
<div class="column"><i class="coffee icon"
|
|
data-search-terms="beverage, breakfast, cafe, drink, fall, morning, mug, seasonal, tea"></i>coffee
|
|
</div>
|
|
<div class="column"><i class="cog icon"
|
|
data-search-terms="gear, mechanical, settings, sprocket, wheel"></i>cog</div>
|
|
<div class="column"><i class="cogs icon"
|
|
data-search-terms="gears, mechanical, settings, sprocket, wheel"></i>cogs</div>
|
|
<div class="column"><i class="compass icon"
|
|
data-search-terms="directions, directory, location, menu, navigation, safari, travel"></i>compass
|
|
</div>
|
|
<div class="column"><i class="compass outline icon"
|
|
data-search-terms="directions, directory, location, menu, navigation, safari, travel"></i>compass
|
|
outline</div>
|
|
<div class="column"><i class="cookie icon"
|
|
data-search-terms="baked good, chips, chocolate, eat, snack, sweet, treat"></i>cookie</div>
|
|
<div class="column"><i class="cookie bite icon"
|
|
data-search-terms="baked good, bitten, chips, chocolate, eat, snack, sweet, treat"></i>cookie
|
|
bite</div>
|
|
<div class="column"><i class="copy icon"
|
|
data-search-terms="clone, duplicate, file, files-o, paper, paste"></i>copy</div>
|
|
<div class="column"><i class="copy outline icon"
|
|
data-search-terms="clone, duplicate, file, files-o, paper, paste"></i>copy outline</div>
|
|
<div class="column"><i class="cube icon"
|
|
data-search-terms="3d, block, dice, package, square, tesseract"></i>cube</div>
|
|
<div class="column"><i class="cubes icon"
|
|
data-search-terms="3d, block, dice, package, pyramid, square, stack, tesseract"></i>cubes</div>
|
|
<div class="column"><i class="cut icon" data-search-terms="clip, scissors, snip"></i>cut</div>
|
|
<div class="column"><i class="dice icon" data-search-terms="chance, gambling, game, roll"></i>dice</div>
|
|
<div class="column"><i class="dice d20 icon"
|
|
data-search-terms="Dungeons & Dragons, chance, d&d, dnd, fantasy, gambling, game, roll"></i>dice
|
|
d20</div>
|
|
<div class="column"><i class="dice d6 icon"
|
|
data-search-terms="Dungeons & Dragons, chance, d&d, dnd, fantasy, gambling, game, roll"></i>dice
|
|
d6</div>
|
|
<div class="column"><i class="dice five icon" data-search-terms="chance, gambling, game, roll"></i>dice
|
|
five</div>
|
|
<div class="column"><i class="dice four icon" data-search-terms="chance, gambling, game, roll"></i>dice
|
|
four</div>
|
|
<div class="column"><i class="dice one icon" data-search-terms="chance, gambling, game, roll"></i>dice
|
|
one</div>
|
|
<div class="column"><i class="dice six icon" data-search-terms="chance, gambling, game, roll"></i>dice
|
|
six</div>
|
|
<div class="column"><i class="dice three icon" data-search-terms="chance, gambling, game, roll"></i>dice
|
|
three</div>
|
|
<div class="column"><i class="dice two icon" data-search-terms="chance, gambling, game, roll"></i>dice
|
|
two</div>
|
|
<div class="column"><i class="digital tachograph icon"
|
|
data-search-terms="data, distance, speed, tachometer"></i>digital tachograph</div>
|
|
<div class="column"><i class="door closed icon" data-search-terms="enter, exit, locked"></i>door closed
|
|
</div>
|
|
<div class="column"><i class="door open icon" data-search-terms="enter, exit, welcome"></i>door open
|
|
</div>
|
|
<div class="column"><i class="drum icon"
|
|
data-search-terms="instrument, music, percussion, snare, sound"></i>drum</div>
|
|
<div class="column"><i class="drum steelpan icon"
|
|
data-search-terms="calypso, instrument, music, percussion, reggae, snare, sound, steel, tropical"></i>drum
|
|
steelpan</div>
|
|
<div class="column"><i class="envelope icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
</div>
|
|
<div class="column"><i class="envelope open icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
open</div>
|
|
<div class="column"><i class="envelope open outline icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
open outline</div>
|
|
<div class="column"><i class="envelope outline icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
outline</div>
|
|
<div class="column"><i class="eraser icon" data-search-terms="art, delete, remove, rubber"></i>eraser
|
|
</div>
|
|
<div class="column"><i class="eye icon"
|
|
data-search-terms="look, optic, see, seen, show, sight, views, visible"></i>eye</div>
|
|
<div class="column"><i class="eye dropper icon"
|
|
data-search-terms="beaker, clone, color, copy, eyedropper, pipette"></i>eye dropper</div>
|
|
<div class="column"><i class="eye outline icon"
|
|
data-search-terms="look, optic, see, seen, show, sight, views, visible"></i>eye outline</div>
|
|
<div class="column"><i class="fax icon"
|
|
data-search-terms="business, communicate, copy, facsimile, send"></i>fax</div>
|
|
<div class="column"><i class="feather icon"
|
|
data-search-terms="bird, light, plucked, quill, write"></i>feather</div>
|
|
<div class="column"><i class="feather alternate icon"
|
|
data-search-terms="bird, light, plucked, quill, write"></i>feather alternate</div>
|
|
<div class="column"><i class="fighter jet icon"
|
|
data-search-terms="airplane, fast, fly, goose, maverick, plane, quick, top gun, transportation, travel"></i>fighter
|
|
jet</div>
|
|
<div class="column"><i class="file icon" data-search-terms="document, new, page, pdf, resume"></i>file
|
|
</div>
|
|
<div class="column"><i class="file alternate icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate</div>
|
|
<div class="column"><i class="file alternate outline icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate outline
|
|
</div>
|
|
<div class="column"><i class="file outline icon"
|
|
data-search-terms="document, new, page, pdf, resume"></i>file outline</div>
|
|
<div class="column"><i class="file prescription icon"
|
|
data-search-terms="document, drugs, medical, medicine, rx"></i>file prescription</div>
|
|
<div class="column"><i class="film icon" data-search-terms="cinema, movie, strip, video"></i>film</div>
|
|
<div class="column"><i class="fire icon"
|
|
data-search-terms="burn, caliente, flame, heat, hot, popular"></i>fire</div>
|
|
<div class="column"><i class="fire alternate icon"
|
|
data-search-terms="burn, caliente, flame, heat, hot, popular"></i>fire alternate</div>
|
|
<div class="column"><i class="fire extinguisher icon"
|
|
data-search-terms="burn, caliente, fire fighter, flame, heat, hot, rescue"></i>fire extinguisher
|
|
</div>
|
|
<div class="column"><i class="flag icon"
|
|
data-search-terms="country, notice, notification, notify, pole, report, symbol"></i>flag</div>
|
|
<div class="column"><i class="flag checkered icon"
|
|
data-search-terms="notice, notification, notify, pole, racing, report, symbol"></i>flag
|
|
checkered</div>
|
|
<div class="column"><i class="flag outline icon"
|
|
data-search-terms="country, notice, notification, notify, pole, report, symbol"></i>flag outline
|
|
</div>
|
|
<div class="column"><i class="flask icon"
|
|
data-search-terms="beaker, experimental, labs, science"></i>flask</div>
|
|
<div class="column"><i class="futbol icon" data-search-terms="ball, football, mls, soccer"></i>futbol
|
|
</div>
|
|
<div class="column"><i class="futbol outline icon"
|
|
data-search-terms="ball, football, mls, soccer"></i>futbol outline</div>
|
|
<div class="column"><i class="gamepad icon"
|
|
data-search-terms="arcade, controller, d-pad, joystick, video, video game"></i>gamepad</div>
|
|
<div class="column"><i class="gavel icon"
|
|
data-search-terms="hammer, judge, law, lawyer, opinion"></i>gavel</div>
|
|
<div class="column"><i class="gem icon"
|
|
data-search-terms="diamond, jewelry, sapphire, stone, treasure"></i>gem</div>
|
|
<div class="column"><i class="gem outline icon"
|
|
data-search-terms="diamond, jewelry, sapphire, stone, treasure"></i>gem outline</div>
|
|
<div class="column"><i class="gift icon"
|
|
data-search-terms="christmas, generosity, giving, holiday, party, present, wrapped, xmas"></i>gift
|
|
</div>
|
|
<div class="column"><i class="gifts icon"
|
|
data-search-terms="christmas, generosity, giving, holiday, party, present, wrapped, xmas"></i>gifts
|
|
</div>
|
|
<div class="column"><i class="glass cheers icon"
|
|
data-search-terms="alcohol, bar, beverage, celebration, champagne, clink, drink, holiday, new year's eve, party, toast"></i>glass
|
|
cheers</div>
|
|
<div class="column"><i class="glass martini icon"
|
|
data-search-terms="alcohol, bar, beverage, drink, liquor"></i>glass martini</div>
|
|
<div class="column"><i class="glass whiskey icon"
|
|
data-search-terms="alcohol, bar, beverage, bourbon, drink, liquor, neat, rye, scotch, whisky"></i>glass
|
|
whiskey</div>
|
|
<div class="column"><i class="glasses icon"
|
|
data-search-terms="hipster, nerd, reading, sight, spectacles, vision"></i>glasses</div>
|
|
<div class="column"><i class="globe icon"
|
|
data-search-terms="all, coordinates, country, earth, global, gps, language, localize, location, map, online, place, planet, translate, travel, world"></i>globe
|
|
</div>
|
|
<div class="column"><i class="graduation cap icon"
|
|
data-search-terms="ceremony, college, graduate, learning, school, student"></i>graduation cap
|
|
</div>
|
|
<div class="column"><i class="guitar icon"
|
|
data-search-terms="acoustic, instrument, music, rock, rock and roll, song, strings"></i>guitar
|
|
</div>
|
|
<div class="column"><i class="hat wizard icon"
|
|
data-search-terms="Dungeons & Dragons, accessory, buckle, clothing, d&d, dnd, fantasy, halloween, head, holiday, mage, magic, pointy, witch"></i>hat
|
|
wizard</div>
|
|
<div class="column"><i class="hdd icon"
|
|
data-search-terms="cpu, hard drive, harddrive, machine, save, storage"></i>hdd</div>
|
|
<div class="column"><i class="hdd outline icon"
|
|
data-search-terms="cpu, hard drive, harddrive, machine, save, storage"></i>hdd outline</div>
|
|
<div class="column"><i class="headphones icon"
|
|
data-search-terms="audio, listen, music, sound, speaker"></i>headphones</div>
|
|
<div class="column"><i class="headphones alternate icon"
|
|
data-search-terms="audio, listen, music, sound, speaker"></i>headphones alternate</div>
|
|
<div class="column"><i class="headset icon"
|
|
data-search-terms="audio, gamer, gaming, listen, live chat, microphone, shot caller, sound, support, telemarketer"></i>headset
|
|
</div>
|
|
<div class="column"><i class="heart icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart</div>
|
|
<div class="column"><i class="heart broken icon"
|
|
data-search-terms="breakup, crushed, dislike, dumped, grief, love, lovesick, relationship, sad"></i>heart
|
|
broken</div>
|
|
<div class="column"><i class="heart outline icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart outline</div>
|
|
<div class="column"><i class="helicopter icon"
|
|
data-search-terms="airwolf, apache, chopper, flight, fly, travel"></i>helicopter</div>
|
|
<div class="column"><i class="highlighter icon"
|
|
data-search-terms="edit, marker, sharpie, update, write"></i>highlighter</div>
|
|
<div class="column"><i class="holly berry icon"
|
|
data-search-terms="catwoman, christmas, decoration, flora, halle, holiday, ororo munroe, plant, storm, xmas"></i>holly
|
|
berry</div>
|
|
<div class="column"><i class="home icon" data-search-terms="abode, building, house, main"></i>home</div>
|
|
<div class="column"><i class="hospital icon"
|
|
data-search-terms="building, covid-19, emergency room, medical center"></i>hospital</div>
|
|
<div class="column"><i class="hospital outline icon"
|
|
data-search-terms="building, covid-19, emergency room, medical center"></i>hospital outline
|
|
</div>
|
|
<div class="column"><i class="hourglass icon"
|
|
data-search-terms="hour, minute, sand, stopwatch, time"></i>hourglass</div>
|
|
<div class="column"><i class="hourglass outline icon"
|
|
data-search-terms="hour, minute, sand, stopwatch, time"></i>hourglass outline</div>
|
|
<div class="column"><i class="igloo icon"
|
|
data-search-terms="dome, dwelling, eskimo, home, house, ice, snow"></i>igloo</div>
|
|
<div class="column"><i class="image icon" data-search-terms="album, landscape, photo, picture"></i>image
|
|
</div>
|
|
<div class="column"><i class="image outline icon"
|
|
data-search-terms="album, landscape, photo, picture"></i>image outline</div>
|
|
<div class="column"><i class="images icon"
|
|
data-search-terms="album, landscape, photo, picture"></i>images</div>
|
|
<div class="column"><i class="images outline icon"
|
|
data-search-terms="album, landscape, photo, picture"></i>images outline</div>
|
|
<div class="column"><i class="industry icon"
|
|
data-search-terms="building, factory, industrial, manufacturing, mill, warehouse"></i>industry
|
|
</div>
|
|
<div class="column"><i class="key icon"
|
|
data-search-terms="lock, password, private, secret, unlock"></i>key</div>
|
|
<div class="column"><i class="keyboard icon"
|
|
data-search-terms="accessory, edit, input, text, type, write"></i>keyboard</div>
|
|
<div class="column"><i class="keyboard outline icon"
|
|
data-search-terms="accessory, edit, input, text, type, write"></i>keyboard outline</div>
|
|
<div class="column"><i class="laptop icon"
|
|
data-search-terms="computer, cpu, dell, demo, device, mac, macbook, machine, pc"></i>laptop
|
|
</div>
|
|
<div class="column"><i class="leaf icon" data-search-terms="eco, flora, nature, plant, vegan"></i>leaf
|
|
</div>
|
|
<div class="column"><i class="lemon icon" data-search-terms="citrus, lemonade, lime, tart"></i>lemon
|
|
</div>
|
|
<div class="column"><i class="lemon outline icon"
|
|
data-search-terms="citrus, lemonade, lime, tart"></i>lemon outline</div>
|
|
<div class="column"><i class="life ring icon"
|
|
data-search-terms="coast guard, help, overboard, save, support"></i>life ring</div>
|
|
<div class="column"><i class="life ring outline icon"
|
|
data-search-terms="coast guard, help, overboard, save, support"></i>life ring outline</div>
|
|
<div class="column"><i class="lightbulb icon"
|
|
data-search-terms="energy, idea, inspiration, light"></i>lightbulb</div>
|
|
<div class="column"><i class="lightbulb outline icon"
|
|
data-search-terms="energy, idea, inspiration, light"></i>lightbulb outline</div>
|
|
<div class="column"><i class="lock icon"
|
|
data-search-terms="admin, lock, open, password, private, protect, security"></i>lock</div>
|
|
<div class="column"><i class="lock open icon"
|
|
data-search-terms="admin, lock, open, password, private, protect, security"></i>lock open</div>
|
|
<div class="column"><i class="magic icon"
|
|
data-search-terms="autocomplete, automatic, mage, magic, spell, wand, witch, wizard"></i>magic
|
|
</div>
|
|
<div class="column"><i class="magnet icon" data-search-terms="Attract, lodestone, tool"></i>magnet</div>
|
|
<div class="column"><i class="map icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
</div>
|
|
<div class="column"><i class="map marker icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
marker</div>
|
|
<div class="column"><i class="map marker alternate icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
marker alternate</div>
|
|
<div class="column"><i class="map outline icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
outline</div>
|
|
<div class="column"><i class="map pin icon"
|
|
data-search-terms="address, agree, coordinates, destination, gps, localize, location, map, marker, navigation, pin, place, position, travel"></i>map
|
|
pin</div>
|
|
<div class="column"><i class="map signs icon"
|
|
data-search-terms="directions, directory, map, signage, wayfinding"></i>map signs</div>
|
|
<div class="column"><i class="marker icon"
|
|
data-search-terms="design, edit, sharpie, update, write"></i>marker</div>
|
|
<div class="column"><i class="medal icon" data-search-terms="award, ribbon, star, trophy"></i>medal
|
|
</div>
|
|
<div class="column"><i class="medkit icon"
|
|
data-search-terms="first aid, firstaid, health, help, support"></i>medkit</div>
|
|
<div class="column"><i class="memory icon"
|
|
data-search-terms="DIMM, RAM, hardware, storage, technology"></i>memory</div>
|
|
<div class="column"><i class="microchip icon"
|
|
data-search-terms="cpu, hardware, processor, technology"></i>microchip</div>
|
|
<div class="column"><i class="microphone icon"
|
|
data-search-terms="audio, podcast, record, sing, sound, voice"></i>microphone</div>
|
|
<div class="column"><i class="microphone alternate icon"
|
|
data-search-terms="audio, podcast, record, sing, sound, voice"></i>microphone alternate</div>
|
|
<div class="column"><i class="mitten icon"
|
|
data-search-terms="clothing, cold, glove, hands, knitted, seasonal, warmth"></i>mitten</div>
|
|
<div class="column"><i class="mobile icon"
|
|
data-search-terms="apple, call, cell phone, cellphone, device, iphone, number, screen, telephone"></i>mobile
|
|
</div>
|
|
<div class="column"><i class="mobile alternate icon"
|
|
data-search-terms="apple, call, cell phone, cellphone, device, iphone, number, screen, telephone"></i>mobile
|
|
alternate</div>
|
|
<div class="column"><i class="money bill icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill</div>
|
|
<div class="column"><i class="money bill alternate icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill
|
|
alternate</div>
|
|
<div class="column"><i class="money bill alternate outline icon"
|
|
data-search-terms="buy, cash, checkout, money, payment, price, purchase"></i>money bill
|
|
alternate outline</div>
|
|
<div class="column"><i class="money check icon"
|
|
data-search-terms="bank check, buy, checkout, cheque, money, payment, price, purchase"></i>money
|
|
check</div>
|
|
<div class="column"><i class="money check alternate icon"
|
|
data-search-terms="bank check, buy, checkout, cheque, money, payment, price, purchase"></i>money
|
|
check alternate</div>
|
|
<div class="column"><i class="moon icon"
|
|
data-search-terms="contrast, crescent, dark, lunar, night"></i>moon</div>
|
|
<div class="column"><i class="moon outline icon"
|
|
data-search-terms="contrast, crescent, dark, lunar, night"></i>moon outline</div>
|
|
<div class="column"><i class="motorcycle icon"
|
|
data-search-terms="bike, machine, transportation, vehicle"></i>motorcycle</div>
|
|
<div class="column"><i class="mug hot icon"
|
|
data-search-terms="caliente, cocoa, coffee, cup, drink, holiday, hot chocolate, steam, tea, warmth"></i>mug
|
|
hot</div>
|
|
<div class="column"><i class="newspaper icon"
|
|
data-search-terms="article, editorial, headline, journal, journalism, news, press"></i>newspaper
|
|
</div>
|
|
<div class="column"><i class="newspaper outline icon"
|
|
data-search-terms="article, editorial, headline, journal, journalism, news, press"></i>newspaper
|
|
outline</div>
|
|
<div class="column"><i class="paint brush icon"
|
|
data-search-terms="acrylic, art, brush, color, fill, paint, pigment, watercolor"></i>paint brush
|
|
</div>
|
|
<div class="column"><i class="paper plane icon"
|
|
data-search-terms="air, float, fold, mail, paper, send"></i>paper plane</div>
|
|
<div class="column"><i class="paper plane outline icon"
|
|
data-search-terms="air, float, fold, mail, paper, send"></i>paper plane outline</div>
|
|
<div class="column"><i class="paperclip icon"
|
|
data-search-terms="attach, attachment, connect, link"></i>paperclip</div>
|
|
<div class="column"><i class="paste icon" data-search-terms="clipboard, copy, document, paper"></i>paste
|
|
</div>
|
|
<div class="column"><i class="paw icon" data-search-terms="animal, cat, dog, pet, print"></i>paw</div>
|
|
<div class="column"><i class="pen icon" data-search-terms="design, edit, update, write"></i>pen</div>
|
|
<div class="column"><i class="pen alternate icon"
|
|
data-search-terms="design, edit, update, write"></i>pen alternate</div>
|
|
<div class="column"><i class="pen fancy icon"
|
|
data-search-terms="design, edit, fountain pen, update, write"></i>pen fancy</div>
|
|
<div class="column"><i class="pen nib icon"
|
|
data-search-terms="design, edit, fountain pen, update, write"></i>pen nib</div>
|
|
<div class="column"><i class="pencil alternate icon"
|
|
data-search-terms="design, edit, pencil, update, write"></i>pencil alternate</div>
|
|
<div class="column"><i class="phone icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone</div>
|
|
<div class="column"><i class="phone alternate icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone alternate</div>
|
|
<div class="column"><i class="plane icon"
|
|
data-search-terms="airplane, destination, fly, location, mode, travel, trip"></i>plane</div>
|
|
<div class="column"><i class="plug icon" data-search-terms="connect, electric, online, power"></i>plug
|
|
</div>
|
|
<div class="column"><i class="print icon"
|
|
data-search-terms="business, copy, document, office, paper"></i>print</div>
|
|
<div class="column"><i class="puzzle piece icon"
|
|
data-search-terms="add-on, addon, game, section"></i>puzzle piece</div>
|
|
<div class="column"><i class="ring icon"
|
|
data-search-terms="Dungeons & Dragons, Gollum, band, binding, d&d, dnd, engagement, fantasy, gold, jewelry, marriage, precious"></i>ring
|
|
</div>
|
|
<div class="column"><i class="road icon"
|
|
data-search-terms="highway, map, pavement, route, street, travel"></i>road</div>
|
|
<div class="column"><i class="rocket icon"
|
|
data-search-terms="aircraft, app, jet, launch, nasa, space"></i>rocket</div>
|
|
<div class="column"><i class="ruler combined icon"
|
|
data-search-terms="design, draft, length, measure, planning"></i>ruler combined</div>
|
|
<div class="column"><i class="ruler horizontal icon"
|
|
data-search-terms="design, draft, length, measure, planning"></i>ruler horizontal</div>
|
|
<div class="column"><i class="ruler vertical icon"
|
|
data-search-terms="design, draft, length, measure, planning"></i>ruler vertical</div>
|
|
<div class="column"><i class="satellite icon"
|
|
data-search-terms="communications, hardware, orbit, space"></i>satellite</div>
|
|
<div class="column"><i class="satellite dish icon"
|
|
data-search-terms="SETI, communications, hardware, receiver, saucer, signal, space"></i>satellite
|
|
dish</div>
|
|
<div class="column"><i class="save icon" data-search-terms="disk, download, floppy, floppy-o"></i>save
|
|
</div>
|
|
<div class="column"><i class="save outline icon"
|
|
data-search-terms="disk, download, floppy, floppy-o"></i>save outline</div>
|
|
<div class="column"><i class="school icon"
|
|
data-search-terms="building, education, learn, student, teacher"></i>school</div>
|
|
<div class="column"><i class="screwdriver icon"
|
|
data-search-terms="admin, fix, mechanic, repair, settings, tool"></i>screwdriver</div>
|
|
<div class="column"><i class="scroll icon"
|
|
data-search-terms="Dungeons & Dragons, announcement, d&d, dnd, fantasy, paper, script"></i>scroll
|
|
</div>
|
|
<div class="column"><i class="sd card icon" data-search-terms="image, memory, photo, save"></i>sd card
|
|
</div>
|
|
<div class="column"><i class="search icon"
|
|
data-search-terms="bigger, enlarge, find, magnify, preview, zoom"></i>search</div>
|
|
<div class="column"><i class="shield alternate icon"
|
|
data-search-terms="achievement, award, block, defend, security, winner"></i>shield alternate
|
|
</div>
|
|
<div class="column"><i class="shopping bag icon"
|
|
data-search-terms="buy, checkout, grocery, payment, purchase"></i>shopping bag</div>
|
|
<div class="column"><i class="shopping basket icon"
|
|
data-search-terms="buy, checkout, grocery, payment, purchase"></i>shopping basket</div>
|
|
<div class="column"><i class="shopping cart icon"
|
|
data-search-terms="buy, checkout, grocery, payment, purchase"></i>shopping cart</div>
|
|
<div class="column"><i class="shower icon" data-search-terms="bath, clean, faucet, water"></i>shower
|
|
</div>
|
|
<div class="column"><i class="sim card icon"
|
|
data-search-terms="hard drive, hardware, portable, storage, technology, tiny"></i>sim card</div>
|
|
<div class="column"><i class="skull crossbones icon"
|
|
data-search-terms="Dungeons & Dragons, alert, bones, d&d, danger, dead, deadly, death, dnd, fantasy, halloween, holiday, jolly-roger, pirate, poison, skeleton, warning"></i>skull
|
|
crossbones</div>
|
|
<div class="column"><i class="sleigh icon"
|
|
data-search-terms="christmas, claus, fly, holiday, santa, sled, snow, xmas"></i>sleigh</div>
|
|
<div class="column"><i class="snowflake icon"
|
|
data-search-terms="precipitation, rain, winter"></i>snowflake</div>
|
|
<div class="column"><i class="snowflake outline icon"
|
|
data-search-terms="precipitation, rain, winter"></i>snowflake outline</div>
|
|
<div class="column"><i class="snowplow icon"
|
|
data-search-terms="clean up, cold, road, storm, winter"></i>snowplow</div>
|
|
<div class="column"><i class="space shuttle icon"
|
|
data-search-terms="astronaut, machine, nasa, rocket, space, transportation"></i>space shuttle
|
|
</div>
|
|
<div class="column"><i class="star icon"
|
|
data-search-terms="achievement, award, favorite, important, night, rating, score"></i>star</div>
|
|
<div class="column"><i class="star outline icon"
|
|
data-search-terms="achievement, award, favorite, important, night, rating, score"></i>star
|
|
outline</div>
|
|
<div class="column"><i class="sticky note icon"
|
|
data-search-terms="message, note, paper, reminder, sticker"></i>sticky note</div>
|
|
<div class="column"><i class="sticky note outline icon"
|
|
data-search-terms="message, note, paper, reminder, sticker"></i>sticky note outline</div>
|
|
<div class="column"><i class="stopwatch icon" data-search-terms="clock, reminder, time"></i>stopwatch
|
|
</div>
|
|
<div class="column"><i class="stroopwafel icon"
|
|
data-search-terms="caramel, cookie, dessert, sweets, waffle"></i>stroopwafel</div>
|
|
<div class="column"><i class="subway icon"
|
|
data-search-terms="machine, railway, train, transportation, vehicle"></i>subway</div>
|
|
<div class="column"><i class="suitcase icon"
|
|
data-search-terms="baggage, luggage, move, suitcase, travel, trip"></i>suitcase</div>
|
|
<div class="column"><i class="sun icon"
|
|
data-search-terms="brighten, contrast, day, lighter, sol, solar, star, weather"></i>sun</div>
|
|
<div class="column"><i class="sun outline icon"
|
|
data-search-terms="brighten, contrast, day, lighter, sol, solar, star, weather"></i>sun outline
|
|
</div>
|
|
<div class="column"><i class="tablet icon"
|
|
data-search-terms="apple, device, ipad, kindle, screen"></i>tablet</div>
|
|
<div class="column"><i class="tablet alternate icon"
|
|
data-search-terms="apple, device, ipad, kindle, screen"></i>tablet alternate</div>
|
|
<div class="column"><i class="tachometer alternate icon"
|
|
data-search-terms="dashboard, fast, odometer, speed, speedometer"></i>tachometer alternate</div>
|
|
<div class="column"><i class="tag icon" data-search-terms="discount, label, price, shopping"></i>tag
|
|
</div>
|
|
<div class="column"><i class="tags icon" data-search-terms="discount, label, price, shopping"></i>tags
|
|
</div>
|
|
<div class="column"><i class="taxi icon"
|
|
data-search-terms="cab, cabbie, car, car service, lyft, machine, transportation, travel, uber, vehicle"></i>taxi
|
|
</div>
|
|
<div class="column"><i class="thumbtack icon"
|
|
data-search-terms="coordinates, location, marker, pin, thumb-tack"></i>thumbtack</div>
|
|
<div class="column"><i class="ticket alternate icon"
|
|
data-search-terms="movie, pass, support, ticket"></i>ticket alternate</div>
|
|
<div class="column"><i class="toilet icon"
|
|
data-search-terms="bathroom, flush, john, loo, pee, plumbing, poop, porcelain, potty, restroom, throne, washroom, waste, wc"></i>toilet
|
|
</div>
|
|
<div class="column"><i class="toolbox icon"
|
|
data-search-terms="admin, container, fix, repair, settings, tools"></i>toolbox</div>
|
|
<div class="column"><i class="tools icon"
|
|
data-search-terms="admin, fix, repair, screwdriver, settings, tools, wrench"></i>tools</div>
|
|
<div class="column"><i class="train icon"
|
|
data-search-terms="bullet, commute, locomotive, railway, subway"></i>train</div>
|
|
<div class="column"><i class="tram icon"
|
|
data-search-terms="crossing, machine, mountains, seasonal, transportation"></i>tram</div>
|
|
<div class="column"><i class="trash icon" data-search-terms="delete, garbage, hide, remove"></i>trash
|
|
</div>
|
|
<div class="column"><i class="trash alternate icon"
|
|
data-search-terms="delete, garbage, hide, remove, trash-o"></i>trash alternate</div>
|
|
<div class="column"><i class="trash alternate outline icon"
|
|
data-search-terms="delete, garbage, hide, remove, trash-o"></i>trash alternate outline</div>
|
|
<div class="column"><i class="tree icon"
|
|
data-search-terms="bark, fall, flora, forest, nature, plant, seasonal"></i>tree</div>
|
|
<div class="column"><i class="trophy icon"
|
|
data-search-terms="achievement, award, cup, game, winner"></i>trophy</div>
|
|
<div class="column"><i class="truck icon"
|
|
data-search-terms="cargo, delivery, shipping, vehicle"></i>truck</div>
|
|
<div class="column"><i class="tv icon" data-search-terms="computer, display, monitor, television"></i>tv
|
|
</div>
|
|
<div class="column"><i class="umbrella icon"
|
|
data-search-terms="protection, rain, storm, wet"></i>umbrella</div>
|
|
<div class="column"><i class="university icon"
|
|
data-search-terms="bank, building, college, higher education - students, institution"></i>university
|
|
</div>
|
|
<div class="column"><i class="unlock icon"
|
|
data-search-terms="admin, lock, password, private, protect"></i>unlock</div>
|
|
<div class="column"><i class="unlock alternate icon"
|
|
data-search-terms="admin, lock, password, private, protect"></i>unlock alternate</div>
|
|
<div class="column"><i class="utensil spoon icon"
|
|
data-search-terms="cutlery, dining, scoop, silverware, spoon"></i>utensil spoon</div>
|
|
<div class="column"><i class="utensils icon"
|
|
data-search-terms="cutlery, dining, dinner, eat, food, fork, knife, restaurant"></i>utensils
|
|
</div>
|
|
<div class="column"><i class="wallet icon"
|
|
data-search-terms="billfold, cash, currency, money"></i>wallet</div>
|
|
<div class="column"><i class="weight icon"
|
|
data-search-terms="health, measurement, scale, weight"></i>weight</div>
|
|
<div class="column"><i class="wheelchair icon"
|
|
data-search-terms="accessible, handicap, person"></i>wheelchair</div>
|
|
<div class="column"><i class="wine glass icon"
|
|
data-search-terms="alcohol, beverage, cabernet, drink, grapes, merlot, sauvignon"></i>wine glass
|
|
</div>
|
|
<div class="column"><i class="wrench icon"
|
|
data-search-terms="construction, fix, mechanic, plumbing, settings, spanner, tool, update"></i>wrench
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Payments & Shopping</h4>
|
|
<p>Icons can represent common forms of payment and shopping actions</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="alipay icon" data-search-terms=""></i>alipay</div>
|
|
<div class="column"><i class="amazon pay icon" data-search-terms=""></i>amazon pay</div>
|
|
<div class="column"><i class="apple pay icon" data-search-terms=""></i>apple pay</div>
|
|
<div class="column"><i class="bell icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell</div>
|
|
<div class="column"><i class="bell outline icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell outline</div>
|
|
<div class="column"><i class="bitcoin icon" data-search-terms=""></i>bitcoin</div>
|
|
<div class="column"><i class="bookmark icon"
|
|
data-search-terms="favorite, marker, read, remember, save"></i>bookmark</div>
|
|
<div class="column"><i class="bookmark outline icon"
|
|
data-search-terms="favorite, marker, read, remember, save"></i>bookmark outline</div>
|
|
<div class="column"><i class="btc icon" data-search-terms=""></i>btc</div>
|
|
<div class="column"><i class="bullhorn icon"
|
|
data-search-terms="announcement, broadcast, louder, megaphone, share"></i>bullhorn</div>
|
|
<div class="column"><i class="camera icon"
|
|
data-search-terms="image, lens, photo, picture, record, shutter, video"></i>camera</div>
|
|
<div class="column"><i class="camera retro icon"
|
|
data-search-terms="image, lens, photo, picture, record, shutter, video"></i>camera retro</div>
|
|
<div class="column"><i class="cart arrow down icon"
|
|
data-search-terms="download, save, shopping"></i>cart arrow down</div>
|
|
<div class="column"><i class="cart plus icon"
|
|
data-search-terms="add, create, new, positive, shopping"></i>cart plus</div>
|
|
<div class="column"><i class="cc amazon pay icon" data-search-terms=""></i>cc amazon pay</div>
|
|
<div class="column"><i class="cc amex icon" data-search-terms="amex"></i>cc amex</div>
|
|
<div class="column"><i class="cc apple pay icon" data-search-terms=""></i>cc apple pay</div>
|
|
<div class="column"><i class="cc diners club icon" data-search-terms=""></i>cc diners club</div>
|
|
<div class="column"><i class="cc discover icon" data-search-terms=""></i>cc discover</div>
|
|
<div class="column"><i class="cc jcb icon" data-search-terms=""></i>cc jcb</div>
|
|
<div class="column"><i class="cc mastercard icon" data-search-terms=""></i>cc mastercard</div>
|
|
<div class="column"><i class="cc paypal icon" data-search-terms=""></i>cc paypal</div>
|
|
<div class="column"><i class="cc stripe icon" data-search-terms=""></i>cc stripe</div>
|
|
<div class="column"><i class="cc visa icon" data-search-terms=""></i>cc visa</div>
|
|
<div class="column"><i class="certificate icon"
|
|
data-search-terms="badge, star, verified"></i>certificate</div>
|
|
<div class="column"><i class="credit card icon"
|
|
data-search-terms="buy, checkout, credit-card-alt, debit, money, payment, purchase"></i>credit
|
|
card</div>
|
|
<div class="column"><i class="credit card outline icon"
|
|
data-search-terms="buy, checkout, credit-card-alt, debit, money, payment, purchase"></i>credit
|
|
card outline</div>
|
|
<div class="column"><i class="ethereum icon" data-search-terms=""></i>ethereum</div>
|
|
<div class="column"><i class="gem icon"
|
|
data-search-terms="diamond, jewelry, sapphire, stone, treasure"></i>gem</div>
|
|
<div class="column"><i class="gem outline icon"
|
|
data-search-terms="diamond, jewelry, sapphire, stone, treasure"></i>gem outline</div>
|
|
<div class="column"><i class="gift icon"
|
|
data-search-terms="christmas, generosity, giving, holiday, party, present, wrapped, xmas"></i>gift
|
|
</div>
|
|
<div class="column"><i class="google pay icon" data-search-terms=""></i>google pay</div>
|
|
<div class="column"><i class="google wallet icon" data-search-terms=""></i>google wallet</div>
|
|
<div class="column"><i class="handshake icon"
|
|
data-search-terms="agreement, greeting, meeting, partnership"></i>handshake</div>
|
|
<div class="column"><i class="handshake outline icon"
|
|
data-search-terms="agreement, greeting, meeting, partnership"></i>handshake outline</div>
|
|
<div class="column"><i class="heart icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart</div>
|
|
<div class="column"><i class="heart outline icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart outline</div>
|
|
<div class="column"><i class="key icon"
|
|
data-search-terms="lock, password, private, secret, unlock"></i>key</div>
|
|
<div class="column"><i class="money check icon"
|
|
data-search-terms="bank check, buy, checkout, cheque, money, payment, price, purchase"></i>money
|
|
check</div>
|
|
<div class="column"><i class="money check alternate icon"
|
|
data-search-terms="bank check, buy, checkout, cheque, money, payment, price, purchase"></i>money
|
|
check alternate</div>
|
|
<div class="column"><i class="paypal icon" data-search-terms=""></i>paypal</div>
|
|
<div class="column"><i class="receipt icon"
|
|
data-search-terms="check, invoice, money, pay, table"></i>receipt</div>
|
|
<div class="column"><i class="shopping bag icon"
|
|
data-search-terms="buy, checkout, grocery, payment, purchase"></i>shopping bag</div>
|
|
<div class="column"><i class="shopping basket icon"
|
|
data-search-terms="buy, checkout, grocery, payment, purchase"></i>shopping basket</div>
|
|
<div class="column"><i class="shopping cart icon"
|
|
data-search-terms="buy, checkout, grocery, payment, purchase"></i>shopping cart</div>
|
|
<div class="column"><i class="star icon"
|
|
data-search-terms="achievement, award, favorite, important, night, rating, score"></i>star</div>
|
|
<div class="column"><i class="star outline icon"
|
|
data-search-terms="achievement, award, favorite, important, night, rating, score"></i>star
|
|
outline</div>
|
|
<div class="column"><i class="stripe icon" data-search-terms=""></i>stripe</div>
|
|
<div class="column"><i class="stripe s icon" data-search-terms=""></i>stripe s</div>
|
|
<div class="column"><i class="tag icon" data-search-terms="discount, label, price, shopping"></i>tag
|
|
</div>
|
|
<div class="column"><i class="tags icon" data-search-terms="discount, label, price, shopping"></i>tags
|
|
</div>
|
|
<div class="column"><i class="thumbs down icon"
|
|
data-search-terms="disagree, disapprove, dislike, hand, social, thumbs-o-down"></i>thumbs down
|
|
</div>
|
|
<div class="column"><i class="thumbs down outline icon"
|
|
data-search-terms="disagree, disapprove, dislike, hand, social, thumbs-o-down"></i>thumbs down
|
|
outline</div>
|
|
<div class="column"><i class="thumbs up icon"
|
|
data-search-terms="agree, approve, favorite, hand, like, ok, okay, social, success, thumbs-o-up, yes, you got it dude"></i>thumbs
|
|
up</div>
|
|
<div class="column"><i class="thumbs up outline icon"
|
|
data-search-terms="agree, approve, favorite, hand, like, ok, okay, social, success, thumbs-o-up, yes, you got it dude"></i>thumbs
|
|
up outline</div>
|
|
<div class="column"><i class="trophy icon"
|
|
data-search-terms="achievement, award, cup, game, winner"></i>trophy</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Pharmacy</h4>
|
|
<p>Icons which represent pharmaceutical items and activities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="band aid icon"
|
|
data-search-terms="bandage, boo boo, first aid, ouch"></i>band aid</div>
|
|
<div class="column"><i class="book medical icon"
|
|
data-search-terms="diary, documentation, health, history, journal, library, read, record"></i>book
|
|
medical</div>
|
|
<div class="column"><i class="cannabis icon"
|
|
data-search-terms="bud, chronic, drugs, endica, endo, ganja, marijuana, mary jane, pot, reefer, sativa, spliff, weed, whacky-tabacky"></i>cannabis
|
|
</div>
|
|
<div class="column"><i class="capsules icon"
|
|
data-search-terms="drugs, medicine, pills, prescription"></i>capsules</div>
|
|
<div class="column"><i class="clinic medical icon"
|
|
data-search-terms="covid-19, doctor, general practitioner, hospital, infirmary, medicine, office, outpatient"></i>clinic
|
|
medical</div>
|
|
<div class="column"><i class="disease icon"
|
|
data-search-terms="bacteria, cancer, covid-19, illness, infection, sickness, virus"></i>disease
|
|
</div>
|
|
<div class="column"><i class="eye dropper icon"
|
|
data-search-terms="beaker, clone, color, copy, eyedropper, pipette"></i>eye dropper</div>
|
|
<div class="column"><i class="file medical icon"
|
|
data-search-terms="document, health, history, prescription, record"></i>file medical</div>
|
|
<div class="column"><i class="file prescription icon"
|
|
data-search-terms="document, drugs, medical, medicine, rx"></i>file prescription</div>
|
|
<div class="column"><i class="first aid icon"
|
|
data-search-terms="emergency, emt, health, medical, rescue"></i>first aid</div>
|
|
<div class="column"><i class="flask icon"
|
|
data-search-terms="beaker, experimental, labs, science"></i>flask</div>
|
|
<div class="column"><i class="history icon"
|
|
data-search-terms="Rewind, clock, reverse, time, time machine"></i>history</div>
|
|
<div class="column"><i class="joint icon"
|
|
data-search-terms="blunt, cannabis, doobie, drugs, marijuana, roach, smoke, smoking, spliff"></i>joint
|
|
</div>
|
|
<div class="column"><i class="laptop medical icon"
|
|
data-search-terms="computer, device, ehr, electronic health records, history"></i>laptop medical
|
|
</div>
|
|
<div class="column"><i class="mortar pestle icon"
|
|
data-search-terms="crush, culinary, grind, medical, mix, pharmacy, prescription, spices"></i>mortar
|
|
pestle</div>
|
|
<div class="column"><i class="notes medical icon"
|
|
data-search-terms="clipboard, doctor, ehr, health, history, records"></i>notes medical</div>
|
|
<div class="column"><i class="pills icon"
|
|
data-search-terms="drugs, medicine, prescription, tablets"></i>pills</div>
|
|
<div class="column"><i class="prescription icon"
|
|
data-search-terms="drugs, medical, medicine, pharmacy, rx"></i>prescription</div>
|
|
<div class="column"><i class="prescription bottle icon"
|
|
data-search-terms="drugs, medical, medicine, pharmacy, rx"></i>prescription bottle</div>
|
|
<div class="column"><i class="prescription bottle alternate icon"
|
|
data-search-terms="drugs, medical, medicine, pharmacy, rx"></i>prescription bottle alternate
|
|
</div>
|
|
<div class="column"><i class="receipt icon"
|
|
data-search-terms="check, invoice, money, pay, table"></i>receipt</div>
|
|
<div class="column"><i class="skull crossbones icon"
|
|
data-search-terms="Dungeons & Dragons, alert, bones, d&d, danger, dead, deadly, death, dnd, fantasy, halloween, holiday, jolly-roger, pirate, poison, skeleton, warning"></i>skull
|
|
crossbones</div>
|
|
<div class="column"><i class="syringe icon"
|
|
data-search-terms="covid-19, doctor, immunizations, medical, needle"></i>syringe</div>
|
|
<div class="column"><i class="tablets icon"
|
|
data-search-terms="drugs, medicine, pills, prescription"></i>tablets</div>
|
|
<div class="column"><i class="thermometer icon"
|
|
data-search-terms="covid-19, mercury, status, temperature"></i>thermometer</div>
|
|
<div class="column"><i class="vial icon"
|
|
data-search-terms="experiment, lab, sample, science, test, test tube"></i>vial</div>
|
|
<div class="column"><i class="vials icon"
|
|
data-search-terms="experiment, lab, sample, science, test, test tube"></i>vials</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Political</h4>
|
|
<p>Icons which represent political activities and actions</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="award icon"
|
|
data-search-terms="honor, praise, prize, recognition, ribbon, trophy"></i>award</div>
|
|
<div class="column"><i class="balance scale icon"
|
|
data-search-terms="balanced, justice, legal, measure, weight"></i>balance scale</div>
|
|
<div class="column"><i class="balance scale left icon"
|
|
data-search-terms="justice, legal, measure, unbalanced, weight"></i>balance scale left</div>
|
|
<div class="column"><i class="balance scale right icon"
|
|
data-search-terms="justice, legal, measure, unbalanced, weight"></i>balance scale right</div>
|
|
<div class="column"><i class="bullhorn icon"
|
|
data-search-terms="announcement, broadcast, louder, megaphone, share"></i>bullhorn</div>
|
|
<div class="column"><i class="check double icon"
|
|
data-search-terms="accept, agree, checkmark, confirm, correct, done, notice, notification, notify, ok, select, success, tick, todo"></i>check
|
|
double</div>
|
|
<div class="column"><i class="democrat icon"
|
|
data-search-terms="american, democratic party, donkey, election, left, left-wing, liberal, politics, usa"></i>democrat
|
|
</div>
|
|
<div class="column"><i class="donate icon"
|
|
data-search-terms="contribute, generosity, gift, give"></i>donate</div>
|
|
<div class="column"><i class="dove icon" data-search-terms="bird, fauna, flying, peace, war"></i>dove
|
|
</div>
|
|
<div class="column"><i class="fist raised icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, hand, ki, monk, resist, strength, unarmed combat"></i>fist
|
|
raised</div>
|
|
<div class="column"><i class="flag usa icon"
|
|
data-search-terms="betsy ross, country, old glory, stars, stripes, symbol"></i>flag usa</div>
|
|
<div class="column"><i class="handshake icon"
|
|
data-search-terms="agreement, greeting, meeting, partnership"></i>handshake</div>
|
|
<div class="column"><i class="handshake outline icon"
|
|
data-search-terms="agreement, greeting, meeting, partnership"></i>handshake outline</div>
|
|
<div class="column"><i class="person booth icon"
|
|
data-search-terms="changing, changing room, election, human, person, vote, voting"></i>person
|
|
booth</div>
|
|
<div class="column"><i class="piggy bank icon" data-search-terms="bank, save, savings"></i>piggy bank
|
|
</div>
|
|
<div class="column"><i class="republican icon"
|
|
data-search-terms="american, conservative, election, elephant, politics, republican party, right, right-wing, usa"></i>republican
|
|
</div>
|
|
<div class="column"><i class="vote yea icon"
|
|
data-search-terms="accept, cast, election, politics, positive, yes"></i>vote yea</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Religion</h4>
|
|
<p>Icons which represent religious activities and symbols</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="ankh icon"
|
|
data-search-terms="amulet, copper, coptic christianity, copts, crux ansata, egypt, venus"></i>ankh
|
|
</div>
|
|
<div class="column"><i class="atom icon"
|
|
data-search-terms="atheism, chemistry, electron, ion, isotope, neutron, nuclear, proton, science"></i>atom
|
|
</div>
|
|
<div class="column"><i class="bahai icon" data-search-terms="bahai, bahá'í, star"></i>bahai</div>
|
|
<div class="column"><i class="bible icon"
|
|
data-search-terms="book, catholicism, christianity, god, holy"></i>bible</div>
|
|
<div class="column"><i class="church icon"
|
|
data-search-terms="building, cathedral, chapel, community, religion"></i>church</div>
|
|
<div class="column"><i class="cross icon"
|
|
data-search-terms="catholicism, christianity, church, jesus"></i>cross</div>
|
|
<div class="column"><i class="dharmachakra icon"
|
|
data-search-terms="buddhism, buddhist, wheel of dharma"></i>dharmachakra</div>
|
|
<div class="column"><i class="dove icon" data-search-terms="bird, fauna, flying, peace, war"></i>dove
|
|
</div>
|
|
<div class="column"><i class="gopuram icon"
|
|
data-search-terms="building, entrance, hinduism, temple, tower"></i>gopuram</div>
|
|
<div class="column"><i class="hamsa icon"
|
|
data-search-terms="amulet, christianity, islam, jewish, judaism, muslim, protection"></i>hamsa
|
|
</div>
|
|
<div class="column"><i class="hanukiah icon"
|
|
data-search-terms="candle, hanukkah, jewish, judaism, light"></i>hanukiah</div>
|
|
<div class="column"><i class="jedi icon"
|
|
data-search-terms="crest, force, sith, skywalker, star wars, yoda"></i>jedi</div>
|
|
<div class="column"><i class="journal whills icon"
|
|
data-search-terms="book, force, jedi, sith, star wars, yoda"></i>journal whills</div>
|
|
<div class="column"><i class="kaaba icon" data-search-terms="building, cube, islam, muslim"></i>kaaba
|
|
</div>
|
|
<div class="column"><i class="khanda icon" data-search-terms="chakkar, sikh, sikhism, sword"></i>khanda
|
|
</div>
|
|
<div class="column"><i class="menorah icon"
|
|
data-search-terms="candle, hanukkah, jewish, judaism, light"></i>menorah</div>
|
|
<div class="column"><i class="mosque icon"
|
|
data-search-terms="building, islam, landmark, muslim"></i>mosque</div>
|
|
<div class="column"><i class="om icon" data-search-terms="buddhism, hinduism, jainism, mantra"></i>om
|
|
</div>
|
|
<div class="column"><i class="pastafarianism icon"
|
|
data-search-terms="agnosticism, atheism, flying spaghetti monster, fsm"></i>pastafarianism</div>
|
|
<div class="column"><i class="peace icon"
|
|
data-search-terms="serenity, tranquility, truce, war"></i>peace</div>
|
|
<div class="column"><i class="place of worship icon"
|
|
data-search-terms="building, church, holy, mosque, synagogue"></i>place of worship</div>
|
|
<div class="column"><i class="pray icon" data-search-terms="kneel, preach, religion, worship"></i>pray
|
|
</div>
|
|
<div class="column"><i class="praying hands icon"
|
|
data-search-terms="kneel, preach, religion, worship"></i>praying hands</div>
|
|
<div class="column"><i class="quran icon" data-search-terms="book, islam, muslim, religion"></i>quran
|
|
</div>
|
|
<div class="column"><i class="star and crescent icon"
|
|
data-search-terms="islam, muslim, religion"></i>star and crescent</div>
|
|
<div class="column"><i class="star of david icon" data-search-terms="jewish, judaism, religion"></i>star
|
|
of david</div>
|
|
<div class="column"><i class="synagogue icon"
|
|
data-search-terms="building, jewish, judaism, religion, star of david, temple"></i>synagogue
|
|
</div>
|
|
<div class="column"><i class="torah icon"
|
|
data-search-terms="book, jewish, judaism, religion, scroll"></i>torah</div>
|
|
<div class="column"><i class="torii gate icon" data-search-terms="building, shintoism"></i>torii gate
|
|
</div>
|
|
<div class="column"><i class="vihara icon"
|
|
data-search-terms="buddhism, buddhist, building, monastery"></i>vihara</div>
|
|
<div class="column"><i class="yin yang icon" data-search-terms="daoism, opposites, taoism"></i>yin yang
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Science</h4>
|
|
<p>Icons which represent science activities and items</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="atom icon"
|
|
data-search-terms="atheism, chemistry, electron, ion, isotope, neutron, nuclear, proton, science"></i>atom
|
|
</div>
|
|
<div class="column"><i class="biohazard icon"
|
|
data-search-terms="covid-19, danger, dangerous, hazmat, medical, radioactive, toxic, waste, zombie"></i>biohazard
|
|
</div>
|
|
<div class="column"><i class="brain icon"
|
|
data-search-terms="cerebellum, gray matter, intellect, medulla oblongata, mind, noodle, wit"></i>brain
|
|
</div>
|
|
<div class="column"><i class="burn icon"
|
|
data-search-terms="caliente, energy, fire, flame, gas, heat, hot"></i>burn</div>
|
|
<div class="column"><i class="capsules icon"
|
|
data-search-terms="drugs, medicine, pills, prescription"></i>capsules</div>
|
|
<div class="column"><i class="clipboard check icon"
|
|
data-search-terms="accept, agree, confirm, done, ok, select, success, tick, todo, yes"></i>clipboard
|
|
check</div>
|
|
<div class="column"><i class="disease icon"
|
|
data-search-terms="bacteria, cancer, covid-19, illness, infection, sickness, virus"></i>disease
|
|
</div>
|
|
<div class="column"><i class="dna icon"
|
|
data-search-terms="double helix, genetic, helix, molecule, protein"></i>dna</div>
|
|
<div class="column"><i class="eye dropper icon"
|
|
data-search-terms="beaker, clone, color, copy, eyedropper, pipette"></i>eye dropper</div>
|
|
<div class="column"><i class="filter icon"
|
|
data-search-terms="funnel, options, separate, sort"></i>filter</div>
|
|
<div class="column"><i class="fire icon"
|
|
data-search-terms="burn, caliente, flame, heat, hot, popular"></i>fire</div>
|
|
<div class="column"><i class="fire alternate icon"
|
|
data-search-terms="burn, caliente, flame, heat, hot, popular"></i>fire alternate</div>
|
|
<div class="column"><i class="flask icon"
|
|
data-search-terms="beaker, experimental, labs, science"></i>flask</div>
|
|
<div class="column"><i class="frog icon"
|
|
data-search-terms="amphibian, bullfrog, fauna, hop, kermit, kiss, prince, ribbit, toad, wart"></i>frog
|
|
</div>
|
|
<div class="column"><i class="magnet icon" data-search-terms="Attract, lodestone, tool"></i>magnet</div>
|
|
<div class="column"><i class="microscope icon"
|
|
data-search-terms="covid-19, electron, lens, optics, science, shrink"></i>microscope</div>
|
|
<div class="column"><i class="mortar pestle icon"
|
|
data-search-terms="crush, culinary, grind, medical, mix, pharmacy, prescription, spices"></i>mortar
|
|
pestle</div>
|
|
<div class="column"><i class="pills icon"
|
|
data-search-terms="drugs, medicine, prescription, tablets"></i>pills</div>
|
|
<div class="column"><i class="prescription bottle icon"
|
|
data-search-terms="drugs, medical, medicine, pharmacy, rx"></i>prescription bottle</div>
|
|
<div class="column"><i class="radiation icon"
|
|
data-search-terms="danger, dangerous, deadly, hazard, nuclear, radioactive, warning"></i>radiation
|
|
</div>
|
|
<div class="column"><i class="radiation alternate icon"
|
|
data-search-terms="danger, dangerous, deadly, hazard, nuclear, radioactive, warning"></i>radiation
|
|
alternate</div>
|
|
<div class="column"><i class="seedling icon" data-search-terms="flora, grow, plant, vegan"></i>seedling
|
|
</div>
|
|
<div class="column"><i class="skull crossbones icon"
|
|
data-search-terms="Dungeons & Dragons, alert, bones, d&d, danger, dead, deadly, death, dnd, fantasy, halloween, holiday, jolly-roger, pirate, poison, skeleton, warning"></i>skull
|
|
crossbones</div>
|
|
<div class="column"><i class="syringe icon"
|
|
data-search-terms="covid-19, doctor, immunizations, medical, needle"></i>syringe</div>
|
|
<div class="column"><i class="tablets icon"
|
|
data-search-terms="drugs, medicine, pills, prescription"></i>tablets</div>
|
|
<div class="column"><i class="temperature high icon"
|
|
data-search-terms="cook, covid-19, mercury, summer, thermometer, warm"></i>temperature high
|
|
</div>
|
|
<div class="column"><i class="temperature low icon"
|
|
data-search-terms="cold, cool, covid-19, mercury, thermometer, winter"></i>temperature low</div>
|
|
<div class="column"><i class="vial icon"
|
|
data-search-terms="experiment, lab, sample, science, test, test tube"></i>vial</div>
|
|
<div class="column"><i class="vials icon"
|
|
data-search-terms="experiment, lab, sample, science, test, test tube"></i>vials</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Science Fiction</h4>
|
|
<p>Icons which represent science fiction story items</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="atom icon"
|
|
data-search-terms="atheism, chemistry, electron, ion, isotope, neutron, nuclear, proton, science"></i>atom
|
|
</div>
|
|
<div class="column"><i class="galactic republic icon"
|
|
data-search-terms="politics, star wars"></i>galactic republic</div>
|
|
<div class="column"><i class="galactic senate icon" data-search-terms="star wars"></i>galactic senate
|
|
</div>
|
|
<div class="column"><i class="globe icon"
|
|
data-search-terms="all, coordinates, country, earth, global, gps, language, localize, location, map, online, place, planet, translate, travel, world"></i>globe
|
|
</div>
|
|
<div class="column"><i class="hand spock icon"
|
|
data-search-terms="live long, prosper, salute, star trek, vulcan"></i>hand spock</div>
|
|
<div class="column"><i class="hand spock outline icon"
|
|
data-search-terms="live long, prosper, salute, star trek, vulcan"></i>hand spock outline</div>
|
|
<div class="column"><i class="jedi icon"
|
|
data-search-terms="crest, force, sith, skywalker, star wars, yoda"></i>jedi</div>
|
|
<div class="column"><i class="jedi order icon" data-search-terms="star wars"></i>jedi order</div>
|
|
<div class="column"><i class="journal whills icon"
|
|
data-search-terms="book, force, jedi, sith, star wars, yoda"></i>journal whills</div>
|
|
<div class="column"><i class="meteor icon"
|
|
data-search-terms="armageddon, asteroid, comet, shooting star, space"></i>meteor</div>
|
|
<div class="column"><i class="moon icon"
|
|
data-search-terms="contrast, crescent, dark, lunar, night"></i>moon</div>
|
|
<div class="column"><i class="moon outline icon"
|
|
data-search-terms="contrast, crescent, dark, lunar, night"></i>moon outline</div>
|
|
<div class="column"><i class="old republic icon" data-search-terms="politics, star wars"></i>old
|
|
republic</div>
|
|
<div class="column"><i class="robot icon"
|
|
data-search-terms="android, automate, computer, cyborg"></i>robot</div>
|
|
<div class="column"><i class="rocket icon"
|
|
data-search-terms="aircraft, app, jet, launch, nasa, space"></i>rocket</div>
|
|
<div class="column"><i class="satellite icon"
|
|
data-search-terms="communications, hardware, orbit, space"></i>satellite</div>
|
|
<div class="column"><i class="satellite dish icon"
|
|
data-search-terms="SETI, communications, hardware, receiver, saucer, signal, space"></i>satellite
|
|
dish</div>
|
|
<div class="column"><i class="space shuttle icon"
|
|
data-search-terms="astronaut, machine, nasa, rocket, space, transportation"></i>space shuttle
|
|
</div>
|
|
<div class="column"><i class="user astronaut icon"
|
|
data-search-terms="avatar, clothing, cosmonaut, nasa, space, suit"></i>user astronaut</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Security</h4>
|
|
<p>Icons which represent security items and activities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="ban icon"
|
|
data-search-terms="abort, ban, block, cancel, delete, hide, prohibit, remove, stop, trash"></i>ban
|
|
</div>
|
|
<div class="column"><i class="bug icon" data-search-terms="beetle, error, insect, report"></i>bug</div>
|
|
<div class="column"><i class="door closed icon" data-search-terms="enter, exit, locked"></i>door closed
|
|
</div>
|
|
<div class="column"><i class="door open icon" data-search-terms="enter, exit, welcome"></i>door open
|
|
</div>
|
|
<div class="column"><i class="dungeon icon"
|
|
data-search-terms="Dungeons & Dragons, building, d&d, dnd, door, entrance, fantasy, gate"></i>dungeon
|
|
</div>
|
|
<div class="column"><i class="eye icon"
|
|
data-search-terms="look, optic, see, seen, show, sight, views, visible"></i>eye</div>
|
|
<div class="column"><i class="eye outline icon"
|
|
data-search-terms="look, optic, see, seen, show, sight, views, visible"></i>eye outline</div>
|
|
<div class="column"><i class="eye slash icon"
|
|
data-search-terms="blind, hide, show, toggle, unseen, views, visible, visiblity"></i>eye slash
|
|
</div>
|
|
<div class="column"><i class="eye slash outline icon"
|
|
data-search-terms="blind, hide, show, toggle, unseen, views, visible, visiblity"></i>eye slash
|
|
outline</div>
|
|
<div class="column"><i class="file contract icon"
|
|
data-search-terms="agreement, binding, document, legal, signature"></i>file contract</div>
|
|
<div class="column"><i class="file signature icon"
|
|
data-search-terms="John Hancock, contract, document, name"></i>file signature</div>
|
|
<div class="column"><i class="fingerprint icon"
|
|
data-search-terms="human, id, identification, lock, smudge, touch, unique, unlock"></i>fingerprint
|
|
</div>
|
|
<div class="column"><i class="id badge icon"
|
|
data-search-terms="address, contact, identification, license, profile"></i>id badge</div>
|
|
<div class="column"><i class="id badge outline icon"
|
|
data-search-terms="address, contact, identification, license, profile"></i>id badge outline
|
|
</div>
|
|
<div class="column"><i class="id card icon"
|
|
data-search-terms="contact, demographics, document, identification, issued, profile"></i>id card
|
|
</div>
|
|
<div class="column"><i class="id card alternate icon"
|
|
data-search-terms="contact, demographics, document, identification, issued, profile"></i>id card
|
|
alternate</div>
|
|
<div class="column"><i class="id card outline icon"
|
|
data-search-terms="contact, demographics, document, identification, issued, profile"></i>id card
|
|
outline</div>
|
|
<div class="column"><i class="key icon"
|
|
data-search-terms="lock, password, private, secret, unlock"></i>key</div>
|
|
<div class="column"><i class="lock icon"
|
|
data-search-terms="admin, lock, open, password, private, protect, security"></i>lock</div>
|
|
<div class="column"><i class="lock open icon"
|
|
data-search-terms="admin, lock, open, password, private, protect, security"></i>lock open</div>
|
|
<div class="column"><i class="mask icon"
|
|
data-search-terms="carnivale, costume, disguise, halloween, secret, super hero"></i>mask</div>
|
|
<div class="column"><i class="passport icon"
|
|
data-search-terms="document, id, identification, issued, travel"></i>passport</div>
|
|
<div class="column"><i class="shield alternate icon"
|
|
data-search-terms="achievement, award, block, defend, security, winner"></i>shield alternate
|
|
</div>
|
|
<div class="column"><i class="unlock icon"
|
|
data-search-terms="admin, lock, password, private, protect"></i>unlock</div>
|
|
<div class="column"><i class="unlock alternate icon"
|
|
data-search-terms="admin, lock, password, private, protect"></i>unlock alternate</div>
|
|
<div class="column"><i class="user lock icon"
|
|
data-search-terms="admin, lock, person, private, unlock"></i>user lock</div>
|
|
<div class="column"><i class="user secret icon"
|
|
data-search-terms="clothing, coat, hat, incognito, person, privacy, spy, whisper"></i>user
|
|
secret</div>
|
|
<div class="column"><i class="user shield icon"
|
|
data-search-terms="admin, person, private, protect, safe"></i>user shield</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Shapes</h4>
|
|
<p>Icons can be used to create shapes</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="bookmark icon"
|
|
data-search-terms="favorite, marker, read, remember, save"></i>bookmark</div>
|
|
<div class="column"><i class="bookmark outline icon"
|
|
data-search-terms="favorite, marker, read, remember, save"></i>bookmark outline</div>
|
|
<div class="column"><i class="calendar icon"
|
|
data-search-terms="calendar-o, date, event, schedule, time, when"></i>calendar</div>
|
|
<div class="column"><i class="calendar outline icon"
|
|
data-search-terms="calendar-o, date, event, schedule, time, when"></i>calendar outline</div>
|
|
<div class="column"><i class="certificate icon"
|
|
data-search-terms="badge, star, verified"></i>certificate</div>
|
|
<div class="column"><i class="circle icon"
|
|
data-search-terms="circle-thin, diameter, dot, ellipse, notification, round"></i>circle</div>
|
|
<div class="column"><i class="circle outline icon"
|
|
data-search-terms="circle-thin, diameter, dot, ellipse, notification, round"></i>circle outline
|
|
</div>
|
|
<div class="column"><i class="cloud icon"
|
|
data-search-terms="atmosphere, fog, overcast, save, upload, weather"></i>cloud</div>
|
|
<div class="column"><i class="comment icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
</div>
|
|
<div class="column"><i class="comment outline icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
outline</div>
|
|
<div class="column"><i class="file icon" data-search-terms="document, new, page, pdf, resume"></i>file
|
|
</div>
|
|
<div class="column"><i class="file outline icon"
|
|
data-search-terms="document, new, page, pdf, resume"></i>file outline</div>
|
|
<div class="column"><i class="folder icon"
|
|
data-search-terms="archive, directory, document, file"></i>folder</div>
|
|
<div class="column"><i class="folder outline icon"
|
|
data-search-terms="archive, directory, document, file"></i>folder outline</div>
|
|
<div class="column"><i class="heart icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart</div>
|
|
<div class="column"><i class="heart broken icon"
|
|
data-search-terms="breakup, crushed, dislike, dumped, grief, love, lovesick, relationship, sad"></i>heart
|
|
broken</div>
|
|
<div class="column"><i class="heart outline icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart outline</div>
|
|
<div class="column"><i class="map marker icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
marker</div>
|
|
<div class="column"><i class="play icon"
|
|
data-search-terms="audio, music, playing, sound, start, video"></i>play</div>
|
|
<div class="column"><i class="shapes icon"
|
|
data-search-terms="blocks, build, circle, square, triangle"></i>shapes</div>
|
|
<div class="column"><i class="square icon" data-search-terms="block, box, shape"></i>square</div>
|
|
<div class="column"><i class="square outline icon" data-search-terms="block, box, shape"></i>square
|
|
outline</div>
|
|
<div class="column"><i class="star icon"
|
|
data-search-terms="achievement, award, favorite, important, night, rating, score"></i>star</div>
|
|
<div class="column"><i class="star outline icon"
|
|
data-search-terms="achievement, award, favorite, important, night, rating, score"></i>star
|
|
outline</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Shopping</h4>
|
|
<p>Icons which represent shopping activities and actions</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="barcode icon"
|
|
data-search-terms="info, laser, price, scan, upc"></i>barcode</div>
|
|
<div class="column"><i class="cart arrow down icon"
|
|
data-search-terms="download, save, shopping"></i>cart arrow down</div>
|
|
<div class="column"><i class="cart plus icon"
|
|
data-search-terms="add, create, new, positive, shopping"></i>cart plus</div>
|
|
<div class="column"><i class="cash register icon"
|
|
data-search-terms="buy, cha-ching, change, checkout, commerce, leaerboard, machine, pay, payment, purchase, store"></i>cash
|
|
register</div>
|
|
<div class="column"><i class="gift icon"
|
|
data-search-terms="christmas, generosity, giving, holiday, party, present, wrapped, xmas"></i>gift
|
|
</div>
|
|
<div class="column"><i class="gifts icon"
|
|
data-search-terms="christmas, generosity, giving, holiday, party, present, wrapped, xmas"></i>gifts
|
|
</div>
|
|
<div class="column"><i class="person booth icon"
|
|
data-search-terms="changing, changing room, election, human, person, vote, voting"></i>person
|
|
booth</div>
|
|
<div class="column"><i class="receipt icon"
|
|
data-search-terms="check, invoice, money, pay, table"></i>receipt</div>
|
|
<div class="column"><i class="shipping fast icon"
|
|
data-search-terms="express, fedex, mail, overnight, package, ups"></i>shipping fast</div>
|
|
<div class="column"><i class="shopping bag icon"
|
|
data-search-terms="buy, checkout, grocery, payment, purchase"></i>shopping bag</div>
|
|
<div class="column"><i class="shopping basket icon"
|
|
data-search-terms="buy, checkout, grocery, payment, purchase"></i>shopping basket</div>
|
|
<div class="column"><i class="shopping cart icon"
|
|
data-search-terms="buy, checkout, grocery, payment, purchase"></i>shopping cart</div>
|
|
<div class="column"><i class="store icon"
|
|
data-search-terms="building, buy, purchase, shopping"></i>store</div>
|
|
<div class="column"><i class="store alternate icon"
|
|
data-search-terms="building, buy, purchase, shopping"></i>store alternate</div>
|
|
<div class="column"><i class="store alternate slash icon"
|
|
data-search-terms="building, buy, closed, covid-19, purchase, shopping"></i>store alternate
|
|
slash</div>
|
|
<div class="column"><i class="store slash icon"
|
|
data-search-terms="building, buy, closed, covid-19, purchase, shopping"></i>store slash</div>
|
|
<div class="column"><i class="truck icon"
|
|
data-search-terms="cargo, delivery, shipping, vehicle"></i>truck</div>
|
|
<div class="column"><i class="tshirt icon"
|
|
data-search-terms="clothing, fashion, garment, shirt"></i>tshirt</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Social</h4>
|
|
<p>Icons which represent social actions</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="bell icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell</div>
|
|
<div class="column"><i class="bell outline icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell outline</div>
|
|
<div class="column"><i class="birthday cake icon"
|
|
data-search-terms="anniversary, bakery, candles, celebration, dessert, frosting, holiday, party, pastry"></i>birthday
|
|
cake</div>
|
|
<div class="column"><i class="camera icon"
|
|
data-search-terms="image, lens, photo, picture, record, shutter, video"></i>camera</div>
|
|
<div class="column"><i class="comment icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
</div>
|
|
<div class="column"><i class="comment alternate icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
alternate</div>
|
|
<div class="column"><i class="comment alternate outline icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
alternate outline</div>
|
|
<div class="column"><i class="comment outline icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
outline</div>
|
|
<div class="column"><i class="envelope icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
</div>
|
|
<div class="column"><i class="envelope outline icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope
|
|
outline</div>
|
|
<div class="column"><i class="hashtag icon"
|
|
data-search-terms="Twitter, instagram, pound, social media, tag"></i>hashtag</div>
|
|
<div class="column"><i class="heart icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart</div>
|
|
<div class="column"><i class="heart outline icon"
|
|
data-search-terms="favorite, like, love, relationship, valentine"></i>heart outline</div>
|
|
<div class="column"><i class="icons icon"
|
|
data-search-terms="bolt, emoji, heart, image, music, photo, symbols"></i>icons</div>
|
|
<div class="column"><i class="image icon" data-search-terms="album, landscape, photo, picture"></i>image
|
|
</div>
|
|
<div class="column"><i class="image outline icon"
|
|
data-search-terms="album, landscape, photo, picture"></i>image outline</div>
|
|
<div class="column"><i class="images icon"
|
|
data-search-terms="album, landscape, photo, picture"></i>images</div>
|
|
<div class="column"><i class="images outline icon"
|
|
data-search-terms="album, landscape, photo, picture"></i>images outline</div>
|
|
<div class="column"><i class="map marker icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
marker</div>
|
|
<div class="column"><i class="map marker alternate icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
marker alternate</div>
|
|
<div class="column"><i class="photo video icon"
|
|
data-search-terms="av, film, image, library, media"></i>photo video</div>
|
|
<div class="column"><i class="poll icon"
|
|
data-search-terms="results, survey, trend, vote, voting"></i>poll</div>
|
|
<div class="column"><i class="poll horizontal icon"
|
|
data-search-terms="results, survey, trend, vote, voting"></i>poll horizontal</div>
|
|
<div class="column"><i class="retweet icon" data-search-terms="refresh, reload, share, swap"></i>retweet
|
|
</div>
|
|
<div class="column"><i class="share icon" data-search-terms="forward, save, send, social"></i>share
|
|
</div>
|
|
<div class="column"><i class="share alternate icon"
|
|
data-search-terms="forward, save, send, social"></i>share alternate</div>
|
|
<div class="column"><i class="share square icon"
|
|
data-search-terms="forward, save, send, social"></i>share square</div>
|
|
<div class="column"><i class="share square outline icon"
|
|
data-search-terms="forward, save, send, social"></i>share square outline</div>
|
|
<div class="column"><i class="star icon"
|
|
data-search-terms="achievement, award, favorite, important, night, rating, score"></i>star</div>
|
|
<div class="column"><i class="star outline icon"
|
|
data-search-terms="achievement, award, favorite, important, night, rating, score"></i>star
|
|
outline</div>
|
|
<div class="column"><i class="thumbs down icon"
|
|
data-search-terms="disagree, disapprove, dislike, hand, social, thumbs-o-down"></i>thumbs down
|
|
</div>
|
|
<div class="column"><i class="thumbs down outline icon"
|
|
data-search-terms="disagree, disapprove, dislike, hand, social, thumbs-o-down"></i>thumbs down
|
|
outline</div>
|
|
<div class="column"><i class="thumbs up icon"
|
|
data-search-terms="agree, approve, favorite, hand, like, ok, okay, social, success, thumbs-o-up, yes, you got it dude"></i>thumbs
|
|
up</div>
|
|
<div class="column"><i class="thumbs up outline icon"
|
|
data-search-terms="agree, approve, favorite, hand, like, ok, okay, social, success, thumbs-o-up, yes, you got it dude"></i>thumbs
|
|
up outline</div>
|
|
<div class="column"><i class="thumbtack icon"
|
|
data-search-terms="coordinates, location, marker, pin, thumb-tack"></i>thumbtack</div>
|
|
<div class="column"><i class="user icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user</div>
|
|
<div class="column"><i class="user circle icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user circle</div>
|
|
<div class="column"><i class="user circle outline icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user circle outline
|
|
</div>
|
|
<div class="column"><i class="user friends icon"
|
|
data-search-terms="group, people, person, team, users"></i>user friends</div>
|
|
<div class="column"><i class="user outline icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user outline</div>
|
|
<div class="column"><i class="user plus icon"
|
|
data-search-terms="add, avatar, positive, sign up, signup, team"></i>user plus</div>
|
|
<div class="column"><i class="users icon"
|
|
data-search-terms="friends, group, people, persons, profiles, team"></i>users</div>
|
|
<div class="column"><i class="video icon"
|
|
data-search-terms="camera, film, movie, record, video-camera"></i>video</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Spinners</h4>
|
|
<p>Icons can represent loading</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="asterisk icon"
|
|
data-search-terms="annotation, details, reference, star"></i>asterisk</div>
|
|
<div class="column"><i class="atom icon"
|
|
data-search-terms="atheism, chemistry, electron, ion, isotope, neutron, nuclear, proton, science"></i>atom
|
|
</div>
|
|
<div class="column"><i class="bahai icon" data-search-terms="bahai, bahá'í, star"></i>bahai</div>
|
|
<div class="column"><i class="certificate icon"
|
|
data-search-terms="badge, star, verified"></i>certificate</div>
|
|
<div class="column"><i class="circle notch icon"
|
|
data-search-terms="circle-o-notch, diameter, dot, ellipse, round, spinner"></i>circle notch
|
|
</div>
|
|
<div class="column"><i class="cog icon"
|
|
data-search-terms="gear, mechanical, settings, sprocket, wheel"></i>cog</div>
|
|
<div class="column"><i class="compact disc icon"
|
|
data-search-terms="album, bluray, cd, disc, dvd, media, movie, music, record, video, vinyl"></i>compact
|
|
disc</div>
|
|
<div class="column"><i class="compass icon"
|
|
data-search-terms="directions, directory, location, menu, navigation, safari, travel"></i>compass
|
|
</div>
|
|
<div class="column"><i class="compass outline icon"
|
|
data-search-terms="directions, directory, location, menu, navigation, safari, travel"></i>compass
|
|
outline</div>
|
|
<div class="column"><i class="crosshairs icon"
|
|
data-search-terms="aim, bullseye, gpd, picker, position"></i>crosshairs</div>
|
|
<div class="column"><i class="dharmachakra icon"
|
|
data-search-terms="buddhism, buddhist, wheel of dharma"></i>dharmachakra</div>
|
|
<div class="column"><i class="fan icon"
|
|
data-search-terms="ac, air conditioning, blade, blower, cool, hot"></i>fan</div>
|
|
<div class="column"><i class="life ring icon"
|
|
data-search-terms="coast guard, help, overboard, save, support"></i>life ring</div>
|
|
<div class="column"><i class="life ring outline icon"
|
|
data-search-terms="coast guard, help, overboard, save, support"></i>life ring outline</div>
|
|
<div class="column"><i class="palette icon"
|
|
data-search-terms="acrylic, art, brush, color, fill, paint, pigment, watercolor"></i>palette
|
|
</div>
|
|
<div class="column"><i class="ring icon"
|
|
data-search-terms="Dungeons & Dragons, Gollum, band, binding, d&d, dnd, engagement, fantasy, gold, jewelry, marriage, precious"></i>ring
|
|
</div>
|
|
<div class="column"><i class="slash icon"
|
|
data-search-terms="cancel, close, mute, off, stop, x"></i>slash</div>
|
|
<div class="column"><i class="snowflake icon"
|
|
data-search-terms="precipitation, rain, winter"></i>snowflake</div>
|
|
<div class="column"><i class="snowflake outline icon"
|
|
data-search-terms="precipitation, rain, winter"></i>snowflake outline</div>
|
|
<div class="column"><i class="spinner icon" data-search-terms="circle, loading, progress"></i>spinner
|
|
</div>
|
|
<div class="column"><i class="stroopwafel icon"
|
|
data-search-terms="caramel, cookie, dessert, sweets, waffle"></i>stroopwafel</div>
|
|
<div class="column"><i class="sun icon"
|
|
data-search-terms="brighten, contrast, day, lighter, sol, solar, star, weather"></i>sun</div>
|
|
<div class="column"><i class="sun outline icon"
|
|
data-search-terms="brighten, contrast, day, lighter, sol, solar, star, weather"></i>sun outline
|
|
</div>
|
|
<div class="column"><i class="sync icon"
|
|
data-search-terms="exchange, refresh, reload, rotate, swap"></i>sync</div>
|
|
<div class="column"><i class="sync alternate icon"
|
|
data-search-terms="exchange, refresh, reload, rotate, swap"></i>sync alternate</div>
|
|
<div class="column"><i class="yin yang icon" data-search-terms="daoism, opposites, taoism"></i>yin yang
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Sports</h4>
|
|
<p>Icons which represent sports</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="baseball ball icon"
|
|
data-search-terms="foul, hardball, league, leather, mlb, softball, sport"></i>baseball ball
|
|
</div>
|
|
<div class="column"><i class="basketball ball icon"
|
|
data-search-terms="dribble, dunk, hoop, nba"></i>basketball ball</div>
|
|
<div class="column"><i class="biking icon"
|
|
data-search-terms="bicycle, bike, cycle, cycling, ride, wheel"></i>biking</div>
|
|
<div class="column"><i class="bowling ball icon"
|
|
data-search-terms="alley, candlepin, gutter, lane, strike, tenpin"></i>bowling ball</div>
|
|
<div class="column"><i class="dumbbell icon"
|
|
data-search-terms="exercise, gym, strength, weight, weight-lifting"></i>dumbbell</div>
|
|
<div class="column"><i class="football ball icon"
|
|
data-search-terms="ball, fall, nfl, pigskin, seasonal"></i>football ball</div>
|
|
<div class="column"><i class="futbol icon" data-search-terms="ball, football, mls, soccer"></i>futbol
|
|
</div>
|
|
<div class="column"><i class="futbol outline icon"
|
|
data-search-terms="ball, football, mls, soccer"></i>futbol outline</div>
|
|
<div class="column"><i class="golf ball icon" data-search-terms="caddy, eagle, putt, tee"></i>golf ball
|
|
</div>
|
|
<div class="column"><i class="hockey puck icon" data-search-terms="ice, nhl, sport"></i>hockey puck
|
|
</div>
|
|
<div class="column"><i class="quidditch icon"
|
|
data-search-terms="ball, bludger, broom, golden snitch, harry potter, hogwarts, quaffle, sport, wizard"></i>quidditch
|
|
</div>
|
|
<div class="column"><i class="running icon"
|
|
data-search-terms="exercise, health, jog, person, run, sport, sprint"></i>running</div>
|
|
<div class="column"><i class="skating icon"
|
|
data-search-terms="activity, figure skating, fitness, ice, person, winter"></i>skating</div>
|
|
<div class="column"><i class="skiing icon"
|
|
data-search-terms="activity, downhill, fast, fitness, olympics, outdoors, person, seasonal, slalom"></i>skiing
|
|
</div>
|
|
<div class="column"><i class="skiing nordic icon"
|
|
data-search-terms="activity, cross country, fitness, outdoors, person, seasonal"></i>skiing
|
|
nordic</div>
|
|
<div class="column"><i class="snowboarding icon"
|
|
data-search-terms="activity, fitness, olympics, outdoors, person"></i>snowboarding</div>
|
|
<div class="column"><i class="swimmer icon"
|
|
data-search-terms="athlete, head, man, olympics, person, pool, water"></i>swimmer</div>
|
|
<div class="column"><i class="table tennis icon" data-search-terms="ball, paddle, ping pong"></i>table
|
|
tennis</div>
|
|
<div class="column"><i class="volleyball ball icon"
|
|
data-search-terms="beach, olympics, sport"></i>volleyball ball</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Spring</h4>
|
|
<p>Icons which represent spring activities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="allergies icon"
|
|
data-search-terms="allergy, freckles, hand, hives, pox, skin, spots"></i>allergies</div>
|
|
<div class="column"><i class="broom icon"
|
|
data-search-terms="clean, firebolt, fly, halloween, nimbus 2000, quidditch, sweep, witch"></i>broom
|
|
</div>
|
|
<div class="column"><i class="cloud sun icon"
|
|
data-search-terms="clear, day, daytime, fall, outdoors, overcast, partly cloudy"></i>cloud sun
|
|
</div>
|
|
<div class="column"><i class="cloud sun rain icon"
|
|
data-search-terms="day, overcast, precipitation, storm, summer, sunshower"></i>cloud sun rain
|
|
</div>
|
|
<div class="column"><i class="frog icon"
|
|
data-search-terms="amphibian, bullfrog, fauna, hop, kermit, kiss, prince, ribbit, toad, wart"></i>frog
|
|
</div>
|
|
<div class="column"><i class="rainbow icon"
|
|
data-search-terms="gold, leprechaun, prism, rain, sky"></i>rainbow</div>
|
|
<div class="column"><i class="seedling icon" data-search-terms="flora, grow, plant, vegan"></i>seedling
|
|
</div>
|
|
<div class="column"><i class="umbrella icon"
|
|
data-search-terms="protection, rain, storm, wet"></i>umbrella</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Status</h4>
|
|
<p>Icons can represent different states</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="ban icon"
|
|
data-search-terms="abort, ban, block, cancel, delete, hide, prohibit, remove, stop, trash"></i>ban
|
|
</div>
|
|
<div class="column"><i class="battery empty icon"
|
|
data-search-terms="charge, dead, power, status"></i>battery empty</div>
|
|
<div class="column"><i class="battery full icon" data-search-terms="charge, power, status"></i>battery
|
|
full</div>
|
|
<div class="column"><i class="battery half icon" data-search-terms="charge, power, status"></i>battery
|
|
half</div>
|
|
<div class="column"><i class="battery quarter icon"
|
|
data-search-terms="charge, low, power, status"></i>battery quarter</div>
|
|
<div class="column"><i class="battery three quarters icon"
|
|
data-search-terms="charge, power, status"></i>battery three quarters</div>
|
|
<div class="column"><i class="bell icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell</div>
|
|
<div class="column"><i class="bell outline icon"
|
|
data-search-terms="alarm, alert, chime, notification, reminder"></i>bell outline</div>
|
|
<div class="column"><i class="bell slash icon"
|
|
data-search-terms="alert, cancel, disabled, notification, off, reminder"></i>bell slash</div>
|
|
<div class="column"><i class="bell slash outline icon"
|
|
data-search-terms="alert, cancel, disabled, notification, off, reminder"></i>bell slash outline
|
|
</div>
|
|
<div class="column"><i class="calendar icon"
|
|
data-search-terms="calendar-o, date, event, schedule, time, when"></i>calendar</div>
|
|
<div class="column"><i class="calendar alternate icon"
|
|
data-search-terms="calendar, date, event, schedule, time, when"></i>calendar alternate</div>
|
|
<div class="column"><i class="calendar alternate outline icon"
|
|
data-search-terms="calendar, date, event, schedule, time, when"></i>calendar alternate outline
|
|
</div>
|
|
<div class="column"><i class="calendar check icon"
|
|
data-search-terms="accept, agree, appointment, confirm, correct, date, done, event, ok, schedule, select, success, tick, time, todo, when"></i>calendar
|
|
check</div>
|
|
<div class="column"><i class="calendar check outline icon"
|
|
data-search-terms="accept, agree, appointment, confirm, correct, date, done, event, ok, schedule, select, success, tick, time, todo, when"></i>calendar
|
|
check outline</div>
|
|
<div class="column"><i class="calendar day icon"
|
|
data-search-terms="date, detail, event, focus, schedule, single day, time, today, when"></i>calendar
|
|
day</div>
|
|
<div class="column"><i class="calendar minus icon"
|
|
data-search-terms="calendar, date, delete, event, negative, remove, schedule, time, when"></i>calendar
|
|
minus</div>
|
|
<div class="column"><i class="calendar minus outline icon"
|
|
data-search-terms="calendar, date, delete, event, negative, remove, schedule, time, when"></i>calendar
|
|
minus outline</div>
|
|
<div class="column"><i class="calendar outline icon"
|
|
data-search-terms="calendar-o, date, event, schedule, time, when"></i>calendar outline</div>
|
|
<div class="column"><i class="calendar plus icon"
|
|
data-search-terms="add, calendar, create, date, event, new, positive, schedule, time, when"></i>calendar
|
|
plus</div>
|
|
<div class="column"><i class="calendar plus outline icon"
|
|
data-search-terms="add, calendar, create, date, event, new, positive, schedule, time, when"></i>calendar
|
|
plus outline</div>
|
|
<div class="column"><i class="calendar times icon"
|
|
data-search-terms="archive, calendar, date, delete, event, remove, schedule, time, when, x"></i>calendar
|
|
times</div>
|
|
<div class="column"><i class="calendar times outline icon"
|
|
data-search-terms="archive, calendar, date, delete, event, remove, schedule, time, when, x"></i>calendar
|
|
times outline</div>
|
|
<div class="column"><i class="calendar week icon"
|
|
data-search-terms="date, detail, event, focus, schedule, single week, time, today, when"></i>calendar
|
|
week</div>
|
|
<div class="column"><i class="cart arrow down icon"
|
|
data-search-terms="download, save, shopping"></i>cart arrow down</div>
|
|
<div class="column"><i class="cart plus icon"
|
|
data-search-terms="add, create, new, positive, shopping"></i>cart plus</div>
|
|
<div class="column"><i class="comment icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
</div>
|
|
<div class="column"><i class="comment alternate icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
alternate</div>
|
|
<div class="column"><i class="comment alternate outline icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
alternate outline</div>
|
|
<div class="column"><i class="comment outline icon"
|
|
data-search-terms="bubble, chat, commenting, conversation, feedback, message, note, notification, sms, speech, texting"></i>comment
|
|
outline</div>
|
|
<div class="column"><i class="comment slash icon"
|
|
data-search-terms="bubble, cancel, chat, commenting, conversation, feedback, message, mute, note, notification, quiet, sms, speech, texting"></i>comment
|
|
slash</div>
|
|
<div class="column"><i class="compass icon"
|
|
data-search-terms="directions, directory, location, menu, navigation, safari, travel"></i>compass
|
|
</div>
|
|
<div class="column"><i class="compass outline icon"
|
|
data-search-terms="directions, directory, location, menu, navigation, safari, travel"></i>compass
|
|
outline</div>
|
|
<div class="column"><i class="door closed icon" data-search-terms="enter, exit, locked"></i>door closed
|
|
</div>
|
|
<div class="column"><i class="door open icon" data-search-terms="enter, exit, welcome"></i>door open
|
|
</div>
|
|
<div class="column"><i class="exclamation icon"
|
|
data-search-terms="alert, danger, error, important, notice, notification, notify, problem, warning"></i>exclamation
|
|
</div>
|
|
<div class="column"><i class="exclamation circle icon"
|
|
data-search-terms="alert, danger, error, important, notice, notification, notify, problem, warning"></i>exclamation
|
|
circle</div>
|
|
<div class="column"><i class="exclamation triangle icon"
|
|
data-search-terms="alert, danger, error, important, notice, notification, notify, problem, warning"></i>exclamation
|
|
triangle</div>
|
|
<div class="column"><i class="eye icon"
|
|
data-search-terms="look, optic, see, seen, show, sight, views, visible"></i>eye</div>
|
|
<div class="column"><i class="eye outline icon"
|
|
data-search-terms="look, optic, see, seen, show, sight, views, visible"></i>eye outline</div>
|
|
<div class="column"><i class="eye slash icon"
|
|
data-search-terms="blind, hide, show, toggle, unseen, views, visible, visiblity"></i>eye slash
|
|
</div>
|
|
<div class="column"><i class="eye slash outline icon"
|
|
data-search-terms="blind, hide, show, toggle, unseen, views, visible, visiblity"></i>eye slash
|
|
outline</div>
|
|
<div class="column"><i class="file icon" data-search-terms="document, new, page, pdf, resume"></i>file
|
|
</div>
|
|
<div class="column"><i class="file alternate icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate</div>
|
|
<div class="column"><i class="file alternate outline icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate outline
|
|
</div>
|
|
<div class="column"><i class="file outline icon"
|
|
data-search-terms="document, new, page, pdf, resume"></i>file outline</div>
|
|
<div class="column"><i class="folder icon"
|
|
data-search-terms="archive, directory, document, file"></i>folder</div>
|
|
<div class="column"><i class="folder open icon"
|
|
data-search-terms="archive, directory, document, empty, file, new"></i>folder open</div>
|
|
<div class="column"><i class="folder open outline icon"
|
|
data-search-terms="archive, directory, document, empty, file, new"></i>folder open outline</div>
|
|
<div class="column"><i class="folder outline icon"
|
|
data-search-terms="archive, directory, document, file"></i>folder outline</div>
|
|
<div class="column"><i class="gas pump icon" data-search-terms="car, fuel, gasoline, petrol"></i>gas
|
|
pump</div>
|
|
<div class="column"><i class="info icon"
|
|
data-search-terms="details, help, information, more, support"></i>info</div>
|
|
<div class="column"><i class="info circle icon"
|
|
data-search-terms="details, help, information, more, support"></i>info circle</div>
|
|
<div class="column"><i class="lightbulb icon"
|
|
data-search-terms="energy, idea, inspiration, light"></i>lightbulb</div>
|
|
<div class="column"><i class="lightbulb outline icon"
|
|
data-search-terms="energy, idea, inspiration, light"></i>lightbulb outline</div>
|
|
<div class="column"><i class="lock icon"
|
|
data-search-terms="admin, lock, open, password, private, protect, security"></i>lock</div>
|
|
<div class="column"><i class="lock open icon"
|
|
data-search-terms="admin, lock, open, password, private, protect, security"></i>lock open</div>
|
|
<div class="column"><i class="map marker icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
marker</div>
|
|
<div class="column"><i class="map marker alternate icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
marker alternate</div>
|
|
<div class="column"><i class="microphone icon"
|
|
data-search-terms="audio, podcast, record, sing, sound, voice"></i>microphone</div>
|
|
<div class="column"><i class="microphone alternate icon"
|
|
data-search-terms="audio, podcast, record, sing, sound, voice"></i>microphone alternate</div>
|
|
<div class="column"><i class="microphone alternate slash icon"
|
|
data-search-terms="audio, disable, mute, podcast, record, sing, sound, voice"></i>microphone
|
|
alternate slash</div>
|
|
<div class="column"><i class="microphone slash icon"
|
|
data-search-terms="audio, disable, mute, podcast, record, sing, sound, voice"></i>microphone
|
|
slash</div>
|
|
<div class="column"><i class="minus icon"
|
|
data-search-terms="collapse, delete, hide, minify, negative, remove, trash"></i>minus</div>
|
|
<div class="column"><i class="minus circle icon"
|
|
data-search-terms="delete, hide, negative, remove, shape, trash"></i>minus circle</div>
|
|
<div class="column"><i class="minus square icon"
|
|
data-search-terms="collapse, delete, hide, minify, negative, remove, shape, trash"></i>minus
|
|
square</div>
|
|
<div class="column"><i class="minus square outline icon"
|
|
data-search-terms="collapse, delete, hide, minify, negative, remove, shape, trash"></i>minus
|
|
square outline</div>
|
|
<div class="column"><i class="parking icon" data-search-terms="auto, car, garage, meter"></i>parking
|
|
</div>
|
|
<div class="column"><i class="phone icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone</div>
|
|
<div class="column"><i class="phone alternate icon"
|
|
data-search-terms="call, earphone, number, support, telephone, voice"></i>phone alternate</div>
|
|
<div class="column"><i class="phone slash icon"
|
|
data-search-terms="call, cancel, earphone, mute, number, support, telephone, voice"></i>phone
|
|
slash</div>
|
|
<div class="column"><i class="plus icon"
|
|
data-search-terms="add, create, expand, new, positive, shape"></i>plus</div>
|
|
<div class="column"><i class="plus circle icon"
|
|
data-search-terms="add, create, expand, new, positive, shape"></i>plus circle</div>
|
|
<div class="column"><i class="plus square icon"
|
|
data-search-terms="add, create, expand, new, positive, shape"></i>plus square</div>
|
|
<div class="column"><i class="plus square outline icon"
|
|
data-search-terms="add, create, expand, new, positive, shape"></i>plus square outline</div>
|
|
<div class="column"><i class="print icon"
|
|
data-search-terms="business, copy, document, office, paper"></i>print</div>
|
|
<div class="column"><i class="question icon"
|
|
data-search-terms="help, information, support, unknown"></i>question</div>
|
|
<div class="column"><i class="question circle icon"
|
|
data-search-terms="help, information, support, unknown"></i>question circle</div>
|
|
<div class="column"><i class="question circle outline icon"
|
|
data-search-terms="help, information, support, unknown"></i>question circle outline</div>
|
|
<div class="column"><i class="shield alternate icon"
|
|
data-search-terms="achievement, award, block, defend, security, winner"></i>shield alternate
|
|
</div>
|
|
<div class="column"><i class="shopping cart icon"
|
|
data-search-terms="buy, checkout, grocery, payment, purchase"></i>shopping cart</div>
|
|
<div class="column"><i class="sign in alternate icon"
|
|
data-search-terms="arrow, enter, join, log in, login, sign in, sign up, sign-in, signin, signup"></i>sign
|
|
in alternate</div>
|
|
<div class="column"><i class="sign out alternate icon"
|
|
data-search-terms="arrow, exit, leave, log out, logout, sign-out"></i>sign out alternate</div>
|
|
<div class="column"><i class="signal icon"
|
|
data-search-terms="bars, graph, online, reception, status"></i>signal</div>
|
|
<div class="column"><i class="smoking ban icon"
|
|
data-search-terms="ban, cancel, no smoking, non-smoking"></i>smoking ban</div>
|
|
<div class="column"><i class="star icon"
|
|
data-search-terms="achievement, award, favorite, important, night, rating, score"></i>star</div>
|
|
<div class="column"><i class="star half icon"
|
|
data-search-terms="achievement, award, rating, score, star-half-empty, star-half-full"></i>star
|
|
half</div>
|
|
<div class="column"><i class="star half alternate icon"
|
|
data-search-terms="achievement, award, rating, score, star-half-empty, star-half-full"></i>star
|
|
half alternate</div>
|
|
<div class="column"><i class="star half outline icon"
|
|
data-search-terms="achievement, award, rating, score, star-half-empty, star-half-full"></i>star
|
|
half outline</div>
|
|
<div class="column"><i class="star outline icon"
|
|
data-search-terms="achievement, award, favorite, important, night, rating, score"></i>star
|
|
outline</div>
|
|
<div class="column"><i class="stream icon" data-search-terms="flow, list, timeline"></i>stream</div>
|
|
<div class="column"><i class="thermometer empty icon"
|
|
data-search-terms="cold, mercury, status, temperature"></i>thermometer empty</div>
|
|
<div class="column"><i class="thermometer full icon"
|
|
data-search-terms="fever, hot, mercury, status, temperature"></i>thermometer full</div>
|
|
<div class="column"><i class="thermometer half icon"
|
|
data-search-terms="mercury, status, temperature"></i>thermometer half</div>
|
|
<div class="column"><i class="thermometer quarter icon"
|
|
data-search-terms="mercury, status, temperature"></i>thermometer quarter</div>
|
|
<div class="column"><i class="thermometer three quarters icon"
|
|
data-search-terms="mercury, status, temperature"></i>thermometer three quarters</div>
|
|
<div class="column"><i class="thumbs down icon"
|
|
data-search-terms="disagree, disapprove, dislike, hand, social, thumbs-o-down"></i>thumbs down
|
|
</div>
|
|
<div class="column"><i class="thumbs down outline icon"
|
|
data-search-terms="disagree, disapprove, dislike, hand, social, thumbs-o-down"></i>thumbs down
|
|
outline</div>
|
|
<div class="column"><i class="thumbs up icon"
|
|
data-search-terms="agree, approve, favorite, hand, like, ok, okay, social, success, thumbs-o-up, yes, you got it dude"></i>thumbs
|
|
up</div>
|
|
<div class="column"><i class="thumbs up outline icon"
|
|
data-search-terms="agree, approve, favorite, hand, like, ok, okay, social, success, thumbs-o-up, yes, you got it dude"></i>thumbs
|
|
up outline</div>
|
|
<div class="column"><i class="tint icon"
|
|
data-search-terms="color, drop, droplet, raindrop, waterdrop"></i>tint</div>
|
|
<div class="column"><i class="tint slash icon"
|
|
data-search-terms="color, drop, droplet, raindrop, waterdrop"></i>tint slash</div>
|
|
<div class="column"><i class="toggle off icon" data-search-terms="switch"></i>toggle off</div>
|
|
<div class="column"><i class="toggle on icon" data-search-terms="switch"></i>toggle on</div>
|
|
<div class="column"><i class="unlock icon"
|
|
data-search-terms="admin, lock, password, private, protect"></i>unlock</div>
|
|
<div class="column"><i class="unlock alternate icon"
|
|
data-search-terms="admin, lock, password, private, protect"></i>unlock alternate</div>
|
|
<div class="column"><i class="user icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user</div>
|
|
<div class="column"><i class="user alternate icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user alternate</div>
|
|
<div class="column"><i class="user alternate slash icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user alternate slash
|
|
</div>
|
|
<div class="column"><i class="user outline icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user outline</div>
|
|
<div class="column"><i class="user slash icon" data-search-terms="ban, delete, remove"></i>user slash
|
|
</div>
|
|
<div class="column"><i class="video icon"
|
|
data-search-terms="camera, film, movie, record, video-camera"></i>video</div>
|
|
<div class="column"><i class="video slash icon"
|
|
data-search-terms="add, create, film, new, positive, record, video"></i>video slash</div>
|
|
<div class="column"><i class="volume down icon"
|
|
data-search-terms="audio, lower, music, quieter, sound, speaker"></i>volume down</div>
|
|
<div class="column"><i class="volume mute icon"
|
|
data-search-terms="audio, music, quiet, sound, speaker"></i>volume mute</div>
|
|
<div class="column"><i class="volume off icon"
|
|
data-search-terms="audio, ban, music, mute, quiet, silent, sound"></i>volume off</div>
|
|
<div class="column"><i class="volume up icon"
|
|
data-search-terms="audio, higher, louder, music, sound, speaker"></i>volume up</div>
|
|
<div class="column"><i class="wifi icon"
|
|
data-search-terms="connection, hotspot, internet, network, wireless"></i>wifi</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Summer</h4>
|
|
<p>Icons which represent summer activities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="anchor icon"
|
|
data-search-terms="berth, boat, dock, embed, link, maritime, moor, secure"></i>anchor</div>
|
|
<div class="column"><i class="biking icon"
|
|
data-search-terms="bicycle, bike, cycle, cycling, ride, wheel"></i>biking</div>
|
|
<div class="column"><i class="fish icon" data-search-terms="fauna, gold, seafood, swimming"></i>fish
|
|
</div>
|
|
<div class="column"><i class="hotdog icon"
|
|
data-search-terms="bun, chili, frankfurt, frankfurter, kosher, polish, sandwich, sausage, vienna, weiner"></i>hotdog
|
|
</div>
|
|
<div class="column"><i class="ice cream icon"
|
|
data-search-terms="chocolate, cone, dessert, frozen, scoop, sorbet, vanilla, yogurt"></i>ice
|
|
cream</div>
|
|
<div class="column"><i class="lemon icon" data-search-terms="citrus, lemonade, lime, tart"></i>lemon
|
|
</div>
|
|
<div class="column"><i class="lemon outline icon"
|
|
data-search-terms="citrus, lemonade, lime, tart"></i>lemon outline</div>
|
|
<div class="column"><i class="sun icon"
|
|
data-search-terms="brighten, contrast, day, lighter, sol, solar, star, weather"></i>sun</div>
|
|
<div class="column"><i class="sun outline icon"
|
|
data-search-terms="brighten, contrast, day, lighter, sol, solar, star, weather"></i>sun outline
|
|
</div>
|
|
<div class="column"><i class="swimmer icon"
|
|
data-search-terms="athlete, head, man, olympics, person, pool, water"></i>swimmer</div>
|
|
<div class="column"><i class="swimming pool icon"
|
|
data-search-terms="ladder, recreation, swim, water"></i>swimming pool</div>
|
|
<div class="column"><i class="umbrella beach icon"
|
|
data-search-terms="protection, recreation, sand, shade, summer, sun"></i>umbrella beach</div>
|
|
<div class="column"><i class="volleyball ball icon"
|
|
data-search-terms="beach, olympics, sport"></i>volleyball ball</div>
|
|
<div class="column"><i class="water icon"
|
|
data-search-terms="lake, liquid, ocean, sea, swim, wet"></i>water</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Tabletop Gaming</h4>
|
|
<p>Icons which represent table-top games</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="acquisitions incorporated icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, game, gaming, tabletop"></i>acquisitions
|
|
incorporated</div>
|
|
<div class="column"><i class="book dead icon"
|
|
data-search-terms="Dungeons & Dragons, crossbones, d&d, dark arts, death, dnd, documentation, evil, fantasy, halloween, holiday, necronomicon, read, skull, spell"></i>book
|
|
dead</div>
|
|
<div class="column"><i class="critical role icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, game, gaming, tabletop"></i>critical
|
|
role</div>
|
|
<div class="column"><i class="d and d icon" data-search-terms=""></i>d and d</div>
|
|
<div class="column"><i class="d and d beyond icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, gaming, tabletop"></i>d and d beyond
|
|
</div>
|
|
<div class="column"><i class="dice d20 icon"
|
|
data-search-terms="Dungeons & Dragons, chance, d&d, dnd, fantasy, gambling, game, roll"></i>dice
|
|
d20</div>
|
|
<div class="column"><i class="dice d6 icon"
|
|
data-search-terms="Dungeons & Dragons, chance, d&d, dnd, fantasy, gambling, game, roll"></i>dice
|
|
d6</div>
|
|
<div class="column"><i class="dragon icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, fire, lizard, serpent"></i>dragon
|
|
</div>
|
|
<div class="column"><i class="dungeon icon"
|
|
data-search-terms="Dungeons & Dragons, building, d&d, dnd, door, entrance, fantasy, gate"></i>dungeon
|
|
</div>
|
|
<div class="column"><i class="fantasy flight games icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, game, gaming, tabletop"></i>fantasy
|
|
flight games</div>
|
|
<div class="column"><i class="fist raised icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, hand, ki, monk, resist, strength, unarmed combat"></i>fist
|
|
raised</div>
|
|
<div class="column"><i class="hat wizard icon"
|
|
data-search-terms="Dungeons & Dragons, accessory, buckle, clothing, d&d, dnd, fantasy, halloween, head, holiday, mage, magic, pointy, witch"></i>hat
|
|
wizard</div>
|
|
<div class="column"><i class="penny arcade icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, game, gaming, pax, tabletop"></i>penny
|
|
arcade</div>
|
|
<div class="column"><i class="ring icon"
|
|
data-search-terms="Dungeons & Dragons, Gollum, band, binding, d&d, dnd, engagement, fantasy, gold, jewelry, marriage, precious"></i>ring
|
|
</div>
|
|
<div class="column"><i class="scroll icon"
|
|
data-search-terms="Dungeons & Dragons, announcement, d&d, dnd, fantasy, paper, script"></i>scroll
|
|
</div>
|
|
<div class="column"><i class="skull crossbones icon"
|
|
data-search-terms="Dungeons & Dragons, alert, bones, d&d, danger, dead, deadly, death, dnd, fantasy, halloween, holiday, jolly-roger, pirate, poison, skeleton, warning"></i>skull
|
|
crossbones</div>
|
|
<div class="column"><i class="wizards of the coast icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, game, gaming, tabletop"></i>wizards of
|
|
the coast</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Toggle</h4>
|
|
<p>Icons which represent toggling an action</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="bullseye icon"
|
|
data-search-terms="archery, goal, objective, target"></i>bullseye</div>
|
|
<div class="column"><i class="check circle icon"
|
|
data-search-terms="accept, agree, confirm, correct, done, ok, select, success, tick, todo, yes"></i>check
|
|
circle</div>
|
|
<div class="column"><i class="check circle outline icon"
|
|
data-search-terms="accept, agree, confirm, correct, done, ok, select, success, tick, todo, yes"></i>check
|
|
circle outline</div>
|
|
<div class="column"><i class="circle icon"
|
|
data-search-terms="circle-thin, diameter, dot, ellipse, notification, round"></i>circle</div>
|
|
<div class="column"><i class="circle outline icon"
|
|
data-search-terms="circle-thin, diameter, dot, ellipse, notification, round"></i>circle outline
|
|
</div>
|
|
<div class="column"><i class="dot circle icon"
|
|
data-search-terms="bullseye, notification, target"></i>dot circle</div>
|
|
<div class="column"><i class="dot circle outline icon"
|
|
data-search-terms="bullseye, notification, target"></i>dot circle outline</div>
|
|
<div class="column"><i class="microphone icon"
|
|
data-search-terms="audio, podcast, record, sing, sound, voice"></i>microphone</div>
|
|
<div class="column"><i class="microphone slash icon"
|
|
data-search-terms="audio, disable, mute, podcast, record, sing, sound, voice"></i>microphone
|
|
slash</div>
|
|
<div class="column"><i class="star icon"
|
|
data-search-terms="achievement, award, favorite, important, night, rating, score"></i>star</div>
|
|
<div class="column"><i class="star half icon"
|
|
data-search-terms="achievement, award, rating, score, star-half-empty, star-half-full"></i>star
|
|
half</div>
|
|
<div class="column"><i class="star half alternate icon"
|
|
data-search-terms="achievement, award, rating, score, star-half-empty, star-half-full"></i>star
|
|
half alternate</div>
|
|
<div class="column"><i class="star half outline icon"
|
|
data-search-terms="achievement, award, rating, score, star-half-empty, star-half-full"></i>star
|
|
half outline</div>
|
|
<div class="column"><i class="star outline icon"
|
|
data-search-terms="achievement, award, favorite, important, night, rating, score"></i>star
|
|
outline</div>
|
|
<div class="column"><i class="toggle off icon" data-search-terms="switch"></i>toggle off</div>
|
|
<div class="column"><i class="toggle on icon" data-search-terms="switch"></i>toggle on</div>
|
|
<div class="column"><i class="wifi icon"
|
|
data-search-terms="connection, hotspot, internet, network, wireless"></i>wifi</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Travel</h4>
|
|
<p>Icons which represent traveling activities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="archway icon"
|
|
data-search-terms="arc, monument, road, street, tunnel"></i>archway</div>
|
|
<div class="column"><i class="atlas icon"
|
|
data-search-terms="book, directions, geography, globe, map, travel, wayfinding"></i>atlas</div>
|
|
<div class="column"><i class="bed icon"
|
|
data-search-terms="lodging, mattress, rest, sleep, travel"></i>bed</div>
|
|
<div class="column"><i class="bus icon"
|
|
data-search-terms="public transportation, transportation, travel, vehicle"></i>bus</div>
|
|
<div class="column"><i class="bus alternate icon"
|
|
data-search-terms="mta, public transportation, transportation, travel, vehicle"></i>bus
|
|
alternate</div>
|
|
<div class="column"><i class="caravan icon"
|
|
data-search-terms="camper, motor home, rv, trailer, travel"></i>caravan</div>
|
|
<div class="column"><i class="cocktail icon"
|
|
data-search-terms="alcohol, beverage, drink, gin, glass, margarita, martini, vodka"></i>cocktail
|
|
</div>
|
|
<div class="column"><i class="concierge bell icon"
|
|
data-search-terms="attention, hotel, receptionist, service, support"></i>concierge bell</div>
|
|
<div class="column"><i class="dumbbell icon"
|
|
data-search-terms="exercise, gym, strength, weight, weight-lifting"></i>dumbbell</div>
|
|
<div class="column"><i class="glass martini icon"
|
|
data-search-terms="alcohol, bar, beverage, drink, liquor"></i>glass martini</div>
|
|
<div class="column"><i class="glass martini alternate icon"
|
|
data-search-terms="alcohol, bar, beverage, drink, liquor"></i>glass martini alternate</div>
|
|
<div class="column"><i class="globe africa icon"
|
|
data-search-terms="all, country, earth, global, gps, language, localize, location, map, online, place, planet, translate, travel, world"></i>globe
|
|
africa</div>
|
|
<div class="column"><i class="globe americas icon"
|
|
data-search-terms="all, country, earth, global, gps, language, localize, location, map, online, place, planet, translate, travel, world"></i>globe
|
|
americas</div>
|
|
<div class="column"><i class="globe asia icon"
|
|
data-search-terms="all, country, earth, global, gps, language, localize, location, map, online, place, planet, translate, travel, world"></i>globe
|
|
asia</div>
|
|
<div class="column"><i class="globe europe icon"
|
|
data-search-terms="all, country, earth, global, gps, language, localize, location, map, online, place, planet, translate, travel, world"></i>globe
|
|
europe</div>
|
|
<div class="column"><i class="hot tub icon"
|
|
data-search-terms="bath, jacuzzi, massage, sauna, spa"></i>hot tub</div>
|
|
<div class="column"><i class="hotel icon"
|
|
data-search-terms="building, inn, lodging, motel, resort, travel"></i>hotel</div>
|
|
<div class="column"><i class="luggage cart icon"
|
|
data-search-terms="bag, baggage, suitcase, travel"></i>luggage cart</div>
|
|
<div class="column"><i class="map icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
</div>
|
|
<div class="column"><i class="map marked icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
marked</div>
|
|
<div class="column"><i class="map marked alternate icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
marked alternate</div>
|
|
<div class="column"><i class="map outline icon"
|
|
data-search-terms="address, coordinates, destination, gps, localize, location, map, navigation, paper, pin, place, point of interest, position, route, travel"></i>map
|
|
outline</div>
|
|
<div class="column"><i class="monument icon"
|
|
data-search-terms="building, historic, landmark, memorable"></i>monument</div>
|
|
<div class="column"><i class="passport icon"
|
|
data-search-terms="document, id, identification, issued, travel"></i>passport</div>
|
|
<div class="column"><i class="plane icon"
|
|
data-search-terms="airplane, destination, fly, location, mode, travel, trip"></i>plane</div>
|
|
<div class="column"><i class="plane arrival icon"
|
|
data-search-terms="airplane, arriving, destination, fly, land, landing, location, mode, travel, trip"></i>plane
|
|
arrival</div>
|
|
<div class="column"><i class="plane departure icon"
|
|
data-search-terms="airplane, departing, destination, fly, location, mode, take off, taking off, travel, trip"></i>plane
|
|
departure</div>
|
|
<div class="column"><i class="shuttle van icon"
|
|
data-search-terms="airport, machine, public-transportation, transportation, travel, vehicle"></i>shuttle
|
|
van</div>
|
|
<div class="column"><i class="spa icon"
|
|
data-search-terms="flora, massage, mindfulness, plant, wellness"></i>spa</div>
|
|
<div class="column"><i class="suitcase icon"
|
|
data-search-terms="baggage, luggage, move, suitcase, travel, trip"></i>suitcase</div>
|
|
<div class="column"><i class="suitcase rolling icon"
|
|
data-search-terms="baggage, luggage, move, suitcase, travel, trip"></i>suitcase rolling</div>
|
|
<div class="column"><i class="swimmer icon"
|
|
data-search-terms="athlete, head, man, olympics, person, pool, water"></i>swimmer</div>
|
|
<div class="column"><i class="swimming pool icon"
|
|
data-search-terms="ladder, recreation, swim, water"></i>swimming pool</div>
|
|
<div class="column"><i class="taxi icon"
|
|
data-search-terms="cab, cabbie, car, car service, lyft, machine, transportation, travel, uber, vehicle"></i>taxi
|
|
</div>
|
|
<div class="column"><i class="tram icon"
|
|
data-search-terms="crossing, machine, mountains, seasonal, transportation"></i>tram</div>
|
|
<div class="column"><i class="tv icon" data-search-terms="computer, display, monitor, television"></i>tv
|
|
</div>
|
|
<div class="column"><i class="umbrella beach icon"
|
|
data-search-terms="protection, recreation, sand, shade, summer, sun"></i>umbrella beach</div>
|
|
<div class="column"><i class="wine glass icon"
|
|
data-search-terms="alcohol, beverage, cabernet, drink, grapes, merlot, sauvignon"></i>wine glass
|
|
</div>
|
|
<div class="column"><i class="wine glass alternate icon"
|
|
data-search-terms="alcohol, beverage, cabernet, drink, grapes, merlot, sauvignon"></i>wine glass
|
|
alternate</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Users & People</h4>
|
|
<p>Icons can represent users or people</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="accessible icon"
|
|
data-search-terms="accessibility, handicap, person, wheelchair, wheelchair-alt"></i>accessible
|
|
</div>
|
|
<div class="column"><i class="address book icon"
|
|
data-search-terms="contact, directory, index, little black book, rolodex"></i>address book</div>
|
|
<div class="column"><i class="address book outline icon"
|
|
data-search-terms="contact, directory, index, little black book, rolodex"></i>address book
|
|
outline</div>
|
|
<div class="column"><i class="address card icon"
|
|
data-search-terms="about, contact, id, identification, postcard, profile"></i>address card</div>
|
|
<div class="column"><i class="address card outline icon"
|
|
data-search-terms="about, contact, id, identification, postcard, profile"></i>address card
|
|
outline</div>
|
|
<div class="column"><i class="baby icon"
|
|
data-search-terms="child, diaper, doll, human, infant, kid, offspring, person, sprout"></i>baby
|
|
</div>
|
|
<div class="column"><i class="bed icon"
|
|
data-search-terms="lodging, mattress, rest, sleep, travel"></i>bed</div>
|
|
<div class="column"><i class="biking icon"
|
|
data-search-terms="bicycle, bike, cycle, cycling, ride, wheel"></i>biking</div>
|
|
<div class="column"><i class="blind icon" data-search-terms="cane, disability, person, sight"></i>blind
|
|
</div>
|
|
<div class="column"><i class="chalkboard teacher icon"
|
|
data-search-terms="blackboard, instructor, learning, professor, school, whiteboard, writing"></i>chalkboard
|
|
teacher</div>
|
|
<div class="column"><i class="child icon" data-search-terms="boy, girl, kid, toddler, young"></i>child
|
|
</div>
|
|
<div class="column"><i class="female icon"
|
|
data-search-terms="human, person, profile, user, woman"></i>female</div>
|
|
<div class="column"><i class="frown icon"
|
|
data-search-terms="disapprove, emoticon, face, rating, sad"></i>frown</div>
|
|
<div class="column"><i class="frown outline icon"
|
|
data-search-terms="disapprove, emoticon, face, rating, sad"></i>frown outline</div>
|
|
<div class="column"><i class="hiking icon"
|
|
data-search-terms="activity, backpack, fall, fitness, outdoors, person, seasonal, walking"></i>hiking
|
|
</div>
|
|
<div class="column"><i class="id badge icon"
|
|
data-search-terms="address, contact, identification, license, profile"></i>id badge</div>
|
|
<div class="column"><i class="id badge outline icon"
|
|
data-search-terms="address, contact, identification, license, profile"></i>id badge outline
|
|
</div>
|
|
<div class="column"><i class="id card icon"
|
|
data-search-terms="contact, demographics, document, identification, issued, profile"></i>id card
|
|
</div>
|
|
<div class="column"><i class="id card alternate icon"
|
|
data-search-terms="contact, demographics, document, identification, issued, profile"></i>id card
|
|
alternate</div>
|
|
<div class="column"><i class="id card outline icon"
|
|
data-search-terms="contact, demographics, document, identification, issued, profile"></i>id card
|
|
outline</div>
|
|
<div class="column"><i class="male icon" data-search-terms="human, man, person, profile, user"></i>male
|
|
</div>
|
|
<div class="column"><i class="meh icon" data-search-terms="emoticon, face, neutral, rating"></i>meh
|
|
</div>
|
|
<div class="column"><i class="meh outline icon"
|
|
data-search-terms="emoticon, face, neutral, rating"></i>meh outline</div>
|
|
<div class="column"><i class="people arrows icon"
|
|
data-search-terms="covid-19, personal space, social distance, space, spread, users"></i>people
|
|
arrows</div>
|
|
<div class="column"><i class="people carry icon"
|
|
data-search-terms="box, carry, fragile, help, movers, package"></i>people carry</div>
|
|
<div class="column"><i class="person booth icon"
|
|
data-search-terms="changing, changing room, election, human, person, vote, voting"></i>person
|
|
booth</div>
|
|
<div class="column"><i class="poo icon" data-search-terms="crap, poop, shit, smile, turd"></i>poo</div>
|
|
<div class="column"><i class="portrait icon"
|
|
data-search-terms="id, image, photo, picture, selfie"></i>portrait</div>
|
|
<div class="column"><i class="power off icon"
|
|
data-search-terms="cancel, computer, on, reboot, restart"></i>power off</div>
|
|
<div class="column"><i class="pray icon" data-search-terms="kneel, preach, religion, worship"></i>pray
|
|
</div>
|
|
<div class="column"><i class="restroom icon"
|
|
data-search-terms="bathroom, john, loo, potty, washroom, waste, wc"></i>restroom</div>
|
|
<div class="column"><i class="running icon"
|
|
data-search-terms="exercise, health, jog, person, run, sport, sprint"></i>running</div>
|
|
<div class="column"><i class="skating icon"
|
|
data-search-terms="activity, figure skating, fitness, ice, person, winter"></i>skating</div>
|
|
<div class="column"><i class="skiing icon"
|
|
data-search-terms="activity, downhill, fast, fitness, olympics, outdoors, person, seasonal, slalom"></i>skiing
|
|
</div>
|
|
<div class="column"><i class="skiing nordic icon"
|
|
data-search-terms="activity, cross country, fitness, outdoors, person, seasonal"></i>skiing
|
|
nordic</div>
|
|
<div class="column"><i class="smile icon"
|
|
data-search-terms="approve, emoticon, face, happy, rating, satisfied"></i>smile</div>
|
|
<div class="column"><i class="smile outline icon"
|
|
data-search-terms="approve, emoticon, face, happy, rating, satisfied"></i>smile outline</div>
|
|
<div class="column"><i class="snowboarding icon"
|
|
data-search-terms="activity, fitness, olympics, outdoors, person"></i>snowboarding</div>
|
|
<div class="column"><i class="street view icon"
|
|
data-search-terms="directions, location, map, navigation"></i>street view</div>
|
|
<div class="column"><i class="swimmer icon"
|
|
data-search-terms="athlete, head, man, olympics, person, pool, water"></i>swimmer</div>
|
|
<div class="column"><i class="user icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user</div>
|
|
<div class="column"><i class="user alternate icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user alternate</div>
|
|
<div class="column"><i class="user alternate slash icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user alternate slash
|
|
</div>
|
|
<div class="column"><i class="user astronaut icon"
|
|
data-search-terms="avatar, clothing, cosmonaut, nasa, space, suit"></i>user astronaut</div>
|
|
<div class="column"><i class="user check icon"
|
|
data-search-terms="accept, check, person, verified"></i>user check</div>
|
|
<div class="column"><i class="user circle icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user circle</div>
|
|
<div class="column"><i class="user circle outline icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user circle outline
|
|
</div>
|
|
<div class="column"><i class="user clock icon" data-search-terms="alert, person, remind, time"></i>user
|
|
clock</div>
|
|
<div class="column"><i class="user cog icon" data-search-terms="admin, cog, person, settings"></i>user
|
|
cog</div>
|
|
<div class="column"><i class="user edit icon"
|
|
data-search-terms="edit, pen, pencil, person, update, write"></i>user edit</div>
|
|
<div class="column"><i class="user friends icon"
|
|
data-search-terms="group, people, person, team, users"></i>user friends</div>
|
|
<div class="column"><i class="user graduate icon"
|
|
data-search-terms="cap, clothing, commencement, gown, graduation, person, student"></i>user
|
|
graduate</div>
|
|
<div class="column"><i class="user injured icon"
|
|
data-search-terms="cast, injury, ouch, patient, person, sling"></i>user injured</div>
|
|
<div class="column"><i class="user lock icon"
|
|
data-search-terms="admin, lock, person, private, unlock"></i>user lock</div>
|
|
<div class="column"><i class="user md icon"
|
|
data-search-terms="covid-19, job, medical, nurse, occupation, physician, profile, surgeon"></i>user
|
|
md</div>
|
|
<div class="column"><i class="user minus icon" data-search-terms="delete, negative, remove"></i>user
|
|
minus</div>
|
|
<div class="column"><i class="user ninja icon"
|
|
data-search-terms="assassin, avatar, dangerous, deadly, sneaky"></i>user ninja</div>
|
|
<div class="column"><i class="user nurse icon"
|
|
data-search-terms="covid-19, doctor, midwife, practitioner, surgeon"></i>user nurse</div>
|
|
<div class="column"><i class="user outline icon"
|
|
data-search-terms="account, avatar, head, human, man, person, profile"></i>user outline</div>
|
|
<div class="column"><i class="user plus icon"
|
|
data-search-terms="add, avatar, positive, sign up, signup, team"></i>user plus</div>
|
|
<div class="column"><i class="user secret icon"
|
|
data-search-terms="clothing, coat, hat, incognito, person, privacy, spy, whisper"></i>user
|
|
secret</div>
|
|
<div class="column"><i class="user shield icon"
|
|
data-search-terms="admin, person, private, protect, safe"></i>user shield</div>
|
|
<div class="column"><i class="user slash icon" data-search-terms="ban, delete, remove"></i>user slash
|
|
</div>
|
|
<div class="column"><i class="user tag icon"
|
|
data-search-terms="avatar, discount, label, person, role, special"></i>user tag</div>
|
|
<div class="column"><i class="user tie icon"
|
|
data-search-terms="avatar, business, clothing, formal, professional, suit"></i>user tie</div>
|
|
<div class="column"><i class="user times icon" data-search-terms="archive, delete, remove, x"></i>user
|
|
times</div>
|
|
<div class="column"><i class="users icon"
|
|
data-search-terms="friends, group, people, persons, profiles, team"></i>users</div>
|
|
<div class="column"><i class="users cog icon"
|
|
data-search-terms="admin, cog, group, person, settings, team"></i>users cog</div>
|
|
<div class="column"><i class="users slash icon"
|
|
data-search-terms="disband, friends, group, people, persons, profiles, separate, team, ungroup"></i>users
|
|
slash</div>
|
|
<div class="column"><i class="walking icon"
|
|
data-search-terms="exercise, health, pedometer, person, steps"></i>walking</div>
|
|
<div class="column"><i class="wheelchair icon"
|
|
data-search-terms="accessible, handicap, person"></i>wheelchair</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Vehicles</h4>
|
|
<p>Icons can represent vehicles or transport</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="accessible icon"
|
|
data-search-terms="accessibility, handicap, person, wheelchair, wheelchair-alt"></i>accessible</div>
|
|
<div class="column"><i class="ambulance icon"
|
|
data-search-terms="covid-19, emergency, emt, er, help, hospital, support, vehicle"></i>ambulance
|
|
</div>
|
|
<div class="column"><i class="baby carriage icon"
|
|
data-search-terms="buggy, carrier, infant, push, stroller, transportation, walk, wheels"></i>baby
|
|
carriage</div>
|
|
<div class="column"><i class="bicycle icon"
|
|
data-search-terms="bike, gears, pedal, transportation, vehicle"></i>bicycle</div>
|
|
<div class="column"><i class="bus icon"
|
|
data-search-terms="public transportation, transportation, travel, vehicle"></i>bus</div>
|
|
<div class="column"><i class="bus alternate icon"
|
|
data-search-terms="mta, public transportation, transportation, travel, vehicle"></i>bus alternate
|
|
</div>
|
|
<div class="column"><i class="car icon"
|
|
data-search-terms="auto, automobile, sedan, transportation, travel, vehicle"></i>car</div>
|
|
<div class="column"><i class="car alternate icon"
|
|
data-search-terms="auto, automobile, sedan, transportation, travel, vehicle"></i>car alternate</div>
|
|
<div class="column"><i class="car crash icon"
|
|
data-search-terms="accident, auto, automobile, insurance, sedan, transportation, vehicle, wreck"></i>car
|
|
crash</div>
|
|
<div class="column"><i class="car side icon"
|
|
data-search-terms="auto, automobile, sedan, transportation, travel, vehicle"></i>car side</div>
|
|
<div class="column"><i class="fighter jet icon"
|
|
data-search-terms="airplane, fast, fly, goose, maverick, plane, quick, top gun, transportation, travel"></i>fighter
|
|
jet</div>
|
|
<div class="column"><i class="helicopter icon"
|
|
data-search-terms="airwolf, apache, chopper, flight, fly, travel"></i>helicopter</div>
|
|
<div class="column"><i class="horse icon"
|
|
data-search-terms="equus, fauna, mammmal, mare, neigh, pony"></i>horse</div>
|
|
<div class="column"><i class="motorcycle icon"
|
|
data-search-terms="bike, machine, transportation, vehicle"></i>motorcycle</div>
|
|
<div class="column"><i class="paper plane icon"
|
|
data-search-terms="air, float, fold, mail, paper, send"></i>paper plane</div>
|
|
<div class="column"><i class="paper plane outline icon"
|
|
data-search-terms="air, float, fold, mail, paper, send"></i>paper plane outline</div>
|
|
<div class="column"><i class="plane icon"
|
|
data-search-terms="airplane, destination, fly, location, mode, travel, trip"></i>plane</div>
|
|
<div class="column"><i class="rocket icon"
|
|
data-search-terms="aircraft, app, jet, launch, nasa, space"></i>rocket</div>
|
|
<div class="column"><i class="ship icon" data-search-terms="boat, sea, water"></i>ship</div>
|
|
<div class="column"><i class="shopping cart icon"
|
|
data-search-terms="buy, checkout, grocery, payment, purchase"></i>shopping cart</div>
|
|
<div class="column"><i class="shuttle van icon"
|
|
data-search-terms="airport, machine, public-transportation, transportation, travel, vehicle"></i>shuttle
|
|
van</div>
|
|
<div class="column"><i class="sleigh icon"
|
|
data-search-terms="christmas, claus, fly, holiday, santa, sled, snow, xmas"></i>sleigh</div>
|
|
<div class="column"><i class="snowplow icon"
|
|
data-search-terms="clean up, cold, road, storm, winter"></i>snowplow</div>
|
|
<div class="column"><i class="space shuttle icon"
|
|
data-search-terms="astronaut, machine, nasa, rocket, space, transportation"></i>space shuttle</div>
|
|
<div class="column"><i class="subway icon"
|
|
data-search-terms="machine, railway, train, transportation, vehicle"></i>subway</div>
|
|
<div class="column"><i class="taxi icon"
|
|
data-search-terms="cab, cabbie, car, car service, lyft, machine, transportation, travel, uber, vehicle"></i>taxi
|
|
</div>
|
|
<div class="column"><i class="tractor icon" data-search-terms="agriculture, farm, vehicle"></i>tractor</div>
|
|
<div class="column"><i class="train icon"
|
|
data-search-terms="bullet, commute, locomotive, railway, subway"></i>train</div>
|
|
<div class="column"><i class="tram icon"
|
|
data-search-terms="crossing, machine, mountains, seasonal, transportation"></i>tram</div>
|
|
<div class="column"><i class="truck icon" data-search-terms="cargo, delivery, shipping, vehicle"></i>truck
|
|
</div>
|
|
<div class="column"><i class="truck monster icon" data-search-terms="offroad, vehicle, wheel"></i>truck
|
|
monster</div>
|
|
<div class="column"><i class="truck pickup icon" data-search-terms="cargo, vehicle"></i>truck pickup</div>
|
|
<div class="column"><i class="wheelchair icon"
|
|
data-search-terms="accessible, handicap, person"></i>wheelchair</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Weather</h4>
|
|
<p>Icons which represent the weather</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="bolt icon" data-search-terms="electricity, lightning, weather, zap"></i>bolt
|
|
</div>
|
|
<div class="column"><i class="cloud icon"
|
|
data-search-terms="atmosphere, fog, overcast, save, upload, weather"></i>cloud</div>
|
|
<div class="column"><i class="cloud meatball icon"
|
|
data-search-terms="FLDSMDFR, food, spaghetti, storm"></i>cloud meatball</div>
|
|
<div class="column"><i class="cloud moon icon"
|
|
data-search-terms="crescent, evening, lunar, night, partly cloudy, sky"></i>cloud moon</div>
|
|
<div class="column"><i class="cloud moon rain icon"
|
|
data-search-terms="crescent, evening, lunar, night, partly cloudy, precipitation, rain, sky, storm"></i>cloud
|
|
moon rain</div>
|
|
<div class="column"><i class="cloud rain icon" data-search-terms="precipitation, rain, sky, storm"></i>cloud
|
|
rain</div>
|
|
<div class="column"><i class="cloud showers heavy icon"
|
|
data-search-terms="precipitation, rain, sky, storm"></i>cloud showers heavy</div>
|
|
<div class="column"><i class="cloud sun icon"
|
|
data-search-terms="clear, day, daytime, fall, outdoors, overcast, partly cloudy"></i>cloud sun</div>
|
|
<div class="column"><i class="cloud sun rain icon"
|
|
data-search-terms="day, overcast, precipitation, storm, summer, sunshower"></i>cloud sun rain</div>
|
|
<div class="column"><i class="meteor icon"
|
|
data-search-terms="armageddon, asteroid, comet, shooting star, space"></i>meteor</div>
|
|
<div class="column"><i class="moon icon" data-search-terms="contrast, crescent, dark, lunar, night"></i>moon
|
|
</div>
|
|
<div class="column"><i class="moon outline icon"
|
|
data-search-terms="contrast, crescent, dark, lunar, night"></i>moon outline</div>
|
|
<div class="column"><i class="poo storm icon"
|
|
data-search-terms="bolt, cloud, euphemism, lightning, mess, poop, shit, turd"></i>poo storm</div>
|
|
<div class="column"><i class="rainbow icon"
|
|
data-search-terms="gold, leprechaun, prism, rain, sky"></i>rainbow
|
|
</div>
|
|
<div class="column"><i class="smog icon"
|
|
data-search-terms="dragon, fog, haze, pollution, smoke, weather"></i>smog</div>
|
|
<div class="column"><i class="snowflake icon" data-search-terms="precipitation, rain, winter"></i>snowflake
|
|
</div>
|
|
<div class="column"><i class="snowflake outline icon"
|
|
data-search-terms="precipitation, rain, winter"></i>snowflake outline</div>
|
|
<div class="column"><i class="sun icon"
|
|
data-search-terms="brighten, contrast, day, lighter, sol, solar, star, weather"></i>sun</div>
|
|
<div class="column"><i class="sun outline icon"
|
|
data-search-terms="brighten, contrast, day, lighter, sol, solar, star, weather"></i>sun outline
|
|
</div>
|
|
<div class="column"><i class="temperature high icon"
|
|
data-search-terms="cook, covid-19, mercury, summer, thermometer, warm"></i>temperature high</div>
|
|
<div class="column"><i class="temperature low icon"
|
|
data-search-terms="cold, cool, covid-19, mercury, thermometer, winter"></i>temperature low</div>
|
|
<div class="column"><i class="umbrella icon" data-search-terms="protection, rain, storm, wet"></i>umbrella
|
|
</div>
|
|
<div class="column"><i class="water icon" data-search-terms="lake, liquid, ocean, sea, swim, wet"></i>water
|
|
</div>
|
|
<div class="column"><i class="wind icon"
|
|
data-search-terms="air, blow, breeze, fall, seasonal, weather"></i>wind
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Winter</h4>
|
|
<p>Icons which represent winter activities</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="glass whiskey icon"
|
|
data-search-terms="alcohol, bar, beverage, bourbon, drink, liquor, neat, rye, scotch, whisky"></i>glass
|
|
whiskey</div>
|
|
<div class="column"><i class="icicles icon"
|
|
data-search-terms="cold, frozen, hanging, ice, seasonal, sharp"></i>icicles</div>
|
|
<div class="column"><i class="igloo icon"
|
|
data-search-terms="dome, dwelling, eskimo, home, house, ice, snow"></i>igloo</div>
|
|
<div class="column"><i class="mitten icon"
|
|
data-search-terms="clothing, cold, glove, hands, knitted, seasonal, warmth"></i>mitten</div>
|
|
<div class="column"><i class="skating icon"
|
|
data-search-terms="activity, figure skating, fitness, ice, person, winter"></i>skating</div>
|
|
<div class="column"><i class="skiing icon"
|
|
data-search-terms="activity, downhill, fast, fitness, olympics, outdoors, person, seasonal, slalom"></i>skiing
|
|
</div>
|
|
<div class="column"><i class="skiing nordic icon"
|
|
data-search-terms="activity, cross country, fitness, outdoors, person, seasonal"></i>skiing nordic
|
|
</div>
|
|
<div class="column"><i class="snowboarding icon"
|
|
data-search-terms="activity, fitness, olympics, outdoors, person"></i>snowboarding</div>
|
|
<div class="column"><i class="snowplow icon"
|
|
data-search-terms="clean up, cold, road, storm, winter"></i>snowplow</div>
|
|
<div class="column"><i class="tram icon"
|
|
data-search-terms="crossing, machine, mountains, seasonal, transportation"></i>tram</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Writing</h4>
|
|
<p>Icons can represent writing and editing</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="archive icon" data-search-terms="box, package, save, storage"></i>archive
|
|
</div>
|
|
<div class="column"><i class="blog icon"
|
|
data-search-terms="journal, log, online, personal, post, web 2.0, wordpress, writing"></i>blog</div>
|
|
<div class="column"><i class="book icon"
|
|
data-search-terms="diary, documentation, journal, library, read"></i>book</div>
|
|
<div class="column"><i class="bookmark icon"
|
|
data-search-terms="favorite, marker, read, remember, save"></i>bookmark</div>
|
|
<div class="column"><i class="bookmark outline icon"
|
|
data-search-terms="favorite, marker, read, remember, save"></i>bookmark outline</div>
|
|
<div class="column"><i class="edit icon" data-search-terms="edit, pen, pencil, update, write"></i>edit</div>
|
|
<div class="column"><i class="edit outline icon"
|
|
data-search-terms="edit, pen, pencil, update, write"></i>edit
|
|
outline</div>
|
|
<div class="column"><i class="envelope icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope</div>
|
|
<div class="column"><i class="envelope open icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope open
|
|
</div>
|
|
<div class="column"><i class="envelope open outline icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope open
|
|
outline</div>
|
|
<div class="column"><i class="envelope outline icon"
|
|
data-search-terms="e-mail, email, letter, mail, message, notification, support"></i>envelope outline
|
|
</div>
|
|
<div class="column"><i class="eraser icon" data-search-terms="art, delete, remove, rubber"></i>eraser</div>
|
|
<div class="column"><i class="file icon" data-search-terms="document, new, page, pdf, resume"></i>file</div>
|
|
<div class="column"><i class="file alternate icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate</div>
|
|
<div class="column"><i class="file alternate outline icon"
|
|
data-search-terms="document, file-text, invoice, new, page, pdf"></i>file alternate outline</div>
|
|
<div class="column"><i class="file outline icon"
|
|
data-search-terms="document, new, page, pdf, resume"></i>file
|
|
outline</div>
|
|
<div class="column"><i class="folder icon" data-search-terms="archive, directory, document, file"></i>folder
|
|
</div>
|
|
<div class="column"><i class="folder open icon"
|
|
data-search-terms="archive, directory, document, empty, file, new"></i>folder open</div>
|
|
<div class="column"><i class="folder open outline icon"
|
|
data-search-terms="archive, directory, document, empty, file, new"></i>folder open outline</div>
|
|
<div class="column"><i class="folder outline icon"
|
|
data-search-terms="archive, directory, document, file"></i>folder outline</div>
|
|
<div class="column"><i class="keyboard icon"
|
|
data-search-terms="accessory, edit, input, text, type, write"></i>keyboard</div>
|
|
<div class="column"><i class="keyboard outline icon"
|
|
data-search-terms="accessory, edit, input, text, type, write"></i>keyboard outline</div>
|
|
<div class="column"><i class="newspaper icon"
|
|
data-search-terms="article, editorial, headline, journal, journalism, news, press"></i>newspaper
|
|
</div>
|
|
<div class="column"><i class="newspaper outline icon"
|
|
data-search-terms="article, editorial, headline, journal, journalism, news, press"></i>newspaper
|
|
outline
|
|
</div>
|
|
<div class="column"><i class="paper plane icon"
|
|
data-search-terms="air, float, fold, mail, paper, send"></i>paper plane</div>
|
|
<div class="column"><i class="paper plane outline icon"
|
|
data-search-terms="air, float, fold, mail, paper, send"></i>paper plane outline</div>
|
|
<div class="column"><i class="paperclip icon"
|
|
data-search-terms="attach, attachment, connect, link"></i>paperclip</div>
|
|
<div class="column"><i class="paragraph icon" data-search-terms="edit, format, text, writing"></i>paragraph
|
|
</div>
|
|
<div class="column"><i class="pen icon" data-search-terms="design, edit, update, write"></i>pen</div>
|
|
<div class="column"><i class="pen alternate icon" data-search-terms="design, edit, update, write"></i>pen
|
|
alternate</div>
|
|
<div class="column"><i class="pen square icon"
|
|
data-search-terms="edit, pencil-square, update, write"></i>pen
|
|
square</div>
|
|
<div class="column"><i class="pencil alternate icon"
|
|
data-search-terms="design, edit, pencil, update, write"></i>pencil alternate</div>
|
|
<div class="column"><i class="quote left icon"
|
|
data-search-terms="mention, note, phrase, text, type"></i>quote
|
|
left</div>
|
|
<div class="column"><i class="quote right icon"
|
|
data-search-terms="mention, note, phrase, text, type"></i>quote
|
|
right</div>
|
|
<div class="column"><i class="sticky note icon"
|
|
data-search-terms="message, note, paper, reminder, sticker"></i>sticky note</div>
|
|
<div class="column"><i class="sticky note outline icon"
|
|
data-search-terms="message, note, paper, reminder, sticker"></i>sticky note outline</div>
|
|
<div class="column"><i class="thumbtack icon"
|
|
data-search-terms="coordinates, location, marker, pin, thumb-tack"></i>thumbtack</div>
|
|
</div>
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Brands</h4>
|
|
<p>Icons can represent logos to common brands</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="500px icon" data-search-terms=""></i>500px</div>
|
|
<div class="column"><i class="accessible icon"
|
|
data-search-terms="accessibility, handicap, person, wheelchair, wheelchair-alt"></i>accessible
|
|
</div>
|
|
<div class="column"><i class="accusoft icon" data-search-terms=""></i>accusoft</div>
|
|
<div class="column"><i class="acquisitions incorporated icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, game, gaming, tabletop"></i>acquisitions
|
|
incorporated</div>
|
|
<div class="column"><i class="adn icon" data-search-terms=""></i>adn</div>
|
|
<div class="column"><i class="adversal icon" data-search-terms=""></i>adversal</div>
|
|
<div class="column"><i class="affiliatetheme icon" data-search-terms=""></i>affiliatetheme</div>
|
|
<div class="column"><i class="airbnb icon" data-search-terms=""></i>airbnb</div>
|
|
<div class="column"><i class="algolia icon" data-search-terms=""></i>algolia</div>
|
|
<div class="column"><i class="alipay icon" data-search-terms=""></i>alipay</div>
|
|
<div class="column"><i class="amazon icon" data-search-terms=""></i>amazon</div>
|
|
<div class="column"><i class="amazon pay icon" data-search-terms=""></i>amazon pay</div>
|
|
<div class="column"><i class="amilia icon" data-search-terms=""></i>amilia</div>
|
|
<div class="column"><i class="android icon" data-search-terms="robot"></i>android</div>
|
|
<div class="column"><i class="angellist icon" data-search-terms=""></i>angellist</div>
|
|
<div class="column"><i class="angrycreative icon" data-search-terms=""></i>angrycreative</div>
|
|
<div class="column"><i class="angular icon" data-search-terms=""></i>angular</div>
|
|
<div class="column"><i class="app store icon" data-search-terms=""></i>app store</div>
|
|
<div class="column"><i class="app store ios icon" data-search-terms=""></i>app store ios</div>
|
|
<div class="column"><i class="apper icon" data-search-terms=""></i>apper</div>
|
|
<div class="column"><i class="apple icon"
|
|
data-search-terms="fruit, ios, mac, operating system, os, osx"></i>apple</div>
|
|
<div class="column"><i class="apple pay icon" data-search-terms=""></i>apple pay</div>
|
|
<div class="column"><i class="artstation icon" data-search-terms=""></i>artstation</div>
|
|
<div class="column"><i class="asymmetrik icon" data-search-terms=""></i>asymmetrik</div>
|
|
<div class="column"><i class="atlassian icon" data-search-terms=""></i>atlassian</div>
|
|
<div class="column"><i class="audible icon" data-search-terms=""></i>audible</div>
|
|
<div class="column"><i class="autoprefixer icon" data-search-terms=""></i>autoprefixer</div>
|
|
<div class="column"><i class="avianex icon" data-search-terms=""></i>avianex</div>
|
|
<div class="column"><i class="aviato icon" data-search-terms=""></i>aviato</div>
|
|
<div class="column"><i class="aws icon" data-search-terms=""></i>aws</div>
|
|
<div class="column"><i class="bandcamp icon" data-search-terms=""></i>bandcamp</div>
|
|
<div class="column"><i class="battle net icon" data-search-terms=""></i>battle net</div>
|
|
<div class="column"><i class="behance icon" data-search-terms=""></i>behance</div>
|
|
<div class="column"><i class="behance square icon" data-search-terms=""></i>behance square</div>
|
|
<div class="column"><i class="bimobject icon" data-search-terms=""></i>bimobject</div>
|
|
<div class="column"><i class="bitbucket icon"
|
|
data-search-terms="atlassian, bitbucket-square, git"></i>bitbucket</div>
|
|
<div class="column"><i class="bitcoin icon" data-search-terms=""></i>bitcoin</div>
|
|
<div class="column"><i class="bity icon" data-search-terms=""></i>bity</div>
|
|
<div class="column"><i class="black tie icon" data-search-terms=""></i>black tie</div>
|
|
<div class="column"><i class="blackberry icon" data-search-terms=""></i>blackberry</div>
|
|
<div class="column"><i class="blogger icon" data-search-terms=""></i>blogger</div>
|
|
<div class="column"><i class="blogger b icon" data-search-terms=""></i>blogger b</div>
|
|
<div class="column"><i class="bluetooth icon" data-search-terms=""></i>bluetooth</div>
|
|
<div class="column"><i class="bluetooth b icon" data-search-terms=""></i>bluetooth b</div>
|
|
<div class="column"><i class="bootstrap icon" data-search-terms=""></i>bootstrap</div>
|
|
<div class="column"><i class="btc icon" data-search-terms=""></i>btc</div>
|
|
<div class="column"><i class="buffer icon" data-search-terms=""></i>buffer</div>
|
|
<div class="column"><i class="buromobelexperte icon" data-search-terms=""></i>buromobelexperte</div>
|
|
<div class="column"><i class="buy n large icon" data-search-terms=""></i>buy n large</div>
|
|
<div class="column"><i class="buysellads icon" data-search-terms=""></i>buysellads</div>
|
|
<div class="column"><i class="canadian maple leaf icon"
|
|
data-search-terms="canada, flag, flora, nature, plant"></i>canadian maple leaf</div>
|
|
<div class="column"><i class="cc amazon pay icon" data-search-terms=""></i>cc amazon pay</div>
|
|
<div class="column"><i class="cc amex icon" data-search-terms="amex"></i>cc amex</div>
|
|
<div class="column"><i class="cc apple pay icon" data-search-terms=""></i>cc apple pay</div>
|
|
<div class="column"><i class="cc diners club icon" data-search-terms=""></i>cc diners club</div>
|
|
<div class="column"><i class="cc discover icon" data-search-terms=""></i>cc discover</div>
|
|
<div class="column"><i class="cc jcb icon" data-search-terms=""></i>cc jcb</div>
|
|
<div class="column"><i class="cc mastercard icon" data-search-terms=""></i>cc mastercard</div>
|
|
<div class="column"><i class="cc paypal icon" data-search-terms=""></i>cc paypal</div>
|
|
<div class="column"><i class="cc stripe icon" data-search-terms=""></i>cc stripe</div>
|
|
<div class="column"><i class="cc visa icon" data-search-terms=""></i>cc visa</div>
|
|
<div class="column"><i class="centercode icon" data-search-terms=""></i>centercode</div>
|
|
<div class="column"><i class="centos icon" data-search-terms="linux, operating system, os"></i>centos
|
|
</div>
|
|
<div class="column"><i class="chrome icon" data-search-terms="browser"></i>chrome</div>
|
|
<div class="column"><i class="chromecast icon" data-search-terms=""></i>chromecast</div>
|
|
<div class="column"><i class="cloudflare icon" data-search-terms=""></i>cloudflare</div>
|
|
<div class="column"><i class="cloudscale icon" data-search-terms=""></i>cloudscale</div>
|
|
<div class="column"><i class="cloudsmith icon" data-search-terms=""></i>cloudsmith</div>
|
|
<div class="column"><i class="cloudversify icon" data-search-terms=""></i>cloudversify</div>
|
|
<div class="column"><i class="codepen icon" data-search-terms=""></i>codepen</div>
|
|
<div class="column"><i class="codiepie icon" data-search-terms=""></i>codiepie</div>
|
|
<div class="column"><i class="confluence icon" data-search-terms="atlassian"></i>confluence</div>
|
|
<div class="column"><i class="connectdevelop icon" data-search-terms=""></i>connectdevelop</div>
|
|
<div class="column"><i class="contao icon" data-search-terms=""></i>contao</div>
|
|
<div class="column"><i class="cotton bureau icon"
|
|
data-search-terms="clothing, t-shirts, tshirts"></i>cotton
|
|
bureau</div>
|
|
<div class="column"><i class="cpanel icon" data-search-terms=""></i>cpanel</div>
|
|
<div class="column"><i class="creative commons icon" data-search-terms=""></i>creative commons</div>
|
|
<div class="column"><i class="creative commons by icon" data-search-terms=""></i>creative commons by
|
|
</div>
|
|
<div class="column"><i class="creative commons nc icon" data-search-terms=""></i>creative commons nc
|
|
</div>
|
|
<div class="column"><i class="creative commons nc eu icon" data-search-terms=""></i>creative commons nc
|
|
eu
|
|
</div>
|
|
<div class="column"><i class="creative commons nc jp icon" data-search-terms=""></i>creative commons nc
|
|
jp
|
|
</div>
|
|
<div class="column"><i class="creative commons nd icon" data-search-terms=""></i>creative commons nd
|
|
</div>
|
|
<div class="column"><i class="creative commons pd icon" data-search-terms=""></i>creative commons pd
|
|
</div>
|
|
<div class="column"><i class="creative commons pd alternate icon" data-search-terms=""></i>creative
|
|
commons
|
|
pd alternate</div>
|
|
<div class="column"><i class="creative commons remix icon" data-search-terms=""></i>creative commons
|
|
remix
|
|
</div>
|
|
<div class="column"><i class="creative commons sa icon" data-search-terms=""></i>creative commons sa
|
|
</div>
|
|
<div class="column"><i class="creative commons sampling icon" data-search-terms=""></i>creative commons
|
|
sampling</div>
|
|
<div class="column"><i class="creative commons sampling plus icon" data-search-terms=""></i>creative
|
|
commons
|
|
sampling plus</div>
|
|
<div class="column"><i class="creative commons share icon" data-search-terms=""></i>creative commons
|
|
share
|
|
</div>
|
|
<div class="column"><i class="creative commons zero icon" data-search-terms=""></i>creative commons zero
|
|
</div>
|
|
<div class="column"><i class="critical role icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, game, gaming, tabletop"></i>critical
|
|
role
|
|
</div>
|
|
<div class="column"><i class="css3 icon" data-search-terms="code"></i>css3</div>
|
|
<div class="column"><i class="css3 alternate icon" data-search-terms=""></i>css3 alternate</div>
|
|
<div class="column"><i class="cuttlefish icon" data-search-terms=""></i>cuttlefish</div>
|
|
<div class="column"><i class="d and d icon" data-search-terms=""></i>d and d</div>
|
|
<div class="column"><i class="d and d beyond icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, gaming, tabletop"></i>d and d beyond
|
|
</div>
|
|
<div class="column"><i class="dailymotion icon" data-search-terms=""></i>dailymotion</div>
|
|
<div class="column"><i class="dashcube icon" data-search-terms=""></i>dashcube</div>
|
|
<div class="column"><i class="deezer icon" data-search-terms=""></i>deezer</div>
|
|
<div class="column"><i class="delicious icon" data-search-terms=""></i>delicious</div>
|
|
<div class="column"><i class="deploydog icon" data-search-terms=""></i>deploydog</div>
|
|
<div class="column"><i class="deskpro icon" data-search-terms=""></i>deskpro</div>
|
|
<div class="column"><i class="dev icon" data-search-terms=""></i>dev</div>
|
|
<div class="column"><i class="deviantart icon" data-search-terms=""></i>deviantart</div>
|
|
<div class="column"><i class="dhl icon"
|
|
data-search-terms="Dalsey, Hillblom and Lynn, german, package, shipping"></i>dhl</div>
|
|
<div class="column"><i class="diaspora icon" data-search-terms=""></i>diaspora</div>
|
|
<div class="column"><i class="digg icon" data-search-terms=""></i>digg</div>
|
|
<div class="column"><i class="digital ocean icon" data-search-terms=""></i>digital ocean</div>
|
|
<div class="column"><i class="discord icon" data-search-terms=""></i>discord</div>
|
|
<div class="column"><i class="discourse icon" data-search-terms=""></i>discourse</div>
|
|
<div class="column"><i class="dochub icon" data-search-terms=""></i>dochub</div>
|
|
<div class="column"><i class="docker icon" data-search-terms=""></i>docker</div>
|
|
<div class="column"><i class="draft2digital icon" data-search-terms=""></i>draft2digital</div>
|
|
<div class="column"><i class="dribbble icon" data-search-terms=""></i>dribbble</div>
|
|
<div class="column"><i class="dribbble square icon" data-search-terms=""></i>dribbble square</div>
|
|
<div class="column"><i class="dropbox icon" data-search-terms=""></i>dropbox</div>
|
|
<div class="column"><i class="drupal icon" data-search-terms=""></i>drupal</div>
|
|
<div class="column"><i class="dyalog icon" data-search-terms=""></i>dyalog</div>
|
|
<div class="column"><i class="earlybirds icon" data-search-terms=""></i>earlybirds</div>
|
|
<div class="column"><i class="ebay icon" data-search-terms=""></i>ebay</div>
|
|
<div class="column"><i class="edge icon" data-search-terms="browser, ie"></i>edge</div>
|
|
<div class="column"><i class="edge legacy icon" data-search-terms=""></i>edge legacy</div>
|
|
<div class="column"><i class="elementor icon" data-search-terms=""></i>elementor</div>
|
|
<div class="column"><i class="ello icon" data-search-terms=""></i>ello</div>
|
|
<div class="column"><i class="ember icon" data-search-terms=""></i>ember</div>
|
|
<div class="column"><i class="empire icon" data-search-terms=""></i>empire</div>
|
|
<div class="column"><i class="envira icon" data-search-terms="leaf"></i>envira</div>
|
|
<div class="column"><i class="erlang icon" data-search-terms=""></i>erlang</div>
|
|
<div class="column"><i class="ethereum icon" data-search-terms=""></i>ethereum</div>
|
|
<div class="column"><i class="etsy icon" data-search-terms=""></i>etsy</div>
|
|
<div class="column"><i class="evernote icon" data-search-terms=""></i>evernote</div>
|
|
<div class="column"><i class="expeditedssl icon" data-search-terms=""></i>expeditedssl</div>
|
|
<div class="column"><i class="facebook icon"
|
|
data-search-terms="facebook-official, social network"></i>facebook</div>
|
|
<div class="column"><i class="facebook f icon" data-search-terms="facebook"></i>facebook f</div>
|
|
<div class="column"><i class="facebook messenger icon" data-search-terms=""></i>facebook messenger</div>
|
|
<div class="column"><i class="facebook square icon" data-search-terms="social network"></i>facebook
|
|
square
|
|
</div>
|
|
<div class="column"><i class="fantasy flight games icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, game, gaming, tabletop"></i>fantasy
|
|
flight
|
|
games</div>
|
|
<div class="column"><i class="fedex icon"
|
|
data-search-terms="Federal Express, package, shipping"></i>fedex
|
|
</div>
|
|
<div class="column"><i class="fedora icon" data-search-terms="linux, operating system, os"></i>fedora
|
|
</div>
|
|
<div class="column"><i class="figma icon" data-search-terms="app, design, interface"></i>figma</div>
|
|
<div class="column"><i class="firefox icon" data-search-terms="browser"></i>firefox</div>
|
|
<div class="column"><i class="firefox browser icon" data-search-terms="browser"></i>firefox browser
|
|
</div>
|
|
<div class="column"><i class="first order icon" data-search-terms=""></i>first order</div>
|
|
<div class="column"><i class="first order alternate icon" data-search-terms=""></i>first order alternate
|
|
</div>
|
|
<div class="column"><i class="firstdraft icon" data-search-terms=""></i>firstdraft</div>
|
|
<div class="column"><i class="flickr icon" data-search-terms=""></i>flickr</div>
|
|
<div class="column"><i class="flipboard icon" data-search-terms=""></i>flipboard</div>
|
|
<div class="column"><i class="fly icon" data-search-terms=""></i>fly</div>
|
|
<div class="column"><i class="font awesome icon" data-search-terms="meanpath"></i>font awesome</div>
|
|
<div class="column"><i class="font awesome alternate icon" data-search-terms=""></i>font awesome
|
|
alternate
|
|
</div>
|
|
<div class="column"><i class="font awesome flag icon" data-search-terms=""></i>font awesome flag</div>
|
|
<div class="column"><i class="fonticons icon" data-search-terms=""></i>fonticons</div>
|
|
<div class="column"><i class="fonticons fi icon" data-search-terms=""></i>fonticons fi</div>
|
|
<div class="column"><i class="fort awesome icon" data-search-terms="castle"></i>fort awesome</div>
|
|
<div class="column"><i class="fort awesome alternate icon" data-search-terms="castle"></i>fort awesome
|
|
alternate</div>
|
|
<div class="column"><i class="forumbee icon" data-search-terms=""></i>forumbee</div>
|
|
<div class="column"><i class="foursquare icon" data-search-terms=""></i>foursquare</div>
|
|
<div class="column"><i class="free code camp icon" data-search-terms=""></i>free code camp</div>
|
|
<div class="column"><i class="freebsd icon" data-search-terms=""></i>freebsd</div>
|
|
<div class="column"><i class="fulcrum icon" data-search-terms=""></i>fulcrum</div>
|
|
<div class="column"><i class="galactic republic icon"
|
|
data-search-terms="politics, star wars"></i>galactic
|
|
republic</div>
|
|
<div class="column"><i class="galactic senate icon" data-search-terms="star wars"></i>galactic senate
|
|
</div>
|
|
<div class="column"><i class="get pocket icon" data-search-terms=""></i>get pocket</div>
|
|
<div class="column"><i class="gg icon" data-search-terms=""></i>gg</div>
|
|
<div class="column"><i class="gg circle icon" data-search-terms=""></i>gg circle</div>
|
|
<div class="column"><i class="git icon" data-search-terms=""></i>git</div>
|
|
<div class="column"><i class="git alternate icon" data-search-terms=""></i>git alternate</div>
|
|
<div class="column"><i class="git square icon" data-search-terms=""></i>git square</div>
|
|
<div class="column"><i class="github icon" data-search-terms="octocat"></i>github</div>
|
|
<div class="column"><i class="github alternate icon" data-search-terms="octocat"></i>github alternate
|
|
</div>
|
|
<div class="column"><i class="github square icon" data-search-terms="octocat"></i>github square</div>
|
|
<div class="column"><i class="gitkraken icon" data-search-terms=""></i>gitkraken</div>
|
|
<div class="column"><i class="gitlab icon" data-search-terms="Axosoft"></i>gitlab</div>
|
|
<div class="column"><i class="gitter icon" data-search-terms=""></i>gitter</div>
|
|
<div class="column"><i class="glide icon" data-search-terms=""></i>glide</div>
|
|
<div class="column"><i class="glide g icon" data-search-terms=""></i>glide g</div>
|
|
<div class="column"><i class="gofore icon" data-search-terms=""></i>gofore</div>
|
|
<div class="column"><i class="goodreads icon" data-search-terms=""></i>goodreads</div>
|
|
<div class="column"><i class="goodreads g icon" data-search-terms=""></i>goodreads g</div>
|
|
<div class="column"><i class="google icon" data-search-terms=""></i>google</div>
|
|
<div class="column"><i class="google drive icon" data-search-terms=""></i>google drive</div>
|
|
<div class="column"><i class="google pay icon" data-search-terms=""></i>google pay</div>
|
|
<div class="column"><i class="google play icon" data-search-terms=""></i>google play</div>
|
|
<div class="column"><i class="google plus icon"
|
|
data-search-terms="google-plus-circle, google-plus-official"></i>google plus</div>
|
|
<div class="column"><i class="google plus g icon"
|
|
data-search-terms="google-plus, social network"></i>google
|
|
plus g</div>
|
|
<div class="column"><i class="google plus square icon" data-search-terms="social network"></i>google
|
|
plus
|
|
square</div>
|
|
<div class="column"><i class="google wallet icon" data-search-terms=""></i>google wallet</div>
|
|
<div class="column"><i class="gratipay icon"
|
|
data-search-terms="favorite, heart, like, love"></i>gratipay
|
|
</div>
|
|
<div class="column"><i class="grav icon" data-search-terms=""></i>grav</div>
|
|
<div class="column"><i class="gripfire icon" data-search-terms=""></i>gripfire</div>
|
|
<div class="column"><i class="grunt icon" data-search-terms=""></i>grunt</div>
|
|
<div class="column"><i class="guilded icon" data-search-terms=""></i>guilded</div>
|
|
<div class="column"><i class="gulp icon" data-search-terms=""></i>gulp</div>
|
|
<div class="column"><i class="hacker news icon" data-search-terms=""></i>hacker news</div>
|
|
<div class="column"><i class="hacker news square icon" data-search-terms=""></i>hacker news square</div>
|
|
<div class="column"><i class="hackerrank icon" data-search-terms=""></i>hackerrank</div>
|
|
<div class="column"><i class="hips icon" data-search-terms=""></i>hips</div>
|
|
<div class="column"><i class="hire a helper icon" data-search-terms=""></i>hire a helper</div>
|
|
<div class="column"><i class="hive icon" data-search-terms=""></i>hive</div>
|
|
<div class="column"><i class="hooli icon" data-search-terms=""></i>hooli</div>
|
|
<div class="column"><i class="hornbill icon" data-search-terms=""></i>hornbill</div>
|
|
<div class="column"><i class="hotjar icon" data-search-terms=""></i>hotjar</div>
|
|
<div class="column"><i class="houzz icon" data-search-terms=""></i>houzz</div>
|
|
<div class="column"><i class="html5 icon" data-search-terms=""></i>html5</div>
|
|
<div class="column"><i class="hubspot icon" data-search-terms=""></i>hubspot</div>
|
|
<div class="column"><i class="ideal icon" data-search-terms=""></i>ideal</div>
|
|
<div class="column"><i class="imdb icon" data-search-terms=""></i>imdb</div>
|
|
<div class="column"><i class="innosoft icon" data-search-terms=""></i>innosoft</div>
|
|
<div class="column"><i class="instagram icon" data-search-terms=""></i>instagram</div>
|
|
<div class="column"><i class="instagram square icon" data-search-terms=""></i>instagram square</div>
|
|
<div class="column"><i class="instalod icon" data-search-terms=""></i>instalod</div>
|
|
<div class="column"><i class="intercom icon" data-search-terms="app, customer, messenger"></i>intercom
|
|
</div>
|
|
<div class="column"><i class="internet explorer icon" data-search-terms="browser, ie"></i>internet
|
|
explorer
|
|
</div>
|
|
<div class="column"><i class="invision icon" data-search-terms="app, design, interface"></i>invision
|
|
</div>
|
|
<div class="column"><i class="ioxhost icon" data-search-terms=""></i>ioxhost</div>
|
|
<div class="column"><i class="itch io icon" data-search-terms=""></i>itch io</div>
|
|
<div class="column"><i class="itunes icon" data-search-terms=""></i>itunes</div>
|
|
<div class="column"><i class="itunes note icon" data-search-terms=""></i>itunes note</div>
|
|
<div class="column"><i class="java icon" data-search-terms=""></i>java</div>
|
|
<div class="column"><i class="jedi order icon" data-search-terms="star wars"></i>jedi order</div>
|
|
<div class="column"><i class="jenkins icon" data-search-terms=""></i>jenkins</div>
|
|
<div class="column"><i class="jira icon" data-search-terms="atlassian"></i>jira</div>
|
|
<div class="column"><i class="joget icon" data-search-terms=""></i>joget</div>
|
|
<div class="column"><i class="joomla icon" data-search-terms=""></i>joomla</div>
|
|
<div class="column"><i class="js icon" data-search-terms=""></i>js</div>
|
|
<div class="column"><i class="js square icon" data-search-terms=""></i>js square</div>
|
|
<div class="column"><i class="jsfiddle icon" data-search-terms=""></i>jsfiddle</div>
|
|
<div class="column"><i class="kaggle icon" data-search-terms=""></i>kaggle</div>
|
|
<div class="column"><i class="keybase icon" data-search-terms=""></i>keybase</div>
|
|
<div class="column"><i class="keycdn icon" data-search-terms=""></i>keycdn</div>
|
|
<div class="column"><i class="kickstarter icon" data-search-terms=""></i>kickstarter</div>
|
|
<div class="column"><i class="kickstarter k icon" data-search-terms=""></i>kickstarter k</div>
|
|
<div class="column"><i class="korvue icon" data-search-terms=""></i>korvue</div>
|
|
<div class="column"><i class="laravel icon" data-search-terms=""></i>laravel</div>
|
|
<div class="column"><i class="lastfm icon" data-search-terms=""></i>lastfm</div>
|
|
<div class="column"><i class="lastfm square icon" data-search-terms=""></i>lastfm square</div>
|
|
<div class="column"><i class="leanpub icon" data-search-terms=""></i>leanpub</div>
|
|
<div class="column"><i class="lesscss icon" data-search-terms=""></i>lesscss</div>
|
|
<div class="column"><i class="linechat icon" data-search-terms=""></i>linechat</div>
|
|
<div class="column"><i class="linkedin icon" data-search-terms="linkedin-square"></i>linkedin</div>
|
|
<div class="column"><i class="linode icon" data-search-terms=""></i>linode</div>
|
|
<div class="column"><i class="linux icon" data-search-terms="tux"></i>linux</div>
|
|
<div class="column"><i class="lyft icon" data-search-terms=""></i>lyft</div>
|
|
<div class="column"><i class="magento icon" data-search-terms=""></i>magento</div>
|
|
<div class="column"><i class="mailchimp icon" data-search-terms=""></i>mailchimp</div>
|
|
<div class="column"><i class="mandalorian icon" data-search-terms=""></i>mandalorian</div>
|
|
<div class="column"><i class="markdown icon" data-search-terms=""></i>markdown</div>
|
|
<div class="column"><i class="mastodon icon" data-search-terms=""></i>mastodon</div>
|
|
<div class="column"><i class="maxcdn icon" data-search-terms=""></i>maxcdn</div>
|
|
<div class="column"><i class="mdb icon" data-search-terms=""></i>mdb</div>
|
|
<div class="column"><i class="medapps icon" data-search-terms=""></i>medapps</div>
|
|
<div class="column"><i class="medium icon" data-search-terms=""></i>medium</div>
|
|
<div class="column"><i class="medium m icon" data-search-terms=""></i>medium m</div>
|
|
<div class="column"><i class="medrt icon" data-search-terms=""></i>medrt</div>
|
|
<div class="column"><i class="meetup icon" data-search-terms=""></i>meetup</div>
|
|
<div class="column"><i class="megaport icon" data-search-terms=""></i>megaport</div>
|
|
<div class="column"><i class="mendeley icon" data-search-terms=""></i>mendeley</div>
|
|
<div class="column"><i class="microblog icon" data-search-terms=""></i>microblog</div>
|
|
<div class="column"><i class="microsoft icon" data-search-terms=""></i>microsoft</div>
|
|
<div class="column"><i class="mix icon" data-search-terms=""></i>mix</div>
|
|
<div class="column"><i class="mixcloud icon" data-search-terms=""></i>mixcloud</div>
|
|
<div class="column"><i class="mixer icon" data-search-terms=""></i>mixer</div>
|
|
<div class="column"><i class="mizuni icon" data-search-terms=""></i>mizuni</div>
|
|
<div class="column"><i class="modx icon" data-search-terms=""></i>modx</div>
|
|
<div class="column"><i class="monero icon" data-search-terms=""></i>monero</div>
|
|
<div class="column"><i class="napster icon" data-search-terms=""></i>napster</div>
|
|
<div class="column"><i class="neos icon" data-search-terms=""></i>neos</div>
|
|
<div class="column"><i class="nimblr icon" data-search-terms=""></i>nimblr</div>
|
|
<div class="column"><i class="node icon" data-search-terms=""></i>node</div>
|
|
<div class="column"><i class="node js icon" data-search-terms=""></i>node js</div>
|
|
<div class="column"><i class="npm icon" data-search-terms=""></i>npm</div>
|
|
<div class="column"><i class="ns8 icon" data-search-terms=""></i>ns8</div>
|
|
<div class="column"><i class="nutritionix icon" data-search-terms=""></i>nutritionix</div>
|
|
<div class="column"><i class="octopus deploy icon" data-search-terms=""></i>octopus deploy</div>
|
|
<div class="column"><i class="odnoklassniki icon" data-search-terms=""></i>odnoklassniki</div>
|
|
<div class="column"><i class="odnoklassniki square icon" data-search-terms=""></i>odnoklassniki square
|
|
</div>
|
|
<div class="column"><i class="old republic icon" data-search-terms="politics, star wars"></i>old
|
|
republic
|
|
</div>
|
|
<div class="column"><i class="opencart icon" data-search-terms=""></i>opencart</div>
|
|
<div class="column"><i class="openid icon" data-search-terms=""></i>openid</div>
|
|
<div class="column"><i class="opera icon" data-search-terms=""></i>opera</div>
|
|
<div class="column"><i class="optin monster icon" data-search-terms=""></i>optin monster</div>
|
|
<div class="column"><i class="orcid icon" data-search-terms=""></i>orcid</div>
|
|
<div class="column"><i class="osi icon" data-search-terms=""></i>osi</div>
|
|
<div class="column"><i class="page4 icon" data-search-terms=""></i>page4</div>
|
|
<div class="column"><i class="pagelines icon"
|
|
data-search-terms="eco, flora, leaf, leaves, nature, plant, tree"></i>pagelines</div>
|
|
<div class="column"><i class="palfed icon" data-search-terms=""></i>palfed</div>
|
|
<div class="column"><i class="patreon icon" data-search-terms=""></i>patreon</div>
|
|
<div class="column"><i class="paypal icon" data-search-terms=""></i>paypal</div>
|
|
<div class="column"><i class="penny arcade icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, game, gaming, pax, tabletop"></i>penny
|
|
arcade</div>
|
|
<div class="column"><i class="perbyte icon" data-search-terms=""></i>perbyte</div>
|
|
<div class="column"><i class="periscope icon" data-search-terms=""></i>periscope</div>
|
|
<div class="column"><i class="phabricator icon" data-search-terms=""></i>phabricator</div>
|
|
<div class="column"><i class="phoenix framework icon" data-search-terms=""></i>phoenix framework</div>
|
|
<div class="column"><i class="phoenix squadron icon" data-search-terms=""></i>phoenix squadron</div>
|
|
<div class="column"><i class="php icon" data-search-terms=""></i>php</div>
|
|
<div class="column"><i class="pied piper icon" data-search-terms=""></i>pied piper</div>
|
|
<div class="column"><i class="pied piper alternate icon" data-search-terms=""></i>pied piper alternate
|
|
</div>
|
|
<div class="column"><i class="pied piper hat icon" data-search-terms="clothing"></i>pied piper hat</div>
|
|
<div class="column"><i class="pied piper pp icon" data-search-terms=""></i>pied piper pp</div>
|
|
<div class="column"><i class="pied piper square icon" data-search-terms=""></i>pied piper square</div>
|
|
<div class="column"><i class="pinterest icon" data-search-terms=""></i>pinterest</div>
|
|
<div class="column"><i class="pinterest p icon" data-search-terms=""></i>pinterest p</div>
|
|
<div class="column"><i class="pinterest square icon" data-search-terms=""></i>pinterest square</div>
|
|
<div class="column"><i class="playstation icon" data-search-terms=""></i>playstation</div>
|
|
<div class="column"><i class="product hunt icon" data-search-terms=""></i>product hunt</div>
|
|
<div class="column"><i class="pushed icon" data-search-terms=""></i>pushed</div>
|
|
<div class="column"><i class="python icon" data-search-terms=""></i>python</div>
|
|
<div class="column"><i class="qq icon" data-search-terms=""></i>qq</div>
|
|
<div class="column"><i class="quinscape icon" data-search-terms=""></i>quinscape</div>
|
|
<div class="column"><i class="quora icon" data-search-terms=""></i>quora</div>
|
|
<div class="column"><i class="r project icon" data-search-terms=""></i>r project</div>
|
|
<div class="column"><i class="raspberry pi icon" data-search-terms=""></i>raspberry pi</div>
|
|
<div class="column"><i class="ravelry icon" data-search-terms=""></i>ravelry</div>
|
|
<div class="column"><i class="react icon" data-search-terms=""></i>react</div>
|
|
<div class="column"><i class="reacteurope icon" data-search-terms=""></i>reacteurope</div>
|
|
<div class="column"><i class="readme icon" data-search-terms=""></i>readme</div>
|
|
<div class="column"><i class="rebel icon" data-search-terms=""></i>rebel</div>
|
|
<div class="column"><i class="reddit icon" data-search-terms=""></i>reddit</div>
|
|
<div class="column"><i class="reddit alien icon" data-search-terms=""></i>reddit alien</div>
|
|
<div class="column"><i class="reddit square icon" data-search-terms=""></i>reddit square</div>
|
|
<div class="column"><i class="redhat icon" data-search-terms="linux, operating system, os"></i>redhat
|
|
</div>
|
|
<div class="column"><i class="redriver icon" data-search-terms=""></i>redriver</div>
|
|
<div class="column"><i class="redyeti icon" data-search-terms=""></i>redyeti</div>
|
|
<div class="column"><i class="renren icon" data-search-terms=""></i>renren</div>
|
|
<div class="column"><i class="replyd icon" data-search-terms=""></i>replyd</div>
|
|
<div class="column"><i class="researchgate icon" data-search-terms=""></i>researchgate</div>
|
|
<div class="column"><i class="resolving icon" data-search-terms=""></i>resolving</div>
|
|
<div class="column"><i class="rev icon" data-search-terms=""></i>rev</div>
|
|
<div class="column"><i class="rocketchat icon" data-search-terms=""></i>rocketchat</div>
|
|
<div class="column"><i class="rockrms icon" data-search-terms=""></i>rockrms</div>
|
|
<div class="column"><i class="rust icon" data-search-terms=""></i>rust</div>
|
|
<div class="column"><i class="safari icon" data-search-terms="browser"></i>safari</div>
|
|
<div class="column"><i class="salesforce icon" data-search-terms=""></i>salesforce</div>
|
|
<div class="column"><i class="sass icon" data-search-terms=""></i>sass</div>
|
|
<div class="column"><i class="schlix icon" data-search-terms=""></i>schlix</div>
|
|
<div class="column"><i class="scribd icon" data-search-terms=""></i>scribd</div>
|
|
<div class="column"><i class="searchengin icon" data-search-terms=""></i>searchengin</div>
|
|
<div class="column"><i class="sellcast icon" data-search-terms="eercast"></i>sellcast</div>
|
|
<div class="column"><i class="sellsy icon" data-search-terms=""></i>sellsy</div>
|
|
<div class="column"><i class="servicestack icon" data-search-terms=""></i>servicestack</div>
|
|
<div class="column"><i class="shirtsinbulk icon" data-search-terms=""></i>shirtsinbulk</div>
|
|
<div class="column"><i class="shopify icon" data-search-terms=""></i>shopify</div>
|
|
<div class="column"><i class="shopware icon" data-search-terms=""></i>shopware</div>
|
|
<div class="column"><i class="simplybuilt icon" data-search-terms=""></i>simplybuilt</div>
|
|
<div class="column"><i class="sistrix icon" data-search-terms=""></i>sistrix</div>
|
|
<div class="column"><i class="sith icon" data-search-terms=""></i>sith</div>
|
|
<div class="column"><i class="sketch icon" data-search-terms="app, design, interface"></i>sketch</div>
|
|
<div class="column"><i class="skyatlas icon" data-search-terms=""></i>skyatlas</div>
|
|
<div class="column"><i class="skype icon" data-search-terms=""></i>skype</div>
|
|
<div class="column"><i class="slack icon" data-search-terms="anchor, hash, hashtag"></i>slack</div>
|
|
<div class="column"><i class="slack hash icon" data-search-terms="anchor, hash, hashtag"></i>slack hash
|
|
</div>
|
|
<div class="column"><i class="slideshare icon" data-search-terms=""></i>slideshare</div>
|
|
<div class="column"><i class="snapchat icon" data-search-terms=""></i>snapchat</div>
|
|
<div class="column"><i class="snapchat ghost icon" data-search-terms=""></i>snapchat ghost</div>
|
|
<div class="column"><i class="snapchat square icon" data-search-terms=""></i>snapchat square</div>
|
|
<div class="column"><i class="soundcloud icon" data-search-terms=""></i>soundcloud</div>
|
|
<div class="column"><i class="sourcetree icon" data-search-terms=""></i>sourcetree</div>
|
|
<div class="column"><i class="speakap icon" data-search-terms=""></i>speakap</div>
|
|
<div class="column"><i class="speaker deck icon" data-search-terms=""></i>speaker deck</div>
|
|
<div class="column"><i class="spotify icon" data-search-terms=""></i>spotify</div>
|
|
<div class="column"><i class="squarespace icon" data-search-terms=""></i>squarespace</div>
|
|
<div class="column"><i class="stack exchange icon" data-search-terms=""></i>stack exchange</div>
|
|
<div class="column"><i class="stack overflow icon" data-search-terms=""></i>stack overflow</div>
|
|
<div class="column"><i class="stackpath icon" data-search-terms=""></i>stackpath</div>
|
|
<div class="column"><i class="staylinked icon" data-search-terms=""></i>staylinked</div>
|
|
<div class="column"><i class="steam icon" data-search-terms=""></i>steam</div>
|
|
<div class="column"><i class="steam square icon" data-search-terms=""></i>steam square</div>
|
|
<div class="column"><i class="steam symbol icon" data-search-terms=""></i>steam symbol</div>
|
|
<div class="column"><i class="sticker mule icon" data-search-terms=""></i>sticker mule</div>
|
|
<div class="column"><i class="strava icon" data-search-terms=""></i>strava</div>
|
|
<div class="column"><i class="stripe icon" data-search-terms=""></i>stripe</div>
|
|
<div class="column"><i class="stripe s icon" data-search-terms=""></i>stripe s</div>
|
|
<div class="column"><i class="studiovinari icon" data-search-terms=""></i>studiovinari</div>
|
|
<div class="column"><i class="stumbleupon icon" data-search-terms=""></i>stumbleupon</div>
|
|
<div class="column"><i class="stumbleupon circle icon" data-search-terms=""></i>stumbleupon circle</div>
|
|
<div class="column"><i class="superpowers icon" data-search-terms=""></i>superpowers</div>
|
|
<div class="column"><i class="supple icon" data-search-terms=""></i>supple</div>
|
|
<div class="column"><i class="suse icon" data-search-terms="linux, operating system, os"></i>suse</div>
|
|
<div class="column"><i class="swift icon" data-search-terms=""></i>swift</div>
|
|
<div class="column"><i class="symfony icon" data-search-terms=""></i>symfony</div>
|
|
<div class="column"><i class="teamspeak icon" data-search-terms=""></i>teamspeak</div>
|
|
<div class="column"><i class="telegram icon" data-search-terms=""></i>telegram</div>
|
|
<div class="column"><i class="telegram plane icon" data-search-terms=""></i>telegram plane</div>
|
|
<div class="column"><i class="tencent weibo icon" data-search-terms=""></i>tencent weibo</div>
|
|
<div class="column"><i class="themeco icon" data-search-terms=""></i>themeco</div>
|
|
<div class="column"><i class="themeisle icon" data-search-terms=""></i>themeisle</div>
|
|
<div class="column"><i class="think peaks icon" data-search-terms=""></i>think peaks</div>
|
|
<div class="column"><i class="tiktok icon" data-search-terms=""></i>tiktok</div>
|
|
<div class="column"><i class="trade federation icon" data-search-terms=""></i>trade federation</div>
|
|
<div class="column"><i class="trello icon" data-search-terms="atlassian"></i>trello</div>
|
|
<div class="column"><i class="tumblr icon" data-search-terms=""></i>tumblr</div>
|
|
<div class="column"><i class="tumblr square icon" data-search-terms=""></i>tumblr square</div>
|
|
<div class="column"><i class="twitch icon" data-search-terms=""></i>twitch</div>
|
|
<div class="column"><i class="twitter icon" data-search-terms="social network, tweet"></i>twitter</div>
|
|
<div class="column"><i class="twitter square icon" data-search-terms="social network, tweet"></i>twitter
|
|
square</div>
|
|
<div class="column"><i class="typo3 icon" data-search-terms=""></i>typo3</div>
|
|
<div class="column"><i class="uber icon" data-search-terms=""></i>uber</div>
|
|
<div class="column"><i class="ubuntu icon" data-search-terms="linux, operating system, os"></i>ubuntu
|
|
</div>
|
|
<div class="column"><i class="uikit icon" data-search-terms=""></i>uikit</div>
|
|
<div class="column"><i class="umbraco icon" data-search-terms=""></i>umbraco</div>
|
|
<div class="column"><i class="uncharted icon" data-search-terms=""></i>uncharted</div>
|
|
<div class="column"><i class="uniregistry icon" data-search-terms=""></i>uniregistry</div>
|
|
<div class="column"><i class="unity icon" data-search-terms=""></i>unity</div>
|
|
<div class="column"><i class="unsplash icon" data-search-terms=""></i>unsplash</div>
|
|
<div class="column"><i class="untappd icon" data-search-terms=""></i>untappd</div>
|
|
<div class="column"><i class="ups icon"
|
|
data-search-terms="United Parcel Service, package, shipping"></i>ups
|
|
</div>
|
|
<div class="column"><i class="usb icon" data-search-terms=""></i>usb</div>
|
|
<div class="column"><i class="usps icon" data-search-terms="american, package, shipping, usa"></i>usps
|
|
</div>
|
|
<div class="column"><i class="ussunnah icon" data-search-terms=""></i>ussunnah</div>
|
|
<div class="column"><i class="vaadin icon" data-search-terms=""></i>vaadin</div>
|
|
<div class="column"><i class="viacoin icon" data-search-terms=""></i>viacoin</div>
|
|
<div class="column"><i class="viadeo icon" data-search-terms=""></i>viadeo</div>
|
|
<div class="column"><i class="viadeo square icon" data-search-terms=""></i>viadeo square</div>
|
|
<div class="column"><i class="viber icon" data-search-terms=""></i>viber</div>
|
|
<div class="column"><i class="vimeo icon" data-search-terms=""></i>vimeo</div>
|
|
<div class="column"><i class="vimeo square icon" data-search-terms=""></i>vimeo square</div>
|
|
<div class="column"><i class="vimeo v icon" data-search-terms="vimeo"></i>vimeo v</div>
|
|
<div class="column"><i class="vine icon" data-search-terms=""></i>vine</div>
|
|
<div class="column"><i class="vk icon" data-search-terms=""></i>vk</div>
|
|
<div class="column"><i class="vnv icon" data-search-terms=""></i>vnv</div>
|
|
<div class="column"><i class="vuejs icon" data-search-terms=""></i>vuejs</div>
|
|
<div class="column"><i class="watchman monitoring icon" data-search-terms=""></i>watchman monitoring
|
|
</div>
|
|
<div class="column"><i class="waze icon" data-search-terms=""></i>waze</div>
|
|
<div class="column"><i class="weebly icon" data-search-terms=""></i>weebly</div>
|
|
<div class="column"><i class="weibo icon" data-search-terms=""></i>weibo</div>
|
|
<div class="column"><i class="weixin icon" data-search-terms=""></i>weixin</div>
|
|
<div class="column"><i class="whatsapp icon" data-search-terms=""></i>whatsapp</div>
|
|
<div class="column"><i class="whatsapp square icon" data-search-terms=""></i>whatsapp square</div>
|
|
<div class="column"><i class="whmcs icon" data-search-terms=""></i>whmcs</div>
|
|
<div class="column"><i class="wikipedia w icon" data-search-terms=""></i>wikipedia w</div>
|
|
<div class="column"><i class="windows icon"
|
|
data-search-terms="microsoft, operating system, os"></i>windows
|
|
</div>
|
|
<div class="column"><i class="wix icon" data-search-terms=""></i>wix</div>
|
|
<div class="column"><i class="wizards of the coast icon"
|
|
data-search-terms="Dungeons & Dragons, d&d, dnd, fantasy, game, gaming, tabletop"></i>wizards of
|
|
the
|
|
coast</div>
|
|
<div class="column"><i class="wodu icon" data-search-terms=""></i>wodu</div>
|
|
<div class="column"><i class="wolf pack battalion icon" data-search-terms=""></i>wolf pack battalion
|
|
</div>
|
|
<div class="column"><i class="wordpress icon" data-search-terms=""></i>wordpress</div>
|
|
<div class="column"><i class="wordpress simple icon" data-search-terms=""></i>wordpress simple</div>
|
|
<div class="column"><i class="wpbeginner icon" data-search-terms=""></i>wpbeginner</div>
|
|
<div class="column"><i class="wpexplorer icon" data-search-terms=""></i>wpexplorer</div>
|
|
<div class="column"><i class="wpforms icon" data-search-terms=""></i>wpforms</div>
|
|
<div class="column"><i class="wpressr icon" data-search-terms="rendact"></i>wpressr</div>
|
|
<div class="column"><i class="xbox icon" data-search-terms=""></i>xbox</div>
|
|
<div class="column"><i class="xing icon" data-search-terms=""></i>xing</div>
|
|
<div class="column"><i class="xing square icon" data-search-terms=""></i>xing square</div>
|
|
<div class="column"><i class="y combinator icon" data-search-terms=""></i>y combinator</div>
|
|
<div class="column"><i class="yahoo icon" data-search-terms=""></i>yahoo</div>
|
|
<div class="column"><i class="yammer icon" data-search-terms=""></i>yammer</div>
|
|
<div class="column"><i class="yandex icon" data-search-terms=""></i>yandex</div>
|
|
<div class="column"><i class="yandex international icon" data-search-terms=""></i>yandex international
|
|
</div>
|
|
<div class="column"><i class="yarn icon" data-search-terms=""></i>yarn</div>
|
|
<div class="column"><i class="yelp icon" data-search-terms=""></i>yelp</div>
|
|
<div class="column"><i class="yoast icon" data-search-terms=""></i>yoast</div>
|
|
<div class="column"><i class="youtube icon"
|
|
data-search-terms="film, video, youtube-play, youtube-square"></i>youtube</div>
|
|
<div class="column"><i class="youtube square icon" data-search-terms=""></i>youtube square</div>
|
|
<div class="column"><i class="zhihu icon" data-search-terms=""></i>zhihu</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="icon example">
|
|
<h4 class="ui header">Deprecated</h4>
|
|
<p>Deprecated icons won't work properly when used with transitions as they contain <code>in</code> or
|
|
<code>out</code>
|
|
</p>
|
|
<div class="ui doubling five column grid">
|
|
<div class="column"><i class="in cart icon" data-search-terms=""></i>in cart</div>
|
|
<div class="column"><i class="linkedin in icon" data-search-terms="linkedin"></i>linkedin in</div>
|
|
<div class="column"><i class="log out icon" data-search-terms=""></i>log out</div>
|
|
<div class="column"><i class="sign in icon" data-search-terms=""></i>sign in</div>
|
|
<div class="column"><i class="sign in alternate icon"
|
|
data-search-terms="arrow, enter, join, log in, login, sign in, sign up, sign-in, signin, signup"></i>sign
|
|
in alternate</div>
|
|
<div class="column"><i class="sign out icon" data-search-terms=""></i>sign out</div>
|
|
<div class="column"><i class="sign out alternate icon"
|
|
data-search-terms="arrow, exit, leave, log out, logout, sign-out"></i>sign out alternate</div>
|
|
<div class="column"><i class="zoom in icon" data-search-terms=""></i>zoom in</div>
|
|
<div class="column"><i class="zoom out icon" data-search-terms=""></i>zoom out</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
<div class="ui tab" data-tab="definition">
|
|
|
|
<h2 class="ui dividing header">States</h2>
|
|
|
|
<div class="example">
|
|
<h4 class="ui header">Disabled</h4>
|
|
<p>An icon can show that it is disabled</p>
|
|
<i class="disabled users icon"></i>
|
|
</div>
|
|
|
|
<div class="example">
|
|
<h4 class="ui header">Loading</h4>
|
|
<p>An icon can be used as a simple loader</p>
|
|
<i class="spinner loading icon"></i>
|
|
<i class="notched circle loading icon"></i>
|
|
<i class="asterisk loading icon"></i>
|
|
</div>
|
|
|
|
|
|
<h2 class="ui dividing header">Variations</h2>
|
|
|
|
<div class="example">
|
|
<h4 class="ui header">Fitted</h4>
|
|
<p>An icon can be fitted, without any space to the left or right of it.</p>
|
|
Tight spacing
|
|
<i class="fitted help icon"></i>
|
|
Tight spacing
|
|
</div>
|
|
|
|
<div class="example">
|
|
<h4 class="ui header">Size</h4>
|
|
<p>An icon can vary in size</p>
|
|
<i class="mini home icon"></i>
|
|
<i class="tiny home icon"></i>
|
|
<i class="small home icon"></i>
|
|
<br>
|
|
<i class="home icon"></i>
|
|
<br>
|
|
<i class="large home icon"></i>
|
|
<br>
|
|
<i class="big home icon"></i>
|
|
<br>
|
|
<i class="huge home icon"></i>
|
|
<br>
|
|
<i class="massive home icon"></i>
|
|
</div>
|
|
|
|
<div class="example">
|
|
<h4 class="ui header">Link</h4>
|
|
<p>An icon can be formatted as a link</p>
|
|
<i class="close link icon"></i>
|
|
<i class="help link icon"></i>
|
|
</div>
|
|
|
|
<div class="example">
|
|
<h4 class="ui header">Flipped</h4>
|
|
<p>An icon can be flipped</p>
|
|
<i class="horizontally flipped cloud icon"></i>
|
|
<i class="vertically flipped cloud icon"></i>
|
|
</div>
|
|
|
|
<div class="example">
|
|
<h4 class="ui header">Rotated</h4>
|
|
<p>An icon can be rotated</p>
|
|
<i class="clockwise rotated cloud icon"></i>
|
|
<i class="counterclockwise rotated cloud icon"></i>
|
|
</div>
|
|
|
|
|
|
<div class="example">
|
|
<h4 class="ui header">Circular</h4>
|
|
<p>An icon can be formatted to appear circular</p>
|
|
<i class="circular users icon"></i>
|
|
<i class="circular teal users icon"></i>
|
|
<i class="circular inverted users icon"></i>
|
|
<i class="circular inverted teal users icon"></i>
|
|
</div>
|
|
<div class="example">
|
|
<h4 class="ui header">Circular Colored <span class="ui black label">New in 2.8.8</span></h4>
|
|
<p>The circular color can appear in the same color as the icon itself</p>
|
|
<i class="circular colored red users icon"></i>
|
|
<i class="circular colored green users icon"></i>
|
|
<i class="circular colored blue users icon"></i>
|
|
</div>
|
|
<div class="example">
|
|
<h4 class="ui header">Bordered</h4>
|
|
<div class="ui ignored info message">
|
|
In <code>0.x.x</code> bordered was formally known as <code>squared</code>
|
|
</div>
|
|
<p>An icon can be formatted to appear bordered</p>
|
|
<i class="bordered users icon"></i>
|
|
<i class="bordered teal users icon"></i>
|
|
<i class="bordered inverted black users icon"></i>
|
|
<i class="bordered inverted teal users icon"></i>
|
|
</div>
|
|
<div class="example">
|
|
<h4 class="ui header">Bordered Colored <span class="ui black label">New in 2.8.8</span></h4>
|
|
<p>The bordered color can appear in the same color as the icon itself</p>
|
|
<i class="bordered colored red users icon"></i>
|
|
<i class="bordered colored green users icon"></i>
|
|
<i class="bordered colored blue users icon"></i>
|
|
</div>
|
|
<div class="example">
|
|
<h4 class="ui header">Colored</h4>
|
|
<p>An icon can be formatted with different colors</p>
|
|
<i class="primary users icon"></i>
|
|
<i class="secondary users icon"></i>
|
|
<i class="red users icon"></i>
|
|
<i class="orange users icon"></i>
|
|
<i class="yellow users icon"></i>
|
|
<i class="olive users icon"></i>
|
|
<i class="green users icon"></i>
|
|
<i class="teal users icon"></i>
|
|
<i class="blue users icon"></i>
|
|
<i class="violet users icon"></i>
|
|
<i class="purple users icon"></i>
|
|
<i class="pink users icon"></i>
|
|
<i class="brown users icon"></i>
|
|
<i class="grey users icon"></i>
|
|
<i class="black users icon"></i>
|
|
</div>
|
|
|
|
<div class="example">
|
|
<h4 class="ui header">Inverted</h4>
|
|
<p>An icon can have its colors inverted for contrast</p>
|
|
<div class="ui inverted segment">
|
|
<i class="inverted users icon"></i>
|
|
<i class="inverted primary users icon"></i>
|
|
<i class="inverted secondary users icon"></i>
|
|
<i class="inverted red users icon"></i>
|
|
<i class="inverted orange users icon"></i>
|
|
<i class="inverted yellow users icon"></i>
|
|
<i class="inverted olive users icon"></i>
|
|
<i class="inverted green users icon"></i>
|
|
<i class="inverted teal users icon"></i>
|
|
<i class="inverted blue users icon"></i>
|
|
<i class="inverted violet users icon"></i>
|
|
<i class="inverted purple users icon"></i>
|
|
<i class="inverted pink users icon"></i>
|
|
<i class="inverted brown users icon"></i>
|
|
<i class="inverted grey users icon"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<h2 class="ui dividing header">Groups</h2>
|
|
|
|
<div class="example">
|
|
<h4 class="ui header">Icons</h4>
|
|
<p>Several icons can be used together as a group</p>
|
|
<i class="huge icons">
|
|
<i class="big circle outline icon"></i>
|
|
<i class="user icon"></i>
|
|
</i>
|
|
</div>
|
|
<div class="another example">
|
|
<i class="huge icons">
|
|
<i class="big red dont icon"></i>
|
|
<i class="black user icon"></i>
|
|
</i>
|
|
</div>
|
|
<div class="example" data-class="corner">
|
|
<h4 class="ui header">Corner Icon</h4>
|
|
<p>A group of icons can display a smaller corner icon</p>
|
|
<i class="huge icons">
|
|
<i class="puzzle icon"></i>
|
|
<i class="corner add icon"></i>
|
|
</i>
|
|
</div>
|
|
<div class="another example">
|
|
<i class="huge icons">
|
|
<i class="puzzle icon"></i>
|
|
<i class="top left corner add icon"></i>
|
|
</i>
|
|
<i class="huge icons">
|
|
<i class="puzzle icon"></i>
|
|
<i class="top right corner add icon"></i>
|
|
</i>
|
|
<i class="huge icons">
|
|
<i class="puzzle icon"></i>
|
|
<i class="bottom left corner add icon"></i>
|
|
</i>
|
|
<i class="huge icons">
|
|
<i class="puzzle icon"></i>
|
|
<i class="bottom right corner add icon"></i>
|
|
</i>
|
|
</div>
|
|
<div class="another example">
|
|
<h2 class="ui header">
|
|
<i class="large icons">
|
|
<i class="twitter icon"></i>
|
|
<i class="inverted corner add icon"></i>
|
|
</i>
|
|
Add on Twitter
|
|
</h2>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block footer_script %}
|
|
<script>
|
|
$(document).ready(function () {
|
|
$(".prompt").change(function () {
|
|
$("div.results").html("")
|
|
var keyword = $(this).val()
|
|
$(".example").find("i.icon").each(function () {
|
|
if ($(this).attr("class").indexOf(keyword) !== -1) {
|
|
var html = $(".results").html()
|
|
// console.log($(this).attr("class"))
|
|
html += `<i class="` + $(this).attr("class") + `"></i>`
|
|
$("div.results").html(html)
|
|
}
|
|
})
|
|
})
|
|
$("i.icon").click(function () {
|
|
console.log($(this).attr("class"))
|
|
var icon_class = $(this).attr("class")
|
|
copyText(icon_class)
|
|
$.toast({
|
|
title: 'Icon',
|
|
message: '<i class="' + icon_class + '"></i>复制成功～',
|
|
showProgress: 'bottom',
|
|
classProgress: 'red'
|
|
});
|
|
})
|
|
function copyText(text) {
|
|
var textarea = document.createElement("textarea");
|
|
var currentFocus = document.activeElement;
|
|
document.body.appendChild(textarea);
|
|
textarea.value = text;
|
|
textarea.focus();
|
|
if (textarea.setSelectionRange)
|
|
textarea.setSelectionRange(0, textarea.value.length);
|
|
else
|
|
textarea.select();
|
|
try {
|
|
var flag = document.execCommand("copy");
|
|
} catch (eo) {
|
|
var flag = false;
|
|
}
|
|
document.body.removeChild(textarea);
|
|
currentFocus.focus();
|
|
return flag;
|
|
}
|
|
})
|
|
</script>
|
|
{% endblock %} |