Characters/Colors
Getting a web site to look good can take more than just HTML tags. Web sites are
oftened enhanced with the inclusion of colors to help isolate, or emphasis key content
of the page.
Additionally, since HTML tags use up several of the alphanumeric symbols (such as the
< and the > symbols used to start/end tags), HTML methods (numerical codes) have been
established to allow web pages to contain any character or symbol.
Return to top of document
Standard Colors
Although you can always define colors by their RGB definition, HTML standards have provided
shortcut names for 16 commonly used colors. These names can be used wherever a color value
is required:
| aqua |       
| black |       
| blue |       
| fuchsia |       
|
| gray |       
| green |       
| lime |       
| maroon |       
|
| navy |       
| olive |       
| purple |       
| red |       
|
| silver |       
| teal |       
| white |       
| yellow |       
|
There are several approaches used in the industry to define colors. A
common approach, and the one that is used in web pages, is RGB notation.
All colors can be represented by a combination of just three basic colors -
red, green and blue. For mostly historical reasons, each color has been
divided into 256 intensities (numbered 0 to 255). Thus there are
256x256x256 = 16.8M different colors that RGB can represent.
To limit the number of characters, hexadecimal notation is used instead
of decimal notations. So the color values for each of the red, green,
or blue colors is goes from &00 to &FF (FF is hexadecimal notation for
255). The & symbol is sometimes used to clarify that hexadecimal
notation is being used.
An RGB value of a color is created by placing the red, green, and blue
values side by side, in that order. Black, which consists of the
minimum amount of all three colors is written as &000000 - where each
of the red, green and blue elements of the color have values 00, 00, and
00 respectively.
White, on the other hand, contains the maximum amount of each color and
is written as #FFFFFF - where each of the red, green and blue elements of
the color have values of FF, FF, and FF respectively. HTML uses the £
to denote rgb notation.
When writing colors, it is also common to write a color as rgb(255,255,255),
where the rgb signifies the use of the RGB color notation system, but the
color values are written in decimal notation.
The hexadecimal and rgb values for some sample colors are provided in this next
table:
| Color | Hex Value
| | #000000 | rgb(0,0,0)
| | #FF0000 | rgb(255,0,0)
| | #00FF00 | rgb(0,255,0)
| | #0000FF | rgb(0,0,255)
| | #FFFF00 | rgb(255,255,0)
| | #00FFFF | rgb(0,255,255)
| | #FF00FF | rgb(255,0,255)
| | #C0C0C0 | rgb(192,192,192)
| | #FFFFFF | rgb(255,255,255)
|
Return to top of document
Sample Colors
Here's a sampling of other colors, along with their corresponding HEX value:
| Sample Colors & Hex Codes |
| Code | Color | Code | Color |
Code | Color | Code | Color |
Code | Color | Code | Color |
| 000000 | | 000033 | | 000066 | | 000099 | | 0000cc | | 0000FF | | | 003300 | | 003333 | | 003366 | | 003399 | | 0033cc | | 0033ff | | | 006600 | | 006633 | | 006666 | | 006699 | | 0066cc | | 0066ff | | | 009900 | | 009933 | | 009966 | | 009999 | | 0099cc | | 0099ff | | | 00cc00 | | 00cc33 | | 00cc66 | | 00cc99 | | 00cccc | | 00ccff | | | 00FF00 | | 00ff33 | | 00FF66 | | 00ff99 | | 00FFCC | | 00FFFF | | | 330000 | | 330033 | | 330066 | | 330099 | | 3300cc | | 3300ff | | | 333300 | | 333333 | | 333366 | | 333399 | | 3333cc | | 3333ff | | | 336600 | | 336633 | | 336666 | | 336699 | | 3366cc | | 3366ff | | | 339900 | | 339933 | | 339966 | | 339999 | | 3399cc | | 3399ff | | | 33cc00 | | 33cc33 | | 33cc66 | | 33cc99 | | 33cccc | | 33ccff | | | 33ff00 | | 33FF33 | | 33FF66 | | 33ff99 | | 33FFCC | | 33FFFF | | | 660000 | | 660033 | | 660066 | | 660099 | | 6600cc | | 6600ff | | | 663300 | | 663333 | | 663366 | | 663399 | | 6633cc | | 6633ff | | | 666600 | | 666633 | | 666666 | | 666699 | | 6666cc | | 6666ff | | | 669900 | | 669933 | | 669966 | | 669999 | | 6699cc | | 6699ff | | | 66cc00 | | 66cc33 | | 66cc66 | | 66cc99 | | 66cccc | | 66ccff | |
| 66FF00 | | 66FF33 | | 66ff66 | | 66ff99 | | 66ffcc | | 66FFFF | | | 990000 | | 990033 | | 990066 | | 990099 | | 9900cc | | 9900ff | | | 993300 | | 993333 | | 993366 | | 993399 | | 9933cc | | 9933ff | | | 996600 | | 996633 | | 996666 | | 996699 | | 9966cc | | 9966ff | | | 999900 | | 999933 | | 999966 | | 999999 | | 9999cc | | 9999ff | | | 99cc00 | | 99cc33 | | 99cc66 | | 99cc99 | | 99cccc | | 99ccff | | | 99ff00 | | 99ff33 | | 99ff66 | | 99ff99 | | 99ffcc | | 99ffff | | | cc0000 | | cc0033 | | cc0066 | | cc0099 | | cc00cc | | cc00ff | | | cc3300 | | cc3333 | | cc3366 | | cc3399 | | cc33cc | | cc33ff | | | cc6600 | | cc6633 | | cc6666 | | cc6699 | | cc66cc | | cc66ff | | | cc9900 | | cc9933 | | cc9966 | | cc9999 | | cc99cc | | cc99ff | | | cccc00 | | cccc33 | | cccc66 | | cccc99 | | cccccc | | ccccff | | | ccff00 | | ccff33 | | CCFF66 | | ccff99 | | ccffcc | | ccffff | | | FF0000 | | FF0033 | | ff0066 | | ff0099 | | ff00cc | | FF00FF | | | ff3300 | | ff3333 | | ff3366 | | ff3399 | | ff33cc | | ff33ff | | | ff6600 | | ff6633 | | ff6666 | | ff6699 | | ff66cc | | ff66ff | | | ff9900 | | ff9933 | | ff9966 | | ff9999 | | ff99cc | | ff99ff | | | ffcc00 | | ffcc33 | | ffcc66 | | ffcc99 | | ffcccc | | ffccff | | | FFFF00 | | FFFF33 | | FFFF66 | | ffff99 | | ffffcc | | FFFFFF | |
Return to top of document
Common Characters
HTML uses the ampersand (&) as a signal to the browser that a special character is to be
displayed on the web page. There are two techniques for entering special characters.
The first is to enter an ampersand(&), followed by a pound sign (#), the number of the character entity, and finishing with a semi-colon (;). For example, you could put a copyright symbol on the page like this: &#169; produces the copyright symbol, ©.
The second is to put an ampersand, the name of the character (but no # sign), followed by a semi-colon.
For example, the code &copy also produces the copyright symbol, ©.
The following characters are the ones most commonly used on web pages. Both the character number
and symbol are provided.
| Number | Name | Symbol | Comments
|
|---|
| 34 | quot | " | quotation mark = APL quote |
| 38 | amp | & | ampersand |
| 60 | lt | < | less-than sign |
| 62 | gt | > | greater-than sign |
| 160 | nbsp | | no-break space = non-breaking space |
| 169 | copy | © | copyright sign |
| 174 | reg | ® | registered sign = registered trade mark sign |
| 8226 | bull | • | bullet = black small circle |
Return to top of document
More Symbols
This is a list of several more symbols which may be useful. Both the character number and symbol are provided.
| Number | Name | Symbol | Comments
|
|---|
| 34 | quot | " | quotation mark = APL quote |
| 38 | amp | & | ampersand |
| 60 | lt | < | less-than sign |
| 62 | gt | > | greater-than sign |
| 160 | nbsp | | no-break space = non-breaking space |
| 161 | iexcl | ¡ | inverted exclamation mark |
| 162 | cent | ¢ | cent sign |
| 163 | pound | £ | pound sign |
| 164 | curren | ¤ | currency sign |
| 165 | yen | ¥ | yen sign = yuan sign |
| 166 | brvbar | ¦ | broken bar = broken vertical bar |
| 167 | sect | § | section sign |
| 168 | uml | ¨ | diaeresis = spacing diaeresis |
| 169 | copy | © | copyright sign |
| 170 | ordf | ª | feminine ordinal indicator |
| 171 | laquo | « | left-pointing double angle quotation mark = left pointing guillemet |
| 172 | not | ¬ | not sign |
| 173 | shy | | soft hyphen = discretionary hyphen |
| 174 | reg | ® | registered sign = registered trade mark sign |
| 175 | macr | ¯ | macron = spacing macron = overline = APL overbar |
| 176 | deg | ° | degree sign |
| 177 | plusmn | ± | plus-minus sign = plus-or-minus sign |
| 178 | sup2 | ² | superscript two = superscript digit two = squared |
| 179 | sup3 | ³ | superscript three = superscript digit three = cubed |
| 180 | acute | ´ | acute accent = spacing acute |
| 181 | micro | µ | micro sign |
| 182 | para | ¶ | pilcrow sign = paragraph sign |
| 183 | middot | · | middle dot = Georgian comma = Greek middle dot |
| 184 | cedil | ¸ | cedilla = spacing cedilla |
| 185 | sup1 | ¹ | superscript one = superscript digit one |
| 186 | ordm | º | masculine ordinal indicator |
| 187 | raquo | » | right-pointing double angle quotation mark = right pointing guillemet |
| 188 | frac14 | ¼ | vulgar fraction one quarter = fraction one quarter |
| 189 | frac12 | ½ | vulgar fraction one half = fraction one half |
| 190 | frac34 | ¾ | vulgar fraction three quarters = fraction three quarters |
| 191 | iquest | ¿ | inverted question mark = turned question mark |
| 710 | circ | ˆ | modifier letter circumflex accent |
| 732 | tilde | ˜ | small tilde |
| 913 | Alpha | Α | greek capital letter alpha |
| 914 | Beta | Β | greek capital letter beta |
| 915 | Gamma | Γ | greek capital letter gamma |
| 916 | Delta | Δ | greek capital letter delta |
| 917 | Epsilon | Ε | greek capital letter epsilon |
| 918 | Zeta | Ζ | greek capital letter zeta |
| 919 | Eta | Η | greek capital letter eta |
| 920 | Theta | Θ | greek capital letter theta |
| 921 | Iota | Ι | greek capital letter iota |
| 922 | Kappa | Κ | greek capital letter kappa |
| 923 | Lambda | Λ | greek capital letter lambda |
| 924 | Mu | Μ | greek capital letter mu |
| 925 | Nu | Ν | greek capital letter nu |
| 926 | Xi | Ξ | greek capital letter xi |
| 927 | Omicron | Ο | greek capital letter omicron |
| 928 | Pi | Π | greek capital letter pi |
| 929 | Rho | Ρ | greek capital letter rho there is no Sigmaf, and no U+03A2 character either |
| 931 | Sigma | Σ | greek capital letter sigma |
| 932 | Tau | Τ | greek capital letter tau |
| 933 | Upsilon | Υ | greek capital letter upsilon |
| 934 | Phi | Φ | greek capital letter phi |
| 935 | Chi | Χ | greek capital letter chi |
| 936 | Psi | Ψ | greek capital letter psi |
| 937 | Omega | Ω | greek capital letter omega |
| 945 | alpha | α | greek small letter alpha |
| 946 | beta | β | greek small letter beta |
| 947 | gamma | γ | greek small letter gamma |
| 948 | delta | δ | greek small letter delta |
| 949 | epsilon | ε | greek small letter epsilon |
| 950 | zeta | ζ | greek small letter zeta |
| 951 | eta | η | greek small letter eta |
| 952 | theta | θ | greek small letter theta |
| 953 | iota | ι | greek small letter iota |
| 954 | kappa | κ | greek small letter kappa |
| 955 | lambda | λ | greek small letter lambda |
| 956 | mu | μ | greek small letter mu |
| 957 | nu | ν | greek small letter nu |
| 958 | xi | ξ | greek small letter xi |
| 959 | omicron | ο | greek small letter omicron |
| 960 | pi | π | greek small letter pi |
| 961 | rho | ρ | greek small letter rho |
| 962 | sigmaf | ς | greek small letter final sigma |
| 963 | sigma | σ | greek small letter sigma |
| 964 | tau | τ | greek small letter tau |
| 965 | upsilon | υ | greek small letter upsilon |
| 966 | phi | φ | greek small letter phi |
| 967 | chi | χ | greek small letter chi |
| 968 | psi | ψ | greek small letter psi |
| 969 | omega | ω | greek small letter omega |
| 977 | thetasym | ϑ | greek small letter theta symbol |
| 978 | upsih | ϒ | greek upsilon with hook symbol |
| 982 | piv | ϖ | greek pi symbol |
| 8224 | dagger | † | dagger |
| 8225 | Dagger | ‡ | double dagger |
| 8226 | bull | • | bullet = black small circle |
| 8364 | euro | € | euro sign |
| 8482 | trade | ™ | trade mark sign |
| 8592 | larr | ← | leftwards arrow |
| 8593 | uarr | ↑ | upwards arrow |
| 8594 | rarr | → | rightwards arrow |
| 8595 | darr | ↓ | downwards arrow |
| 8596 | harr | ↔ | left right arrow |
| 8706 | part | ∂ | partial differential |
| 8719 | prod | ∏ | n-ary product = product sign |
| 8721 | sum | ∑ | n-ary sumation |
| 8722 | minus | − | minus sign |
| 8730 | radic | √ | square root = radical sign |
| 8734 | infin | ∞ | infinity |
| 8747 | int | ∫ | integral |
| 8776 | asymp | ≈ | almost equal to = asymptotic to |
| 8800 | ne | ≠ | not equal to |
| 8801 | equiv | ≡ | identical to |
| 8804 | le | ≤ | less-than or equal to |
| 8805 | ge | ≥ | greater-than or equal to |
| 9674 | loz | ◊ | lozenge |
| 9824 | spades | ♠ | black spade suit black here seems to mean filled as opposed to hollow |
| 9827 | clubs | ♣ | black club suit = shamrock |
| 9829 | hearts | ♥ | black heart suit = valentine |
| 9830 | diams | ♦ | black diamond suit |
|