Thoughtful, detailed coverage of the Mac, iPhone, and iPad, plus the best-selling Take Control ebooks.

Caught Between a Hexadecimal and a Hard Place

Send Article to a Friend

If you do any coding of HTML documents, you've probably encountered situations where you need to enter a six-digit hexadecimal number in order to tag for a particular color, perhaps for a page's background or for items of text.

For those of you who have a fuzzy idea of what I'm talking about but don't know the exact HTML, here's how it works. To color your entire document's background and text in a multi-hued, rainbow sort of way, you might use this HTML for your opening <body> tag:

<BODY BGCOLOR="#FFFF05" TEXT="#00FF00" LINK="#0000FF" ALINK="#FF00FF" VLINK="#FF0000">

This body tag sets the background color to yellow, regular text to light green, unvisited link text to blue, visited link text to red, and link text as you click it to purple. In a browser that doesn't understand this HTML (or that is set for the user's colors to override those in a visited page), the background and text will remain at the default color.

To learn additional details about coloring text, check out the Internet draft of the HTML 3.2 specification, though be aware that many browsers don't yet support the additional coloring options proposed in that draft. (I leave such trial and error to the discretion of enterprising readers.)

< features.html>

Human brains don't come wired to realize that colors like violet are represented in hex with numbers like 9717FF, and I've yet to read anything sensible that provides an easy way to convert colors into such numbers. Instead, I've discovered the world of color-to-hex converters, and I thought I'd share some summaries of how a few of the different converters operate. Some Web authoring programs also offer such features, but if your program does not (or offers only limited features), you may want to use one of these programs.

Before I talk about the utilities, I should mention that some of them also help you create a <body> tag that includes the background attribute, which you use to specify a graphic that will function as a tiling background. (Web pages with tiling backgrounds often look as though their text is on top of a lightly-colored image, such as a chunk of marble. You can also use tiling backgrounds in a variety of clever ways to spruce up Web pages, though modem users will thank you enormously if you keep graphic file sizes as small as possible.)

If you are looking for something in the freeware department, check out HTML ColorMeister 1.3.5. Written by John Cope of ParticleFlux Software, this utility makes it easy to set up color and tiling attributes that go in the opening <body> tag. After you pick your attributes, click the Generate button to see the complete tag. You can then copy and paste the tag (or portions of it) into an HTML document, or you can click the Output Page button and HTML ColorMeister creates a skeleton HTML document that includes the custom <body> tag.

< index.html>

The shareware category offers a few additional choices. Web Color 2.0, a $5 program by Patrick Bores, works much like HTML ColorMeister, but has a more polished appearance.


HTML ColorPicker 2.0.3 costs $5 and was written by David Christiansen at Vector Development. HTML ColorPicker lets you type in numerical values and see the colors to which they relate (if your brain works that way or if you have some specialized reason). It also can display numerical values that match colors you choose visually. Although you can copy any one hexadecimal value from HTML ColorPicker, the utility doesn't help you generate an actual <body> tag.

< html-color-picker-203.hqx>

Janice Arakaki's $5 HTML ColorSelect 1.3 takes a slightly different tactic to the feature set it offers. Although it enables you to choose a color and then see the hexadecimal equivalent, it unfortunately doesn't permit you to copy the number; instead you must retype it into your HTML document. You can, however, open a PICT image and then click a pixel in that image to get its hexadecimal equivalent.

< html-color-select-13.hqx>

HTML ColourTool costs $10 and offers a preview feature that enables you to see how the colors you choose interact. The program shows the current <body> tag, complete with attributes as you choose your colors. It does not offer a way to include a background attribute for a tiled background image - a feature that would be especially nifty if it also worked in the preview, showing how text colors interact with the image. If you like the program and pay the $10 shareware fee, you'll be able to copy the <body> tag and then paste it into your HTML document. If you don't pay, you must retype the tag. HTML ColourTool was developed by Brock Gunter-Smith of Finger In The Eye Productions.

< html-colour-tool-201.hqx>

I hope this article has given you an idea of what features you might find in these sort of utilities and an idea of which utility would be most useful to you. Even if you use a Web authoring program that helps with coloring text and backgrounds, it may not offer the color picker aspect of HTML ColorSelect, or the color visualization features in HTML ColourTool.


READERS LIKE YOU! Support TidBITS by becoming a member today!
Check out the perks at <>
Special thanks to Skip Crouse, Richard Thorpe, John Brayton, and Jens
Roecken for their generous support!