HEX color code using MS Paint

All Other Tutorials

Tutorial

Click on thumbnailed images to enlarge

similar to [url=http://www.createblog.com/forums/index.php?showtopic=38767]THIS[/url] tutorial, i will teach you how to generate a code that will enable you to designate exact colors in an HTML document without having to have the hex codex (#ffffff, #ff0080, etc.).

1.) Open up MS Paint: Start > Programs > Accessories > Paint

2.) Decide which color you want by click on the colored square that you desire. if you want a custom color, than double click on ANY of the prearranged swatches so that you see the following window & click the button circled in red:
User posted image

3.) play with the numbers or click on the spectrum grid until you get the color of your choice. i will be using this color:
User posted image

4.) Now that our color is specified, allow me to show you how to put it in the HTML or CSS!
let's say that i wanted all of the text in my page to be that color green. here's how my CSS would look:

<STYLE TYPE="TEXT/CSS">
P
{color: rgb(187,230,89);}
</STYLE>


here's what the HTML would look like:
<P>This text should be the green color!</P>


& here's how it will look through your browser:
User posted image

in the CSS code, the rgb stands for Red Green Blue. and those three numbers are the red, green and blue values of my color (the green color)...SEE! *LOOKS AT PICTURE IN #3*

**REMEMBER that there are only commas (,) seperating the three numbers. No Spaces!!

and remember that you can substitute this coding method for anyplace that a hex code would be placed. here are some more examples:

<STYLE TYPE="TEXT/CSS">
A:link
{color: rgb(105,214,200);
font-weight: bold;}
P
{color: rgb(84,235,137);
border: 2px dotted rgb(234,85,156);}
</STYLE>


here's what the HTML would look like:
<P>Normal text. <a href=http://createblog.com>LINK</a>!! Normal text here.</P>


& here's how it will look through your browser:
User posted image

if you have any questions, feel free to PM me anytime! :biggrin: have fun! :]

Tutorial Comments

Showing latest 3 of 3 comments

thanks this worked for the most part but i have a couple questions that i will pm you

By ajpagan on Nov 9, 2008 3:11 pm

Oh my gosh thank you sooo much!!!

This made so much sense!!

Please let me know if you made any other tutorials..

I'm kinda of a new in the whole LETS MAKE A PROFILE world =/

-Kai

By kaispaz on Jun 7, 2008 11:56 am

This is THE MOST awesome tutorial EVER. I use it ALL THE TIME. Thanks!!!!!!

By beinedhiel on Sep 6, 2006 8:40 pm

Tutorial Details

Author heyyfrankie View profile
Submitted on Feb 11, 2006
Page views 36,841
Favorites 14
Comments 3

Tutorial Tags