TWiki Documentation Graphics and Filetype icons
This is the TWiki icon library. The graphics can be used in topics and by web applications.Contents:
Usage
There are several ways to put an image in a topic.- Shorthand notation:
%ICON{help}%results in:
- Note that
ICON{}assumes an image of 16 x 16 pixels
- Note that
- Really shorthand notation: in TWiki Preferences set a variable to an ICON, for example:
* Set H = %ICON{help}%
Now you can use the icon by writing%H%. - There are other approaches as well:
- In any topic, write
%PUBURL%/%TWIKIWEB%/TWikiDocGraphics/help.gifto show the
icon.
- You are not restricted to use the TWikiDocGraphics topic - in a similar way you can show attached images by replacing
TWikiDocGraphicswith the topic name. - The TWiki:Plugins.SmiliesPlugin, using a different short hand than
%VARIABLES%, may be worth checking out for extended use
- In any topic, write
- To create an image with a link, write:
[[WebHome][%ICON{home}%]]to get:
- To get the full URL of the icon, use ICONURL:
%ICONURL{"toggleopen"}%gets you:http://www.redbourn.org.uk/pub/System/DocumentGraphics/toggleopen.png(if you paste that in a topic you will get:
)
- Note: Most images have 16x16 pixels. For those images you can use the
%ICON{}%syntax. Use an HTML img tag with%ICONURL{}%for image with other sizes.
Graphics
Document icons
| File Name | Description | Write... | |
|---|---|---|---|
 |
bubble.gif |
Speech bubble | %ICON{bubble}% |
 |
days.gif |
Days, Calendar | %ICON{days}% |
 |
download.gif |
Download | %ICON{download}% |
 |
filter.gif |
Filter | %ICON{filter}% |
 |
gear.gif |
Gear | %ICON{gear}% |
 |
globe.gif |
Globe | %ICON{globe}% |
 |
hand.gif |
Pointing hand | %ICON{hand}% |
 |
help.gif |
Help | %H%, %ICON{help}% |
 |
info.gif |
Info | %ICON{info}% |
 |
hourglass.gif |
Hour glass (clock) | %ICON{hourglass}% |
 |
more.gif |
Read more | %ICON{more}% |
 |
more-small.gif |
Read more, 13x13 | <img src="%ICONURL{more-small}%" width="13" height="13" alt="Read more" border="0" /> |
 |
move.gif |
Move | %ICON{move}% |
 |
note.gif |
Note | %ICON{note}% |
 |
parked.gif |
Parked | %ICON{parked}% |
 |
pencil.gif |
Pencil / Refactor / Edit | %P%, %ICON{pencil}% |
 |
rfc.gif |
Request for comments | %ICON{rfc}% |
 |
sort.gif |
Sort | %ICON{sort}% |
 |
stargold.gif |
Gold star, favorites | %ICON{stargold}% |
 |
starred.gif |
Red star, highlight | %S%, %ICON{starred}% |
 |
stop.gif |
Stop | %ICON{stop}% |
 |
target.gif |
Target | %ICON{target}% |
 |
tip.gif |
Tip, idea | %T%, %ICON{tip}% |
 |
warning.gif |
Warning, important | %W%, %ICON{warning}% |
 |
watch.gif |
Watch | %ICON{watch}% |
 |
wip.gif |
Work in progress, under construction | %ICON{wip}% |
 |
wrench.gif |
Wrench, tools | %ICON{wrench}% |
Topic, 
file, 
folder icons
| File Name | Description | Write... | |
|---|---|---|---|
 |
viewtopic.gif |
View topic | %ICON{viewtopic}% |
 |
printtopic.gif |
Print topic | %ICON{printtopic}% |
 |
refreshtopic.gif |
Refresh topic | %ICON{refreshtopic}% |
 |
newtopic.gif |
New topic | %ICON{newtopic}% |
 |
edittopic.gif |
Edit topic | %ICON{edittopic}% |
 |
save.gif |
Save | %ICON{save}% |
 |
attachfile.gif |
Attach file | %ICON{attachfile}% |
| |
download.gif |
Download | %ICON{download}% |
 |
trash.gif |
Trash | %ICON{trash}% |
 |
searchtopic.gif |
Search topic | %ICON{searchtopic}% |
 |
search-small.gif |
Small search button, 13x13 | <img src="%ICONURL{search-small}%" width="13" height="13" alt="Search" border="0" /> |
 |
topicbacklinks.gif |
Topic back-links | %ICON{topicbacklinks}% |
 |
topicdiffs.gif |
Topic difference | %ICON{topicdiffs}% |
 |
statistics.gif |
Statistics | %ICON{statistics}% |
 |
index.gif |
Index | %ICON{index}% |
 |
indexlist.gif |
Index list | %ICON{indexlist}% |
 |
cachetopic.gif |
Cache topic | %ICON{cachetopic}% |
 |
folder.gif |
Folder | %ICON{folder}% |
Person, 
group, 
access icons
| File Name | Description | Write... | |
|---|---|---|---|
 |
person.gif |
Person | %ICON{person}% |
 |
persons.gif |
Persons | %ICON{persons}% |
 |
group.gif |
Group | %ICON{group}% |
 |
building.gif |
Building | %ICON{building}% |
 |
buildings.gif |
Buildings | %ICON{buildings}% |
 |
logout.gif |
Log out | %ICON{logout}% |
 |
key.gif |
Key | %ICON{key}% |
 |
lock.gif |
Lock | %ICON{lock}% |
 |
locktopic.gif |
Locked topic | %ICON{locktopic}% |
 |
locktopicgray.gif |
Locked topic, gray | %ICON{locktopicgray}% |
 |
lockfolder.gif |
Locked folder | %ICON{lockfolder}% |
 |
lockfoldergray.gif |
Locked folder, gray | %ICON{lockfoldergray}% |
Changes, 
notification icons
| File Name | Description | Write... | |
|---|---|---|---|
 |
changes.gif |
Changes | %ICON{changes}% |
 |
changes-small.gif |
Changes (small), 13x13 | <img src="%ICONURL{changes-small}%" width="13" height="13" alt="Changes" border="0" /> |
 |
recentchanges.gif |
Recent changes | %ICON{recentchanges}% |
 |
mail.gif |
%ICON{mail}% |
|
 |
notify.gif |
Notify | %ICON{notify}% |
 |
rss-feed.gif |
RSS feed, 36x14 | <img src="%ICONURL{rss-feed}%" width="36" height="14" alt="RSS feed" border="0" /> |
 |
rss-small.gif |
RSS feed | %ICON{rss-small}% |
 |
xml-feed.gif |
XML feed, 36x14 | <img src="%ICONURL{xml-feed}%" width="36" height="13" alt="XML feed" border="0" /> |
 |
xml-small.gif |
XML feed | %ICON{xml-small}% |
Status, 
flag, 
LED icons
| File Name | Description | Write... | |
|---|---|---|---|
 |
new.gif |
NEW, 30x16 | %N%, <img src="%ICONURL{new}%" width="30" height="16" alt="New" border="0" /> |
 |
todo.gif |
TODO, 37x16 | <img src="%ICONURL{todo}%" width="37" height="16" alt="TODO" border="0" /> |
 |
updated.gif |
UPDATED, 55x16 | %U%, <img src="%ICONURL{updated}%" width="55" height="16" alt="UPDATED" border="0" /> |
 |
done.gif |
DONE, 37x16 | <img src="%ICONURL{done}%" width="37" height="16" alt="Done" border="0" /> |
 |
closed.gif |
CLOSED, 48x16 | <img src="%ICONURL{closed}%" width="48" height="16" alt="Closed" border="0" /> |
 |
minus.gif |
Minus | %ICON{minus}% |
 |
plus.gif |
Plus | %ICON{plus}% |
 |
choice-cancel.gif |
Cancel | %ICON{choice-cancel}% |
 |
choice-no.gif |
No | %ICON{choice-no}% |
 |
choice-yes.gif |
Yes / Done | %Y%, %ICON{choice-yes}% |
 |
unchecked.gif |
Unchecked checkbox | %ICON{unchecked}% |
 |
checked.gif |
Checked checkbox | %ICON{checked}% |
 |
flag.gif |
Flag | %ICON{flag}% |
 |
flag-gray.gif |
Gray flag | %ICON{flag-gray}% |
 |
flag-gray-small.gif |
Small gray flag, 13x13 | <img src="%ICONURL{flag-gray-small}%" width="13" height="13" alt="Flag" border="0" /> |
 |
led-aqua.gif |
Aqua led | %ICON{led-aqua}% |
 |
led-blue.gif |
Blue led | %ICON{led-blue}% |
 |
led-gray.gif |
Gray led | %ICON{led-gray}% |
 |
led-green.gif |
Green led | %ICON{led-green}% |
 |
led-orange.gif |
Orange led | %ICON{led-orange}% |
 |
led-purple.gif |
Purple led | %ICON{led-purple}% |
 |
led-red.gif |
Red led | %ICON{led-red}% |
 |
led-yellow.gif |
Yellow led | %ICON{led-yellow}% |
 |
led-box-aqua.gif |
Aqua led | %ICON{led-box-aqua}% |
 |
led-box-blue.gif |
Blue led | %ICON{led-box-blue}% |
 |
led-box-gray.gif |
Gray led | %ICON{led-box-gray}% |
 |
led-box-green.gif |
Green led | %ICON{led-box-green}% |
 |
led-box-orange.gif |
Orange led | %ICON{led-box-orange}% |
 |
led-box-purple.gif |
Purple led | %ICON{led-box-purple}% |
 |
led-box-red.gif |
Red led | %ICON{led-box-red}% |
 |
led-box-yellow.gif |
Yellow led | %ICON{led-box-yellow}% |
Navigation icons
| File Name | Description | Write... | |
|---|---|---|---|
 |
home.gif |
Home | %ICON{home}% |
 |
external.gif |
External site | %ICON{external}% |
 |
arrowdot.gif |
Meet here (arrows to red dot) | %ICON{arrowdot}% |
 |
left.gif |
Left | %ICON{left}% |
 |
right.gif |
Right | %ICON{right}% |
 |
up.gif |
Up | %ICON{up}% |
 |
down.gif |
Down | %ICON{down}% |
 |
arrowbleft.gif |
Arrow blue left | %ICON{arrowbleft}% |
 |
arrowbright.gif |
Arrow blue right | %ICON{arrowbright}% |
 |
arrowbup.gif |
Arrow blue up | %ICON{arrowbup}% |
 |
arrowbdown.gif |
Arrow blue down | %ICON{arrowbdown}% |
 |
arrowleft.gif |
Arrow left | %ICON{arrowleft}% |
 |
arrowright.gif |
Arrow right | %M%, %ICON{arrowright}% |
 |
arrowup.gif |
Arrow up | %ICON{arrowup}% |
 |
arrowdown.gif |
Arrow down | %ICON{arrowdown}% |
 |
go_start.gif |
Go to start | %ICON{go_start}% |
 |
go_fb.gif |
Go fast back | %ICON{go_fb}% |
 |
go_back.gif |
Go back | %ICON{go_back}% |
 |
go_forward.gif |
Go forward | %ICON{go_forward}% |
 |
go_ff.gif |
Go fast forward | %ICON{go_ff}% |
 |
go_end.gif |
Go to end | %ICON{go_end}% |
Interface icons
 |
monospace.gif |
Monospace | %ICON{monospace}% |
|---|---|---|---|
 |
proportional.gif |
Proportional | %ICON{proportional}% |
 |
toggleopen.gif |
Open toggle, Twisty open toggle | %ICON{toggleopen}% |
 |
toggleclose.gif |
Close toggle, Twisty close toggle | %ICON{toggleclose}% |
 |
toggleopen-small.gif |
Open toggle, Twisty open toggle | %ICON{toggleopen-small}% |
 |
toggleclose-small.gif |
Close toggle, Twisty close toggle | %ICON{toggleclose-small}% |
 |
toggleopen-mini.gif |
Open toggle, Twisty open toggle | <img src="%ICONURL{toggleopen-mini}%" width="7" height="9" alt="Open" border="0" /> |
 |
toggleclose-mini.gif |
Close toggle, Twisty close toggle | <img src="%ICONURL{toggleclose-mini}%" width="7" height="9" alt="Close" border="0" /> |
 |
toggleopenleft.gif |
Open toggle, Twisty open toggle | %ICON{toggleopenleft}% |
 |
toggleopenleft-small.gif |
Open toggle, Twisty open toggle | %ICON{toggleopenleft-small}% |
 |
web-bg.gif |
Web background, used in Web Left Bar Webs List | %ICON{web-bg}% |
 |
web-bg-small.gif |
Web background, 13x13 | <img src="%ICONURL{web-bg-small}%" width="13" height="13" alt="Web" border="0" /> |
Block graphics
| File Name | Description | Write... | |
|---|---|---|---|
 |
line_ld.gif |
Line graph left-down | %ICON{line_ld}% |
 |
line_lr.gif |
Line graph left-right | %ICON{line_lr}% |
 |
line_lrd.gif |
Line graph left-right-down | %ICON{line_lrd}% |
 |
line_rd.gif |
Line graph right-down | %ICON{line_rd}% |
 |
line_ud.gif |
Line graph up-down | %ICON{line_ud}% |
 |
line_udl.gif |
Line graph up-down-left | %ICON{line_udl}% |
 |
line_udlr.gif |
Line graph up-down-left-right | %ICON{line_udlr}% |
 |
line_udr.gif |
Line graph up-down-right | %ICON{line_udr}% |
 |
line_ul.gif |
Line graph up-left | %ICON{line_ul}% |
 |
line_ulr.gif |
Line graph up-left-right | %ICON{line_ulr}% |
 |
line_ur.gif |
Line graph up-right | %ICON{line_ur}% |
 |
dot_ld.gif |
Dot graph left-down | %ICON{dot_ld}% |
 |
dot_lr.gif |
Dot graph left-right | %ICON{dot_lr}% |
 |
dot_lrd.gif |
Dot graph left-right-down | %ICON{dot_lrd}% |
 |
dot_rd.gif |
Dot graph right-down | %ICON{dot_rd}% |
 |
dot_ud.gif |
Dot graph up-down | %ICON{dot_ud}% |
 |
dot_udl.gif |
Dot graph up-down-left | %ICON{dot_udl}% |
 |
dot_udlr.gif |
Dot graph up-down-left-right | %ICON{dot_udlr}% |
 |
dot_udr.gif |
Dot graph up-down-right | %ICON{dot_udr}% |
 |
dot_ul.gif |
Dot graph up-left | %ICON{dot_ul}% |
 |
dot_ulr.gif |
Dot graph up-left-right | %ICON{dot_ulr}% |
 |
dot_ur.gif |
Dot graph up-right | %ICON{dot_ur}% |
 |
empty.gif |
Empty transparent 16x16 spacer | %ICON{empty}% |
Filetype icons
Filetype icons are used by the attachment table and are seldom used in topics. Write %ICON{pdf}% to show the 
icon.
| File Name | Name | Write... | |
|---|---|---|---|
 |
as.gif |
ActionScript | %ICON{as}% |
 |
bat.gif |
MS-DOS batch file | %ICON{bat}% |
 |
bmp.gif |
Bitmap | %ICON{bmp}% |
 |
c.gif |
C source code file | %ICON{c}% |
 |
dll.gif |
Dynamic Linked Library; Microsoft application file | %ICON{dll}% |
 |
doc.gif |
Microsoft Word file | %ICON{doc}% |
 |
else.gif |
Unknown file format | %ICON{else}% |
 |
eml.gif |
Microsoft Outlook e-mail file | %ICON{eml}% |
 |
exe.gif |
Microsoft Executable file | %ICON{exe}% |
 |
fla.gif |
Macromedia Flash Movie | %ICON{fla}% |
 |
fon.gif |
Windows bitmapped font file | %ICON{fon}% |
 |
gif.gif |
GIF | %ICON{gif}% |
 |
h.gif |
Header file | %ICON{h}% |
 |
hlp.gif |
Standard help file | %ICON{hlp}% |
 |
html.gif |
HTML | %ICON{html}% |
 |
java.gif |
Java source code file | %ICON{java}% |
 |
jpg.gif |
JPEG | %ICON{jpg}% |
 |
js.gif |
JavaScript | %ICON{js}% |
 |
mdb.gif |
Microsoft Access database File | %ICON{mdb}% |
 |
mov.gif |
Quicktime movie | %ICON{mov}% |
 |
mp3.gif |
MP3 | %ICON{mp3}% |
 |
pdf.gif |
%ICON{pdf}% |
|
 |
pl.gif |
Perl source code file | %ICON{pl}% |
 |
png.gif |
PNG | %ICON{png}% |
 |
ppt.gif |
PowerPoint | %ICON{ppt}% |
 |
ps.gif |
Postscript | %ICON{ps}% |
 |
py.gif |
Python source code file | %ICON{py}% |
 |
ram.gif |
RealAudio | %ICON{ram}% |
 |
reg.gif |
Registry file | %ICON{reg}% |
 |
sh.gif |
Unix shell script | %ICON{sh}% |
 |
sniff.gif |
sniff | %ICON{sniff}% |
 |
swf.gif |
SWF (Shockwave Flash) | %ICON{swf}% |
 |
ttf.gif |
True Type font | %ICON{ttf}% |
 |
txt.gif |
Text | %ICON{txt}% |
 |
wav.gif |
Waveform sound file | %ICON{wav}% |
 |
wri.gif |
Windows Write | %ICON{wri}% |
 |
xls.gif |
Microsoft Excel Spreadsheet | %ICON{xls}% |
 |
xml.gif |
XML | %ICON{xml}% |
 |
xsl.gif |
XSL (XML style sheet) | %ICON{xsl}% |
 |
zip.gif |
Compressed Zip archive | %ICON{zip}% |
TWiki icons
| File Name | Description | Write... | |
|---|---|---|---|
 |
twiki.gif |
TWiki logo | %ICON{twiki}% |
Topic revision: r1 - 22 Sep 2005 - 23:59:45 - TWiki Contributor
Main
}Copyright © We make no guarantee of the correctness of the content of this site. All material on this collaboration platform is the property of Martin Cleaver and the contributing authors.