For many electronic newsletter designers – not to mention website designers – using gray as a font color, as well as a hyperlink color, is very tempting. There are many issues when it comes to using gray text on a white background, with the main one being readability, but can be even worse in using against a different color background. Newsletter designers rarely use gray as a text color against a red, blue, yellow or green background as it can be hard on the eyes when it comes to reading. Pure black is almost never used as a background in electronic newsletters for the same reason – even with a white, much less gray, font color. Again, this is just the text color being considered; using gray as a hyperlink color is another story but also has its drawbacks. For one thing, having a unvisited hyperlink in gray can too easily blend in with black text. A visited hyperlink in gray does the same thing, should the reader need to refer back to that hyperlink. Historically, blue was the default color for unvisited text links for this very reason. The bright blue stood out against the black text, indicating a call to action. With the development of CSS (Cascading Style Sheets) and inline styling – the latter being imperative in newsletters as most email clients do not recognize CSS – the color of hyperlinks in newsletters can easily be changed to something other than blue.
This HMT newsletter is an exception of gray-on-gray where a light gray background is used in the right column, with a much darker gray, almost a charcoal gray shade, used as text underneath the article titles in the “Industry News” section. The background color being used in the right column is #E2E2E2, and the darker gray, #3F3F3F. In evaluating which shade of gray to use in a newsletter design, it helps to have a good eye of contrast, as well as experimenting with several different shades until the right one is used. Going a shade or two darker than what the light gray background is can still be too light and will easily fade, making it unreadable. The HTML color lists at W3Schools contains a table of grays and their hex numbers to evaluate which shades of gray look best against a white or light gray background.
If gray is still desired for use in a newsletter as a font or hyperlink color, consider using a color with a strong gray undertone. Hex colors such as #666666 (thistle), #68828A (blue-gray), or #93856B (tan-gray) are viable alternatives to straight gray shades in small blocks of text or as hyperlinks. As with any electronic newsletter, check the color palette being used in the design on several different monitors to make sure there is enough contrast between the font and background colors being used.