Here is an overview about colors that may help the newcomers and perhaps a few experts as well. The code generates a color chart that can produce a variable range of color choices.
Colors are a document property. There are two choices for selecting colors. The first is to use a built in color, that is provided with HTML. This can be either red, blue, green, yellow, lime, gray, fuschia, black, maroon, navy, teal, purple, olive, aqua, silver or white.
If you choose not to use one of the provided colors then there are millions of other color choices. To represent these colors, hexadecimal values are used. Two hex digits are used for each hue of red, green and blue. The description will read out as "rrggbb". The hues range from 0 to 255. Why 255, because 255 is the most you can get from two hexadecimal digits. In hexadecimal, 255 is "FF", or 15 sixteens and 15 ones.
Using this background information, it is possible to create a range of colors in a chart. Looking at colors to select them is a lot easier than talking about them as numbers. So here is the code.
Set up your usual page tags
|
|
<HTML> <HEAD> <TITLE>Color Chart</TITLE> <META name="description" content=""> <META name="keywords" content=""> <META name="generator" content="VisualN++"> </HEAD> <BODY BGCOLOR="#FFFFFF" TEXT="#000000" LINK="#0000FF" VLINK="#800080"> <CENTER> <H2>Color Chart</H2> </CENTER>
|
|
Include a form to select the user's preference of color choices. That is to say, how many different colors will be offered as a choice. This form feeds a step size value to a loop. The lower the step size in the loop, the more colors that will be offered.
|
|
<% DIM strScriptName, intStep, strColor, str_rr, str_gg, str_bb
'get the name of the current page strScriptName = Request.ServerVariables("SCRIPT_NAME")
%> <Form name="MyForm" Action= "<%=strScriptName%>?key=1" > Select Step Size: <SELECT Name = "StepSize" SIZE="1"> <OPTION>3</OPTION> <OPTION>4</OPTION> <OPTION SELECTED>5</OPTION> </SELECT> <INPUT TYPE="Submit" Value="Submit"> </Form> </CENTER>
|
|
The code below is the loop that receives the input parameter and generates the color chart. By incrementing each hue in the "rrggbb" range, a new color can be generated. Using a value greater than 1 is recommended, as the chart can be quite large.
|
|
<% If len(Request("StepSize")) then
intStep= Request("StepSize")
for str_rr = 0 to 15 step intStep for str_gg = 0 to 15 step intStep Response.write("<TABLE width='100%'><TR>") for str_bb = 0 to 15 step intStep strColor="#" & hex(str_rr) & hex(str_rr) & _ hex(str_gg) & hex(str_gg) & hex(str_bb) & hex(str_bb) Response.write("<TD align='right' width='*'><font face='Courier New' size='2'>" & _ strColor & "</font></TD>") Response.write("<TD width='50' bgcolor=" & _ strColor & "></TD>") next Response.write("</TR>") next next Response.write("</TABLE>") End if %>
</BODY> </HTML> | (From: aspkey)
|