• HTML Tags / Codes / Web Page Design
  • 216 Web Safe Colors Hexadecimal RGB Values
  • ASCII Character Codes Chart (Symbols)

  • HTML Tags / Codes / Web Page Design


    If you're doing business on the Internet, taking the time to learn how to design your own web site and write your own HTML code (hypertext markup language) will play a major role in your success. Not only will learning HTML coding provide you with the freedom to update your own HTML documents, but it will also save you a great deal of money, as you will be able to avoid hiring a professional web designer.

    If you're looking for some HTML tags to spice up your web site, you've come to the right place. You will find a variety of HTML codes and tips to assist you below.

    However, before reviewing the HTML tags, if you're new to HTML and web site design, the following section will assist you in creating an HTML web page. For additional web site design information, make sure you don't miss the web design articles and tutorials at the bottom of this page.

    Creating an HTML Page

    A web page is created using a language called, Hypertext Markup Language, better known as HTML Code. You can write your own coding within a plain text editor, such as Note Pad, or use an HTML editor, which will write the code for you.

    HTML codes, also referred to as HTML tags, are enclosed by the lesser than (<) and greater than (>) brackets and may be written in capital or lower case letters.

    The opening bracket is followed by an element, which is a browser command, and ends with the closing bracket.

    font size=2

    An element may also be followed by attributes, which are words describing the properties of the element, and further instruct the browser.

    Attributes are only contained in the opening HTML tags to the right of the element and are separated by a space and followed by an equal (=) sign.

    The value follows the equal sign and is enclosed in quotes.

    font size=2

    Basic HTML Document Code Structure

    Begin writing your HTML tags by creating your document's basic layout. Copy and paste this code into your text or HTML editor.

    HTML
    HEAD
    TITLE Your Page Title
    TITLE
    HEAD
    BODY

    This area will contain everything that will be visible through a web browser, such as text and graphics. All of the information will be HTML coded.

    For a complete list of HTML codes, tags and examples, see the HTML chart below.

    BODY
    HTML

    HTML - Begins your HTML document.
    HEAD - Contains information about the page such as the TITLE, META tags for proper Search Engine indexing, STYLE tags, which determine the page layout, and JavaScript coding for special effects.
    TITLE - The TITLE of your page. This will be visible in the title bar of the viewers’ browser.
    TITLE - Closes the HTML TITLE tag.
    HEAD - Closes the HTML HEAD tag.
    BODY - This is where you will begin writing your document and placing your HTML codes.
    BODY - Closes the HTML BODY tag.
    HTML - Closes the HTML tag.

    How to Copy and Paste HTML Tags / Codes

    To copy and paste the HTML tags / codes from the HTML chart below into the HTML of your web page, place your mouse pointer over the beginning of the HTML code you would like to copy. Next, click and hold your left mouse button and drag your mouse over all the HTML code you would like to copy (Example of highlighted text). Your HTML code should now be highlighted. Go to "Edit" - "Copy" on your web browser's toolbar and then place your cursor within your HTML code where you would like to place the code. Right click on your mouse and go to "Paste." Your HTML code should now be displaying within your HTML document.


    HTML Tags Chart

    To use any of the following HTML tags, simply select the HTML code you'd like and copy and paste it into your web page.

    Tag

    Name

    Code Example

    Browser View

    <!-- comment <!--This can be viewed in the HTML part of a document--> Nothing will show (Tip)
    <A - anchor <A HREF="http://www.yourdomain.com/">Visit Our Site</A> Visit Our Site (Tip)
    <B> bold <B>Example</B> Example
    <BIG> big (text) <BIG>Example</BIG> Example (Tip)
    <BODY> body of HTML document <BODY>The content of your HTML page</BODY> Contents of your web page (Tip)
    <BR> line break The contents of your page<BR>The contents of your page The contents of your web page
    The contents of your web page
    <CENTER> center <CENTER>This will center your contents</CENTER>

    This will center your contents

    <DD> definition description <DL>
    <DT>Definition Term
    <DD>Definition of the term
    <DT>Definition Term
    <DD>Definition of the term
    </DL>
    Definition Term
    Definition of the term
    Definition Term
    Definition of the term
    <DL> definition list <DL>
    <DT>Definition Term
    <DD>Definition of the term
    <DT>Definition Term
    <DD>Definition of the term
    </DL>
    Definition Term
    Definition of the term
    Definition Term
    Definition of the term
    <DT> definition term <DL>
    <DT>Definition Term
    <DD>Definition of the term
    <DT>Definition Term
    <DD>Definition of the term
    </DL>
    Definition Term
    Definition of the term
    Definition Term
    Definition of the term
    <EM> emphasis This is an <EM>Example</EM> of using the emphasis tag This is an Example of using the emphasis tag
    <EMBED>
    embed object <EMBED src="yourfile.mid" width="100%" height="60" align="center">
    (Tip)
    <EMBED> embed object <EMBED src="yourfile.mid" autostart="true" hidden="false" loop="false">
    <noembed><bgsound src="yourfile.mid" loop="1"></noembed>

    <bgsound src="wonderfu.mid" autostart="false" loop="1">
    Music will begin playing when your page is loaded and will only play one time. A control panel will be displayed to enable your visitors to stop the music.
    <FONT> font <FONT FACE="Times New Roman">Example</FONT> Example (Tip)
    <FONT> font <FONT FACE="Times New Roman" SIZE="4">Example</FONT> Example (Tip)
    <FONT> font <FONT FACE="Times New Roman" SIZE="+3" COLOR="#FF0000">Example</FONT> Example (Tip)
    <FORM> form <FORM action="mailto:you@yourdomain.com">
    Name: <INPUT name="Name" value="" size="10"><BR>
    Email: <INPUT name="Email" value="" size="10"><BR>
    <CENTER><INPUT type="submit"></CENTER>
    </FORM>
    Name: (Tip)
    Email:
    <H1> heading 1 <H1>Heading 1 Example</H1>

    Heading 1 Example

    <H2> heading 2 <H2>Heading 2 Example</H2>

    Heading 2 Example

    <H3> heading 3 <H3>Heading 3 Example</H3>

    Heading 3 Example

    <H4> heading 4 <H4>Heading 4 Example</H4>

    Heading 4 Example

    <H5> heading 5 <H5>Heading 5 Example</H5>
    Heading 5 Example
    <H6> heading 6 <H6>Heading 6 Example</H6>
    Heading 6 Example
    <HEAD> heading of HTML document <HEAD>Contains elements describing the document</HEAD> Nothing will show
    <HR> horizontal rule <HR>
    Contents of your web page (Tip)

    Contents of your web page
    <HR> horizontal rule <HR WIDTH="50%" SIZE="3"> Contents of your web page

    Contents of your web page
    <HR> horizontal rule <HR WIDTH="50%" SIZE="3" NOSHADE> Contents of your web page

    Contents of your web page
    <HR>
    (Internet
    Explorer)
    horizontal rule <HR WIDTH=";75%" COLOR="#FF0000" SIZE="4"> Contents of your web page

    Contents of your web page
    <HR>
    (Internet
    Explorer)
    horizontal rule <HR WIDTH="25%" COLOR="#6699FF" SIZE="6"> Contents of your web page

    Contents of your web page
    &;lt;HTML>; hypertext markup language <HTML><HEAD><META>&;lt;TITLE>Title of your web page</TITLE></HEAD><BODY>HTML web page contents</BODY></HTML> Contents of your web page
    <I> italic <I>Example</I> Example
    <IMG> image <IMG SRC="Earth.gif" WIDTH="41" HEIGHT="41" BORDER="0" ALT="a sentence about your web site"> a sentence about your site (Tip)
    <INPUT> input field Example 1:

    <FORM METHOD=post ACTION="/cgi-bin/example.cgi">
    <INPUT type="text" size="10" maxlength="30">
    <INPUT type="Submit" VALUE="Submit">
    </FORM>
    Example 1: (Tip)

    <INPUT>
    (Internet Explorer)
    input field Example 2:

    <FORM METHOD=post ACTION="/cgi-bin/example.cgi">
    <INPUT type="text" STYLE="color: #FFFFFF; font-family: Verdana; font-weight: bold; font-size: 12px; background-color: #72A4D2;" size="10" maxlength="30">
    <INPUT type="Submit" VALUE="Submit">
    </FORM>
    Example 2: (Tip)

    <INPUT> input field Example 3:

    <FORM METHOD=post ACTION="/cgi-bin/example.cgi">
    <TABLE BORDER="0" CELLSPACING="0" CELLPADDING="2"><TR><TD BGCOLOR="#8463FF"><INPUT type="text" size="10" MAXLENGTH="30"></TD><TD BGCOLOR="#8463FF" VALIGN="Middle"> <INPUT type="image" name="submit" src="yourimage.gif"></TD></TR> </TABLE>
    </FORM>
    Example 3: (Tip)

    <INPUT> input field Example 4:

    <FORM METHOD=post ACTION="/cgi-bin/example.cgi">
    Enter Your Comments:<BR>
    <TEXTAREA wrap="virtual" name="Comments" rows=3 cols=20 MAXLENGTH=100></TEXTAREA><BR>
    <INPUT type="Submit" VALUE="Submit">
    <INPUT type="Reset" VALUE="Clear">
    </FORM>
    Example 4: (Tip)


    <INPUT> input field Example 5:

    <FORM METHOD=post ACTION="/cgi-bin/example.cgi">
    <CENTER>
    Select an option:
    <SELECT>
    <OPTION >option 1
    <OPTION SELECTED>option 2
    <OPTION>option 3
    <OPTION>option 4
    <OPTION>option 5
    <OPTION>option 6
    </SELECT><BR>
    <INPUT type="Submit" VALUE="Submit"></CENTER>
    </FORM>

    Example 5: (Tip)

    Select an option:

    <INPUT> input field Example 6:

    <FORM METHOD=post ACTION="/cgi-bin/example.cgi">
    Select an option:<BR>
    <INPUT type="radio" name="option"> Option 1
    <INPUT type="radio" name="option" CHECKED> Option 2
    <INPUT type="radio" name="option"> Option 3
    <BR>
    <BR>
    Select an option:<BR>
    <INPUT type="checkbox" name="selection"> Selection 1
    <INPUT type="checkbox" name="selection" CHECKED> Selection 2
    <INPUT type="checkbox" name="selection"> Selection 3
    <INPUT type="Submit" VALUE="Submit">
    </FORM>
    Example 6: (Tip)

    Select an option:
    Option 1
    Option 2
    Option 3

    Select an option:
    Selection 1
    Selection 2
    Selection 3
    <LI> list item Example 1:

    <MENU>
    <LI type="disc">List item 1
    <LI type="circle">List item 2
    <LI type="square">List item 3
    </MENU>


    Example 2:

    <OL type="i">
    <LI>List item 1
    <LI>List item 2
    <LI>List item 3
    <LI>List item 4
    </OL>
    Example 1: (Tip)
    • List item 1
    • List item 2
    • List item 3


    Example 2:

    1. List item 1
    2. List item 2
    3. List item 3
    4. List item 4
    <LINK> link Visit our <A HREF="http://www.yourdomain.com/">site</A> Visit our site
    <MARQUEE>
    (Internet
    Explorer)
    scrolling text <MARQUEE bgcolor="#CCCCCC" loop="-1" scrollamount="2" width="100%">Example Marquee</MARQUEE> Example Marquee (Tip)
    <MENU> menu <MENU>
    <LI type="disc">List item 1
    <LI type="circle">List item 2
    <LI type="square">List item 3
    </MENU>
    • List item 1
    • List item 2
    • List item 3
    <META> meta <META name="Description" content="Description of your site">
    <META name="keywords" content="keywords describing your site">
    Nothing will show (Tip)
    <META> meta <META HTTP-EQUIV="Refresh" CONTENT="4;URL=http://www.yourdomain.com/"> Nothing will show (Tip)
    <META> meta <META http-equiv="Pragma" content="no-cache"> Nothing will show (Tip)
    <META> meta <META name="rating" content="General"> Nothing will show (Tip)
    <META> meta <META name="ROBOTS" content="ALL"> Nothing will show (Tip)
    <META> meta <META NAME="ROBOTS" content="NOINDEX,FOLLOW"> Nothing will show (Tip)
    <OL> ordered list Numbered

    <OL>
    <LI>List item 1
    <LI>List item 2
    <LI>List item 3
    <LI>List item 4
    </OL>


    Numbered Special Start

    <OL start="5">
    <LI>List item 1
    <LI>List item 2
    <LI>List item 3
    <LI>List item 4
    </OL>


    Lowercase Letters

    <OL type="a">
    <LI>List item 1
    <LI>List item 2
    <LI>List item 3
    <LI>List item 4
    </OL>

    Capital Letters

    <OL type="A">
    <LI>List item 1
    <LI>List item 2
    <LI>List item 3
    <LI>List item 4
    </OL>

    Capital Letters Special Start

    <OL type="A" start="3">
    <LI>List item 1
    <LI>List item 2
    <LI>List item 3
    <LI>List item 4
    </OL>

    Lowercase Roman Numerals

    <OL type="i">
    <LI>List item 1
    <LI>List item 2
    <LI>List item 3
    <LI>List item 4
    </OL>

    Capital Roman Numerals

    <OL type="I">
    <LI&;gt;List item 1
    <LI>List item 2
    <LI>List item 3
    <LI>List item 4
    </OL>


    Capital Roman Numerals Special Start

    <OL type="I" start="7">
    <LI>List item 1
    <LI>List item 2
    <LI>List item 3
    <LI>List item 4
    </OL>

    Numbered
    1. List item 1
    2. List item 2
    3. List item 3
    4. List item 4

    Numbered Special Start

    1. List item 1
    2. List item 2
    3. List item 3
    4. List item 4

    Lowercase Letters

    1. List item 1
    2. List item 2
    3. List item 3
    4. List item 4

    Capital Letters

    1. List item 1
    2. List item 2
    3. List item 3
    4. List item 4

    Capital Letters Special Start

    1. List item 1
    2. List item 2
    3. List item 3
    4. List item 4

    Lowercase Roman Numerals

    1. List item 1
    2. List item 2
    3. List item 3
    4. List item 4

    Capital Roman Numerals

    1. List item 1
    2. List item 2
    3. List item 3
    4. List item 4

    Capital Roman Numerals Special Start

    1. List item 1
    2. List item 2
    3. List item 3
    4. List item 4
    <OPTION> listbox option <FORM METHOD=post ACTION="/cgi-bin/example.cgi">
    <CENTER>
    Select an option:
    <SELECT>
    <OPTION>option 1
    <OPTION SELECTED>option 2
    <OPTION>option 3
    <OPTION>option 4
    <OPTION>option 5
    <OPTION>option 6
    </SELECT><BR>
    </CENTER>
    </FORM>
    Select an option: (Tip)

    <P> paragraph This is an example displaying the use of the paragraph tag. <P> This will create a line break and a space between lines.

    Attributes:

    Example 1:<BR>
    <BR>
    <P align="left">
    This is an example<BR>
    displaying the use<BR>
    of the paragraph tag.<BR>
    <BR>
    Example 2:<BR>
    <BR>
    <P align="right">
    This is an example<BR>
    displaying the use<BR>
    of the paragraph tag.<BR>
    <BR>
    Example 3:<BR>
    <BR>
    <P align="center">
    This is an example<BR>
    displaying the use<BR>
    of the paragraph tag.

    This is an example displaying the use of the paragraph tag.

    This will create a line break and a space between lines.

    Attributes:

    Example 1:

    This is an example
    displaying the use
    of the paragraph tag.

    Example 2:

    This is an example
    displaying the use
    of the paragraph tag.

    Example 3:

    This is an example
    displaying the use
    of the paragraph tag.

    <SMALL> small (text) <SMALL>Example</SMALL> Example (Tip)
    <STRONG> strong emphasis <STRONG>Example</STRONG> Example
    <TABLE> table Example 1:

    <TABLE BORDER="4" CELLPADDING="2"  CELLSPACING="2" WIDTH="100%">
    <TR>
    <TD>Column 1</TD>
    <TD>Column 2</TD>
    </TR>
    </TABLE>

    Example 2: (Internet Explorer)

    <TABLE BORDER="2" BORDERCOLOR="#336699" CELLPADDING="2" CELLSPACING="2" WIDTH="100%">
    <TR>
    <TD>Column 1</TD>
    <TD>Column 2</TD>
    </TR>
    </TABLE>

    Example 3:

    <TABLE CELLPADDING="2" CELLSPACING="2" WIDTH="100%">
    <TR>
    <TD BGCOLOR="#CCCCCC">Column 1</TD>
    <TD BGCOLOR="#CCCCCC">Column 2</TD>
    </TR>
    <TR>
    <TD>Row 2</TD>
    <TD>Row 2</TD>
    </TR>
    </TABLE>

    Example 1: (Tip)
    Column 1 Column 2


    Example 2: (Tip)

    Column 1 Column 2


    Example 3: (Tip)

    Column 1 Column 2
    Row 2 Row 2
    <TD> table data <TABLE BORDER="2" CELLPADDING="2" CELLSPACING="2" WIDTH="100%">
    <TR>
    <TD>Column 1</TD>
    <TD>Column 2</TD>

    </TR>
    </TABLE>

    Column 1 Column 2

    <TH> table header <DIV align="center"><TABLE>
    <TR>
    <TH>Column 1</TH>
    <TH>Column 2</TH>
    <TH>Column 3</TH>

    </TR>
    <TR>
    <TD>Row 2</TD>
    <TD>Row 2</TD>
    <TD>Row 2</TD>
    </TR>
    <TR>
    <TD>Row 3</TD>
    <TD>Row 3</TD>
    <TD>Row 3</TD>
    </TR>
    <TR>
    <TD>Row 4</TD>
    <TD>Row 4</TD>
    <TD>Row 4</TD>
    </TR>
    </TABLE>
    </DIV>
    Column 1 Column 2 Column 3
    Row 2 Row 2 Row 2
    Row 3 Row 3 Row 3
    Row 4 Row 4 Row 4
    <TITLE> document title <TITLE>Title of your HTML page</TITLE> Title of your web page will be viewable in the title bar. (Tip)
    <TR> table row <TABLE BORDER="2" CELLPADDING="2" CELLSPACING="2" WIDTH="100%">
    <TR>
    <TD>Column 1</TD>
    <TD>Column 2</TD>
    </TR>
    </TABLE>

    Column 1 Column 2

    <TT> teletype <TT>Example</TT> Example
    <U> underline <U>Example</U> Example
    <UL> unordered list Example 1:<BR>
    <BR>
    <UL>
    <LI>List item 1
    <LI>List item 2
    </UL>
    <BR>
    Example 2:<BR>
    <UL type="disc">
    <LI>List item 1
    <LI>List item 2
    <UL type="circle">
    <LI>List item 3
    <LI>List item 4
    </UL>
    </UL>
    Example 1:

    • List item 1
    • List item 2


    Example 2:

    • List item 1
    • List item 2
      • List item 3
      • List item 4

    MouseOver PopUps provided by:



    216 Web Safe Colors Hexadecimal RGB Values


    If you're looking for a 216 web safe color chart, you've come to the right place. However, before reviewing the chart, you may be interested in learning a little bit about the 216 web safe colors.

    Netscape specified 216 colors that have precedence in web browsers based on the 256 colors displayed within an 8-bit system. As 40 colors displayed differently between PCs and MACs, they were eliminated.

    These 216 colors, known as web safe colors, are recognized by all web browsers and operating systems, which means these colors will look about the same within any browser.

    RGB and Hexadecimal Color Codes

    Colors are made up of 3 sets of RGB numbers representing the amount of Red, Green and Blue contained within a color. These colors are represented as hexadecimal values.

    For example, the hexadecimal numbers for black is #000000. The first two numbers (00) represent the amount of red the color contains. The second two numbers (00) represent the amount of green and the last two numbers (00) represent the amount of blue the color contains. When a color, such as black, contains 00 amount of red, green or blue, this means it contains no amount of that color or 0%.

    However, colors containing RGB values of FF contain the most amount of a color or 100%. For example, the hexadecimal value for white is #FFFFFF, which means it contains the most amount of red, green and blue.

    The hexadecimal numbers for red are FF0000. To help you to understand this a little bit better, if we break down the hexadecimal numbers, we will find that the color red contains FF amount of red, which is the highest amount. It contains 00 amount of green and 00 amount of blue, both of which are the lowest.

    Specifying Colors Within a Web Page:

    If you would like to specify colors within your web page, you must set color attributes. Attributes determine the appearance of a web page, such as background color, text colors and fonts.

    To specify a specific color, you must use the hexadecimal color code within your HTML coding. The hexadecimal color codes can be used throughout your entire web page to specify all of the following:

    .Web page background color
    .Font colors
    .Table background colors
    .Table border colors

    To ensure your colors will be displayed to most Internet users as you had intended, you should always select your colors from the 216 web safe colors, as displayed in the 216 web safe color chart below.

    When using colors within your HTML, you can also use the actual color "word" for basic colors such as black, white, red, green, blue and yellow. Your color code might look something like this:

    BGCOLOR="RED"

    Color

    Red

    Green

    Blue

    Hexadecimal

    Black 0 0 0 #000000
    White 255 255 255 #FFFFFF
    Red 255 0 0 #FF0000
    Green 0 192 0 #00C000
    Blue 0 0 255 #0000FF
    Yellow 255 255 0 #FFFF00

    To specify the background and text color of a web page, place the following color attributes, indicated in bold, within the BODY tag of your web page:

    BODY BGCOLOR="#FFFFFF" TEXT="#0000FF"

    To specify link colors within a web page, place the following color attributes, indicated in bold, within the BODY tag of your web page:

    BODY LINK="#003399" VLINK="#0000CC" ALINK="#9966CC"

    To specify the border color within an HTML table, place the following code within your TABLE code:

    TABLE BORDER="2" BORDERCOLOR="#CCCCCC"

    To specify the background color within a specific TABLE cell, place the following code, indicated in bold, within your TABLE code:

    TD BGCOLOR="#CCCCCC" Your Cell Text

    Edit the hexadecimal color codes indicated in red to suit your needs.

    Although you can change the background color of your web page, it is highly recommended that you use the default background color of white and the default text color of black, as this is the easiest color options to read within a web browser.

    In addition, it is highly recommended that you use the default link colors within your web pages, as these colors are what your visitors will be expecting. Changing the link colors may cause confusion.

    Each color displayed within the color chart below contains the hexadecimal values and the RGB (Red, Green, Blue) Values. Select a color and copy & paste the hexadecimal value into your HTML document.


    Example:

    Hexadecimal Value - #FFFFFF RGB Color Code - R=255 G=255 B=255


    #FFFFFF

    R=255
    G=255
    B=255
    #FFFFCC

    R=255
    G=255
    B=204
    #FFFF99

    R=255
    G=255
    B=153
    #FFFF66

    R=255
    G=255
    B=102
    #FFFF33

    R=255
    G=255
    B=51
    #FFFF00

    R=255
    G=255
    B=0
    #FFCCFF

    R=255
    G=204
    B=255
    #FFCCCC

    R=255
    G=204
    B=204
    #FFCC99

    R=255
    G=204
    B=153
    #FFCC66

    R=255
    G=204
    B=102
    #FFCC33

    R=255
    G=204
    B=51
    #FFCC00

    R=255
    G=204
    B=0
    #FF99FF

    R=255
    G=153
    B=255
    #FF99CC

    R=255
    G=153
    B=204
    #FF9999

    R=255
    G=153
    B=153
    #FF9966

    R=255
    G=153
    B=102
    #FF9933

    R=255
    G=153
    B=51
    #FF9900

    R=255
    G=153
    B=0
    #FF66FF

    R=255
    G=102
    B=255
    #FF66CC

    R=255
    G=102
    B=204
    #FF6699

    R=255
    G=102
    B=153
    #FF6666

    R=255
    G=102
    B=102
    #FF6633

    R=255
    G=102
    B=51
    #FF6600

    R=255
    G=102
    B=0
    #FF33FF

    R=255
    G=51
    B=255
    #FF33CC

    R=255
    G=51
    B=204
    #FF3399

    R=255
    G=51
    B=153
    #FF3366

    R=255
    G=51
    B=102
    #FF3333

    R=255
    G=51
    B=51
    #FF3300

    R=255
    G=51
    B=0
    #FF00FF

    R=255
    G=0
    B=255
    #FF00CC

    R=255
    G=0
    B=204
    #FF0099

    R=255
    G=0
    B=153
    #FF0066

    R=255
    G=0
    B=102
    #FF0033

    R=255
    G=0
    B=51
    #FF0000

    R=255
    G=0
    B=0
     
    #CCFFFF

    R=204
    G=255
    B=255
    #CCFFCC

    R=204
    G=255
    B=204
    #CCFF99

    R=204
    G=255
    B=153
    #CCFF66

    R=204
    G=255
    B=102
    #CCFF33

    R=204
    G=255
    B=51
    #CCFF00

    R=204
    G=255
    B=0
    #CCCCFF

    R=204
    G=204
    B=255
    #CCCCCC

    R=204
    G=204
    B=204
    #CCCC99

    R=204
    G=204
    B=153
    #CCCC66

    R=204
    G=204
    B=102
    #CCCC33

    R=204
    G=204
    B=51
    #CCCC00

    R=204
    G=204
    B=0
    #CC99FF

    R=204
    G=153
    B=255
    #CC99CC

    R=204
    G=153
    B=204
    #CC9999

    R=204
    G=153
    B=153
    #CC9966

    R=204
    G=153
    B=102
    #CC9933

    R=204
    G=153
    B=51
    #CC9900

    R=204
    G=153
    B=0
    #CC66FF

    R=204
    G=102
    B=255
    #CC66CC

    R=204
    G=102
    B=204
    #CC6699

    R=204
    G=102
    B=153
    #CC6666

    R=204
    G=102
    B=102
    #CC6633

    R=204
    G=102
    B=51
    #CC6600

    R=204
    G=102
    B=0
    #CC33FF

    R=204
    G=51
    B=255
    #CC33CC

    R=204
    G=51
    B=204
    #CC3399

    R=204
    G=51
    B=153
    #CC3366

    R=204
    G=51
    B=102
    #CC3333

    R=204
    G=51
    B=51
    #CC3300

    R=204
    G=51
    B=0
    #CC00FF

    R=204
    G=0
    B=255
    #CC00CC

    R=204
    G=0
    B=204
    #CC0099

    R=204
    G=0
    B=153
    #CC0066

    R=204
    G=0
    B=102
    #CC0033

    R=204
    G=0
    B=51
    #CC0000

    R=204
    G=0
    B=0
     
    #99FFFF

    R=153
    G=255
    B=255
    #99FFCC

    R=153
    G=255
    B=204
    #99FF99

    R=153
    G=255
    B=153
    #99FF66

    R=153
    G=255
    B=102
    #99FF33

    R=153
    G=255
    B=51
    #99FF00

    R=153
    G=255
    B=0
    #99CCFF

    R=153
    G=204
    B=255
    #99CCCC

    R=153
    G=204
    B=204
    #99CC99

    R=153
    G=204
    B=153
    #99CC66

    R=153
    G=204
    B=102
    #99CC33

    R=153
    G=204
    B=51
    #99CC00

    R=153
    G=204
    B=0
    #9999FF

    R=153
    G=153
    B=255
    #9999CC

    R=153
    G=153
    B=204
    #999999

    R=153
    G=153
    B=153
    #999966

    R=153
    G=153
    B=102
    #999933

    R=153
    G=153
    B=51
    #999900

    R=153
    G=153
    B=0
    #9966FF

    R=153
    G=102
    B=255
    #9966CC

    R=153
    G=102
    B=204
    #996699

    R=153
    G=102
    B=153
    #996666

    R=153
    G=102
    B=102
    #996633

    R=153
    G=102
    B=51
    #996600

    R=153
    G=102
    B=0
    #9933FF

    R=153
    G=51
    B=255
    #9933CC

    R=153
    G=51
    B=204
    #993399

    R=153
    G=51
    B=153
    #993366

    R=153
    G=51
    B=102
    #993333

    R=153
    G=51
    B=51
    #993300

    R=153
    G=51
    B=0
    #9900FF

    R=153
    G=0
    B=255
    #9900CC

    R=153
    G=0
    B=204
    #990099

    R=153
    G=0
    B=153
    #990066

    R=153
    G=0
    B=102
    #990033

    R=153
    G=0
    B=51
    #990000

    R=153
    G=0
    B=0
     
    #66FFFF

    R=102
    G=255
    B=255
    #66FFCC

    R=102
    G=255
    B=204
    #66FF99

    R=102
    G=255
    B=153
    #66FF66

    R=102
    G=255
    B=102
    #66FF33

    R=102
    G=255
    B=51
    #66FF00

    R=102
    G=255
    B=0
    #66CCFF

    R=102
    G=204
    B=255
    #66CCCC

    R=102
    G=204
    B=204
    #66CC99

    R=102
    G=204
    B=153
    #66CC66

    R=102
    G=204
    B=102
    #66CC33

    R=102
    G=204
    B=51
    #66CC00

    R=102
    G=204
    B=0
    #6699FF

    R=102
    G=153
    B=255
    #6699CC

    R=102
    G=153
    B=204
    #669999

    R=102
    G=153
    B=153
    #669966

    R=102
    G=153
    B=102
    #669933

    R=102
    G=153
    B=51
    #669900

    R=102
    G=153
    B=0
    #6666FF
    ;
    R=102
    G=102
    B=255
    #6666CC

    R=102
    G=102
    B=204
    #666699

    R=102
    G=102
    B=153
    #666666

    R=102
    G=102
    B=102
    #666633

    R=102
    G=102
    B=51
    #666600

    R=102
    G=102
    B=0
    #6633FF

    R=102
    G=51
    B=255
    #6633CC

    R=102
    G=51
    B=204
    #663399

    R=102
    G=51
    B=153
    #663366

    R=102
    G=51
    B=102
    #663333

    R=102
    G=51
    B=51
    #663300

    R=102
    G=51
    B=0
    #6600FF

    R=102
    G=0
    B=255
    #6600CC

    R=102
    G=0
    B=204
    #660099

    R=102
    G=0
    B=153
    #660066

    R=102
    G=0
    B=102
    #660033

    R=102
    G=0
    B=51
    #660000

    R=102
    G=0
    B=0
     
    #33FFFF

    R=51
    G=255
    B=255
    #33FFCC

    R=51
    G=255
    B=204
    #33FF99

    R=51
    G=255
    B=153
    #33FF66

    R=51
    G=255
    B=102
    #33FF33

    R=51
    G=255
    B=51
    #33FF00

    R=51
    G=255
    B=0
    #33CCFF

    R=51
    G=204
    B=255
    #33CCCC

    R=51
    G=204
    B=204
    #33CC99

    R=51
    G=204
    B=153
    #33CC66

    R=51
    G=204
    B=102
    #33CC33

    R=51
    G=204
    B=51
    #33CC00

    R=51
    G=204
    B=0
    #3399FF

    R=51
    G=153
    B=255
    #3399CC

    R=51
    G=153
    B=204
    #339999

    R=51
    G=153
    B=153
    #339966

    R=51
    G=153
    B=102
    #339933

    R=51
    G=153
    B=51
    #339900

    R=51
    G=153
    B=0
    #3366FF

    R=51
    G=102
    B=255
    #3366CC

    R=51
    G=102
    B=204
    #336699

    R=51
    G=102
    B=153
    #336666

    R=51
    G=102
    B=102
    #336633

    R=51
    G=102
    B=51
    #336600

    R=51
    G=102
    B=0
    #3333FF

    R=51
    G=51
    B=255
    #3333CC

    R=51
    G=51
    B=204
    #333399

    R=51
    G=51
    B=153
    #333366

    R=51
    G=51
    B=102
    #333333

    R=51
    G=51
    B=51
    #333300

    R=51
    G=51
    B=0
    #3300FF

    R=51
    G=0
    B=255
    #3300CC

    R=51
    G=0
    B=204
    #330099

    R=51
    G=0
    B=153
    #330066

    R=51
    G=0
    B=102
    #330033

    R=51
    G=0
    B=51
    #330000

    R=51
    G=0
    B=0
     
    #00FFFF

    R=0
    G=255
    B=255
    #00FFCC

    R=0
    G=255
    B=204
    #00FF99

    R=0
    G=255
    B=153
    #00FF66

    R=0
    G=255
    B=102
    #00FF33

    R=0
    G=255
    B=51
    #00FF00

    R=0
    G=255
    B=0
    #00CCFF

    R=0
    G=204
    B=255
    #00CCCC

    R=0
    G=204
    B=204
    #00CC99

    R=0
    G=204
    B=153
    #00CC66

    R=0
    G=204
    B=102
    #00CC33

    R=0
    G=204
    B=51
    #00CC00

    R=0
    G=204
    B=0
    #0099FF

    R=0
    G=153
    B=255
    #0099CC

    R=0
    G=153
    B=204
    #009999

    R=0
    G=153
    B=153
    #009966

    R=0
    G=153
    B=102
    #009933

    R=0
    G=153
    B=51
    #009900

    R=0
    G=153
    B=0
    #0066FF

    R=0
    G=102
    B=255
    #0066CC

    R=0
    G=102
    B=204
    #006699

    R=0
    G=102
    B=153
    #006666

    R=0
    G=102
    B=102
    #006633

    R=0
    G=102
    B=51
    #006600

    R=0
    G=102
    B=0
    #0033FF

    R=0
    G=51
    B=255
    #0033CC

    R=0
    G=51
    B=204
    #003399

    R=0
    G=51
    B=153
    #003366

    R=0
    G=51
    B=102
    #003333

    R=0
    G=51
    B=51
    #003300

    R=0
    G=51
    B=0
    #0000FF

    R=0
    G=0
    B=255
    #0000CC

    R=0
    G=0
    B=204
    #000099

    R=0
    G=0
    B=153
    #000066

    R=0
    G=0
    B=102
    #000033

    R=0
    G=0
    B=51
    #000000

    R=0
    G=0
    B=0


    ASCII Character Codes Chart (Symbols)


    ASCII stands for American Standard Code for Information Interchange. It is the standard format used for text files within computers and online.

    As computers can only understand numbers, the ASCII code is the numerical representation of alphabetic and special characters, such as 'a' and/or the '©' symbol.

    In order to display special characters or symbols within your HTML pages, you must use a special ASCII code. The codes below display the HTML code and the character when displayed on your web page.

    For example, if you'd like to place your copyright information on your web site, you will need to include a special ASCII Character Code within your HTML that looks like this:

    ©

    When you place this ASCII Character Code within the HTML of your web page, it will display the copyright symbol, which will look like this:

    ©

    Here's how your HTML code might look:

    Copyright © YEAR YOUR COMPANY NAME

    The above HTML code will display like this within your web page:

    Copyright © YEAR YOUR COMPANY NAME


    Another example of using an ASCII code is for the trademark symbol. To display the trademark symbol within a web page, you must use the ASCII Character Code that looks like this:

    When you place this ASCII Character Code within the HTML of your web page, it will display the trademark symbol, which will look like this:

    Here's how your HTML code might look:

    Business&#153;

    The above HTML code will display like this within your web page:

    Business

    Another great use for the ASCII code is display your email address. For example, instead of dispaying your email address within your HTML with the @ symbol, use the ASCII code equivalent. Your HTML code will look something like this:

    you@yourdomain.com

    Your email address will look like this within your web page:

    you@yourdomain.com

    This provides a great way to prevent your email address from being harvested by spam bots.

    To use any of the characters displayed within the ASCII codes chart, copy & paste the HTML code to the left of the character you would like to use.


    HTML Code

    Browser View

    HTML Code

    Browser View

    HTML Code

    Browser View

    HTML Code

    Browser View

    HTML Code

    Browser View

    &copy; © &#33; ! &#95; _ &#157;  &#219; Û
    &reg; ® &#34; " &#96; ` &#158; ž &#220; Ü
    &nbsp;   &#35; # &#97; a &#159; Ÿ &#221; Ý
    &quot; " &#36; $ &#98; b &#160;   &#222; Þ
    &amp; & &#37; % &#99; c &#161; ¡ &#223; ß
    &lt; < &#38; & &#100; d &#162; ¢ &#224; à
    &gt; > &#39; ' &#101; e &#163; £ &#225; á
    &Agrave; À &#40; ( &#102; f &#164; ¤ &#226; â
    &Aacute; Á &#41; ) &#103; g &#165; ¥ &#227; ã
    &Acirc; Â &#42; * &#104; h &#166; ¦ &#228; ä
    &Atilde; Ã &#43; + &#105; i &#167; § &#229; å
    &Auml; Ä &#44; , &#106; j &#168; ¨ &#230; æ
    &Aring; Å &#45; - &#107; k &#169; © &#231; ç
    &AElig; Æ &#46; . &#108; l &#170; ª &#232; è
    &Ccedil; Ç &#47; / &#109; m &#171; « &#233; é
    &Egrave; È &#48; 0 &#110; n &#172; ¬ &#234; ê
    &Eacute; É &#49; 1 &#111; o &#173; ­ &#235; ë
    &Ecirc; Ê &#50; 2 &#112; p &#174; ® &#236; ì
    &Euml; Ë &#51; 3 &#113; q &#175; ¯ &#237; í
    &Igrave; Ì &#52; 4 &#114; r &#176; ° &#238; î
    &Iacute; Í &#53; 5 &#115; s &#177; ± &#239; ï
    &Icirc; Î &#54; 6 &#116; t &#178; ² &#240; ð
    &Iuml; Ï &#55; 7 &#117; u &#179; ³ &#241; ñ
    &ETH; Ð &#56; 8 &#118; v &#180; ´ &#242; ò
    &Ntilde; Ñ &#57; 9 &#119; w &#181; µ &#243; ó
    &Otilde; Õ &#58; : &#120; x &#182; &#244; ô
    &Ouml; Ö &#59; ; &#121; y &#183; · &#245; õ
    &Oslash; Ø &#60; < &#122; z &#184; ¸ &#246; ö
    &Ugrave; Ù &#61; = &#123; { &#185; ¹ &#247; ÷
    &Uacute; Ú &#62; > &#124; | &#186; º &#248; ø
    &Ucirc; Û &#63; ? &#125; } &#187; » &#249; ù
    &Uuml; Ü &#64; @ &#126; ~ &#188; ¼ &#250; ú
    &Yacute; Ý &#65; A &#127; ? &#189; ½ &#251; û
    &THORN; Þ &#66; B &#128; &#190; ¾ &#252 ü
    &szlig; ß &#67; C &#129;  &#191; ¿ &#253; ý
    &agrave; à &#68; D &#130; &#192; À &#254; þ
    &aacute; á &#69; E &#131; ƒ &#193; Á &#255; ÿ
    &aring; å &#70; F &#132; &#194; Â    
    &aelig; æ &#71; G &#133; &#195; Ã    
    &ccedil; ç &#72; H &#134; &#196; Ä    
    &egrave; è &#73; I &#135; &#197; Å    
    &eacute; é &#74; J &#136; ˆ &#198; Æ    
    &ecirc; ê &#75; K &#137; &#199; Ç    
    &euml; ë &#76; L &#138; Š &#200; È    
    &igrave; ì &#77; M &#139; &#201; É    
    &iacute; í &#78; N &#140; Œ &#202; ?    
    &icirc; î &#79; O &#141;  &#203; Ë    
    &iuml; ï &#80; P &#142; Ž &#204; Ì    
    &eth; ð &#81; Q &#143;  &#205; Í    
    &ntilde; ñ &#82; R &#144;  &#206; Î    
    &ograve; ò &#83; S &#145; &#207; Ï    
    &oacute; ó &#84; T &#146; &#208; Ð    
    &ocirc; ô &#85; U &#147; &#209; Ñ    
    &otilde; õ &#86; V &#148; &#210; Ò    
    &ouml; ö &#87; W &#149; &#211; Ó    
    &oslash; ø &;amp;#88; X &#150; &#212; Ô    
    &ugrave; ù &#89; Y &#151; &#213; Õ    
    &uacute; ú &#90; Z &#152; ˜ &#214; Ö    
    &ucirc; û &#91; [ &#153; &#215; ×    
    &yacute; ý &#92; \ &#154; š &#216; Ø    
    &thorn; þ &#93; ] &#155; &#217; Ù    
    &yuml; ÿ &#94; ^ &#156; œ &#218; Ú