Madfish.gif

Designing Ideas!


Color codes... what are they... where do I find them... how do I use them... what about fonts...

Thse are some questions we ask when starting on a design for our site. I have compiled some links to answer these questions and presented them by groups in the extended entry.

Design gurus will tell you that content is king and design presentation should not detract from the actual content of your post. I am not presenting this information to discuss the theories of content and presentation. I am presenting it as a set of tools for you to use and decide for yourself how you want to present your content to your corner of the the world.

I tend to favor a more bold approach to using color in my designs, whereas other designers prefer a more subtle approach. I've tried to give you enough information and reference sources so you would be able to make your own decisions and present your content how you want it to look for your readers. After all... it's your site... do what YOU want to do.

Color codes...
W3Schools: CSS Colors

What are they...
There are 3 ways to specify color codes in your HTML and CSS stylesheets:

Unit Description
color_name A color name (red)
rgb(x,x,x) A rgb value (rgb(255,0,0))
rgb(y%, y%, y%) A rgb percentage value (rgb(100%,0%,0%))
#rrggbb A hex number (#ff0000).

Where do I find them...
Visibone Webmaster's Color Lab
Visibone Webmaster's Color Card
Madarin Design: Web Color Swatches
ColorMatch 5K
Web Color Reference: Named Colors
Web Color Reference: Proprietary Color Names

How do I use them....
Dmitry's Design Lab: The World of Color
Communicate With Color
Color Matters - Design Art: Color Theory

What about fonts...
Visibone Webdesigner's Font Card

A really neat color code converter...
Southern Twilight RGB to Hex and Hex to RBG Converter

Feedback from MuNuviana

Rob from Xset:
Just my 2c worth. Hex codes can be shortened to a 3 digit number (yeah I know it's got letters in it - it's still a number) so #ff0000 can become #f00, black becomes #000 and white becomes #fff.

Annika from Annika's Poetry & Journal:
One great way to get hexadecimal color codes I discovered is through Photoshop. On the lower right corner of the color selector chart is a little box that shows the color code for whatever color you have selected, which takes a lot of the guesswork out of it.

Madfish Willie:
I appreciate your input. Will three digit hex codes validate as proper CSS? It seems I've read somewhere that the validators require six digits??? With six digit hex codes, you get a broader range of colors.

Rob from Xset:
They should validate as they are valid hex equivalents to their 6 digit cousins. And I meant it only as a short hand method of entering appropriate colors. By all means use 6 digit codes for more complex hues.

Ted from Rocket Jones:
I do the same thing as Annika, but with Paint Shop Pro. When doing a banner, I select a color to match, then read the color code given in hex. Works like a champ, and makes it easy to clone that particularly nice blue you found on someone else's site.

Bravo Romeo Delta from Anticipatory Retaliation:
A neat color-picker can be found here (http://www.pixy.cz/apps/barvy/index-en.html). Cool stuff soon as I figure out how to do something wid it.


» by Madfish Willie on April 13 :: Permalink :: Comments (0) :: HammerHead
» Ramblings of SilverBlue links with: Massive Link-Luv™

Bullshitters
Let's hear your bullshit









Remember personal info?