ICONs - Joomla! - the dynamic portal engine and content management system

Attention: open in a new window.

ICON Typography

Icon's in Typography can be used to add character to your content, or just make your list look better.

Examples of <ul> Elements with class's set as follows:
Small	Big
Check Box (class="checkbox") with a line break This is a Nested UL Another Item	Check Box (class="checkbox-big") This is a Nested UL Another Item
Check (class="check") Another Item	Check (class="check-big") Another Item
Star (class="star") Another Item	Star (class="star-big") Another Item
Plus (class="plus") Another Item	Plus (class="plus-big") Another Item
Minus (class="minus") Another Item	Minus (class="minus-big") Another Item
Multiply (class="multiply") Another Item	Multiply (class="multiply-big") Another Item
Divide (class="divide") Another Item	Divide (class="divide-big") Another Item
Equals (class="equals") Another Item	Equals (class="equals-big") Another Item
Alert (class="alert") Another Item	Alert (class="alert-big") Another Item
Info (class="info") Another Item	Info (class="info-big") Another Item
Directory (class="directory") Another Item	Directory (class="directory-big") Another Item
File (class="file") Another Item	File (class="file-big") Another Item
Note (class="note") Another Item	(class="note-big") Another Item
Download (class="download") Another Item	Download (class="download-big") Another Item
Tips (class="tips") Another Item	Tips (class="tips-big") Another Item
Disc (class="disc") Another Item	Disc (class="disc-big") Another Item
Arrow (class="arrow") Another Item	Arrow (class="arrow-big") Another Item
Arrow Right (class="arrowright") Another Item	Arrow Right (class="arrowright-big") Another Item
Arrow Left (class="arrowleft") Another Item	Arrow Left (class="arrowleft-big") Another Item
Arrow Up (class="arrowup") Another Item	Arrow Up (class="arrowup-big") Another Item
Arrow Down (class="arrowdown") Another Item	Arrow Down (class="arrowdown-big") Another Item
Error (class="error") Another Item	Error (class="error-big") Another Item
Help (class="help") Another Item	Help (class="help-big") Another Item
Print (class="print") Another Item	Print (class="print-big") Another Item
View (class="view") Another Item	View (class="view-big") Another Item
Light On (class="lighton") Another Item	Light On (class="lighton-big") Another Item
Light Off (class="lightoff") Another Item	Light Off (class="lightoff-big") Another Item
Lightning (class="lightning") Another Item	Lightning (class="lightning-big") Another Item
Time (class="time") Another Item	Time (class="time-big") Another Item
Toilet (class="toilet") Another Item	Toilet (class="toilet-big") Another Item
Recycle (class="recycle") Another Item	Recycle (class="recycle-big") Another Item
Bullet 38 (class="bullet38") Another Item	Bullet 38 (class="bullet38-big") Another Item
Highlight (class="highlight") Another Item	Highlight (class="highlight-big") Another Item

Smiley Face Emotions
Small	Big
Face Smiley (class="facesmiley") Another Item	Face Smiley (class="facesmiley-big") Another Item
Face Sad (class="facesad") Another Item	Face Sad (class="facesad-big") Another Item
Face Straight (class="facestraight") Another Item	Face Straight (class="facestraight-big") Another Item
Face Bad (class="facebad") Another Item	Face Bad (class="facebad-big") Another Item
Face Down (class="facedown") Another Item	Face Down (class="facedown-big") Another Item
Face Grad (class="facegrad") Another Item	Face Grad (class="facegrad-big") Another Item
Face Grin (class="facegrin") Another Item	Face Grin (class="facegrin-big") Another Item
Face Ooo (class="faceooo") Another Item	Face Ooo (class="faceooo-big") Another Item
Face Prozac (class="faceprozac") Another Item	Face Prozac (class="faceprozac-big") Another Item
Face Shades (class="faceshades") Another Item	Face Shades (class="faceshades-big") Another Item
Face Specs (class="facespecs") Another Item	Face Specs (class="facespecs-big") Another Item
Face Surprise (class="facesurprise") Another Item	Face Surprise (class="facesurprise-big") Another Item
Face Tongue (class="facetongue") Another Item	Face Tongue (class="facetongue-big") Another Item
Face Unsure (class="faceunsure") Another Item	Face Unsure (class="faceunsure-big") Another Item
Face Wink (class="facewink") Another Item	Face Wink (class="facewink-big") Another Item
Face Yuck (class="faceyuck") Another Item	Face Yuck (class="faceyuck-big") Another Item

Examples using <div> Elements with class="x" <div class="checkbox">Text Here</div> Example using <span> Elements with class="x": <span class="checkbox">Text Here</span>
Small	Big
Check Box (class="checkbox") with text and line break	Check Box (class="checkbox-big") with text and line break
Check (class="check") with text and line break	Check (class="check-big") with text and line break
Star (class="star") with text and line break	Star (class="star-big") with text and line break
Plus (class="plus") with text and line break	Plus (class="plus-big") with text and line break
Minus (class="minus") with text and line break	Minus (class="minus-big") with text and line break
Multiply (class="multiply") with text and line break	Multiply (class="multiply-big") with text and line break
Divide (class="divide") with text and line break	Divide (class="divide-big") with text and line break
Equals (class="equals") with text and line break	Equals (class="equals-big") with text and line break
Alert (class="alert") with text and line break	Alert (class="alert-big") with text and line break
Info (class="info") with text and line break	Info (class="info-big") with text and line break
Directory (class="directory") with text and line break	Directory (class="directory-big") with text and line break
File (class="file") with text and line break	File (class="file-big") with text and line break
Note (class="note") with text and line break	Note (class="note-big") with text and line break
Download (class="download") with text and line break	Download (class="download-big") with text and line break
Tip (class="tips") with text and line break	Tip (class="tips-big") with text and line break
Disc (class="disc") with text and line break	Disc (class="disc-big") with text and line break
Arrow (class="arrow") with text and line break	Arrow (class="arrow-big") with text and line break
Arrow Right (class="arrowright") with text and line break	Arrow Right (class="arrowright-big") with text and line break
Arrow Left (class="arrowleft") with text and line break	Arrow Left (class="arrowleft-big") with text and line break
Arrow Up (class="arrowup") with text and line break	Arrow Up (class="arrowup-big") with text and line break
Arrow Down (class="arrowdown") with text and line break	Arrow Down (class="arrowdown-big") with text and line break
Error (class="error") with text and line break	Error (class="error-big") with text and line break
Help (class="help") with text and line break	Help (class="help-big") with text and line break
Print (class="print") with text and line break	Print (class="print-big") with text and line break
View (class="view") with text and line break	View (class="view-big") with text and line break
Light On (class="lighton") with text and line break	Light On (class="lighton-big") with text and line break
Light Off (class="lightoff") with text and line break	Light Off (class="lightoff-big") with text and line break
Lightning (class="lightning") with text and line break	Lightning (class="lightning-big") with text and line break
Time (class="time") with text and line break	Time (class="time-big") with text and line break
Toilet (class="toilet") with text and line break	Toilet (class="toilet-big") with text and line break
Recycle (class="recycle") with text and line break	Recycle (class="recycle-big") with text and line break
Bullet 38 (class="bullet38") with text and line break	Bullet 38 (class="bullet38-big") with text and line break
Highlight (class="highlight") with text and line break	Highlight (class="highlight-big") with text and line break
Face Smiley (class="facesmiley") with text and line break	Face Smiley (class="facesmiley-big") with text and line break
Face Sad (class="facesad") with text and line break	Face Sad (class="facesad-big") with text and line break
Face Straight (class="facestraight") with text and line break	Face Straight (class="facestraight-big") with text and line break
Face Bad (class="facebad") with text and line break	Face Bad (class="facebad-big") with text and line break
Face Down (class="facedown") with text and line break	Face Down (class="facedown-big") with text and line break
Face Grad (class="facegrad") with text and line break	Face Grad (class="facegrad-big") with text and line break
Face Grin (class="facegrin") with text and line break	Face Grin (class="facegrin-big") with text and line break
Face Ooo (class="faceooo") with text and line break	Face Ooo (class="faceooo-big") with text and line break
Face Prozac (class="faceprozac") with text and line break	Face Prozac (class="faceprozac-big") with text and line break
Face Shades (class="faceshades") with text and line break	Face Shades (class="faceshades-big") with text and line break
Face Specs (class="facespecs") with text and line break	Face Specs (class="facespecs-big") with text and line break
Face Surprise (class="facesurprise") with text and line break	Face Surprise (class="facesurprise-big") with text and line break
Face Tongue (class="facetongue") with text and line break	Face Tongue (class="facetongue-big") with text and line break
Face Unsure (class="faceunsure") with text and line break	Face Unsure (class="faceunsure-big") with text and line break
Face Wink (class="facewink") with text and line break	Face Wink (class="facewink-big") with text and line break
Face Yuck (class="faceyuck") with text and line break	Face Yuck (class="faceyuck-big") with text and line break

Ordinary List

Item
Another Item
Another Item
Another Item
Another Item
Another Item
Another Item
Another Item
Another Item
Another Item

Small Disc List

Item
Note: We DO NOT support Nesting or Line Wraps
Another Item
Another Item
Another Item
Another Item
Another Item
Another Item
Another Item
Until we get to double digits

Big Disc List

Item
Note: We DO NOT
support Nesting
or Line Wraps
Another Item
Another Item
Another Item
Another Item
Another Item
Until we get to double digits