A Little Color Lesson
Here is a Lesson on making fast Color Adjustments


When using the HEX number instead of a color name, Use # sign in front of the number code as in the examples I show you below alone with quotes. Using the Hex Number instead of a color name will really speed up your html work as I will show you how to make quick color adjustments.

For example, I will use the color, Lavender its Hex value is #E6E6FA, here is what the code would look like for a basic table.

<table bgcolor="lavender">
<tr><td>
this is using lavender

</td></tr></table>

<table bgcolor="#E6E6FA">
<tr><td>
this is the HEX code

</td></tr></table>




If you need to change the color just a little bit, the color number is in 3 sections, for E6E6FA, that is E6 then E6 then FA, all you need to do is change one of the letters or numbers, like E6E6EA or D6E6FA even a jump of 2 can be C6E6FA, the 3 colors I just did, I will put in the next tables

<table bgcolor="#E6E6EA">
<tr><td>
this is with that number code

</td></tr></table>

<table bgcolor="#D6E6FA">
<tr><td>
this is with that number code

</td></tr></table>

<table bgcolor="#C6E6FA">
<tr><td>
this is with that number code

</td></tr></table>




You can gray scale any color quickly by the number

The numbers of the colors go, 0-1-2-3-4-5-6-7-8-9-A-B-C-D-E-F and the is no others used, so to gray scale the example E6E6FA is as easy as 1st grade counting, watch...

"#E6E6FA"
"#D5D5E9"
"#C4C4D8"
"#B3B3C7"
"#A2A2B6"
"#9191A5"
"#808094"



Or to change one color by graduations, that goes like this

"#E6E6FA"
"#D5E6FA"
"#C4E6FA"
"#B3E6FA"
"#A2E6FA"
"#91E6FA"
"#80E6FA"



That is all there is to making quick adjustments,

Peace and Enjoy!!!



A Little RGB Color Lesson

A Lesson on Fast RGB value Color Adjustments


When using the RGB numbers in the color tool or in Webpage Design, adjustments and fading of colors are very easily made. Here is how to make quick pin point color adjustments when using RGB values. Like a color but need it lighter or darker? This will explain how to do that, very quickly.

For example, I will gray scale white to black, this is just simple math of subtracting the same amount from each input, -10 is very gradual, -20 is a good stating point, at times, -30 for a very quick fade of a color, I will use -50 in the example to make it quick for this lesson.
    255-255-255, this is pure white
    205-205-205, is a gray
    155-155-155, is a darker gray
    105-105-105, is real dark gray
    55-55-55, is almost black
    0-0-0, this is pure black


    See how I just subtracted the same amount from each value? Same with any color you have to start with, for example, 234-198-217, fading it out at -20 goes like this

    254-218-237 is this color
    234-198-217 is this color
    214-178-197 is this color
    194-158-177 is this color
    174-138-157 is this color
    etc...


    To fade from one color to another, just only subtract from two of the RGB numbers or one of the RGB Numbers, like in this example of subtracting 20 from the first value,

    254-198-217 is this color
    234-198-217 is this color
    214-198-217 is this color
    194-198-217 is this color
    174-198-217 is this color
    154-198-217 is this color


    The RGB stands for Red-Green-Blue, and relates directly to the 3 input values in the color tool in the same order.

    1st value=Red ~ 2nd value=green ~ 3rd value=Blue

    So, now, you should understand how to manually input your own values, and fade out colors, and go into other colors, play around, you'll get it...

    Note also, 255 is the highest Value most color editors stop working if you go above the 255 value,


One last note, there are many of color tools on the web, a google search will take you to quite a few of them, they are not perfect, each has good points and bad points. With the basic formulas I described above , Will come in mighty useful when you fine their starting points...

As an Example, "Color Scheme Generator 2" from wellstyled, a very cool and easy to use generator for color scheme matching ideas for websites and profile pages, some with really surprising results that make you go, wow, cool choices, I would of never thought of that!!!!, Great place to get surprising matching colors that go with your favorite color, and complete your diary or profile or website... just how you want it, with a little help of fine tuned adjustments... ;-)

Peace
DSWS



A Chart for figuring out the RGB code of a Hex Color


At Times, you may need the RGB # of a color you like, this chart will let you convert any Hex Color into the RGB number, To Convert a Hex value to RGB, the Hex number is in 3 sections, For example, the Color #C6E6FA is in 3 sections, C6~~~E6~~~FA, simple enough...

Now look on the chart below for the conversion, C6=198 and E6=230 and FA=250, so the RGB value is 198-230-250 for the Hex color #C6E6FA


00=000
01=001
02=002
03=003
04=004
05=005
06=006
07=007
08=008
09=009
0A=010
0B=011
0C=012
0D=013
0E=014
0F=015
10=016
11=017
12=018
13=019
14=020
15=021
16=022
17=023
18=024
19=025
1A=026
1B=027
1C=028
1D=029
1E=030
1F=031
20=032
21=033
22=034
23=035
24=036
25=037
26=038
27=039
28=040
29=041
2A=042
2B=043
2C=044
2D=045
2E=046
2F=047
30=048
31=049
32=050
33=051
34=052
35=053
36=054
37=055
38=056
39=057
3A=058
3B=059
3C=060
3D=061
3E=062
3F=063
40=064
41=065
42=066
43=067
44=068
45=069
46=070
47=071
48=072
49=073
4A=074
4B=075
4C=076
4D=077
4E=078
4F=079
50=080
51=081
52=082
53=083
54=084
55=085
56=086
57=087
58=088
59=089
5A=090
5B=091
5C=092
5D=093
5E=094
5F=095
60=096
61=097
62=098
63=099
64=100
65=101
66=102
67=103
68=104
69=105
6A=106
6B=107
6C=108
6D=109
6E=110
6F=111
70=112
71=113
72=114
73=115
74=116
75=117
76=118
77=119
78=120
79=121
7A=122
7B=123
7C=124
7D=125
7E=126
7F=127
80=128
81=129
82=130
83=131
84=132
85=133
86=134
87=135
88=136
89=137
8A=138
8B=139
8C=140
8D=141
8E=142
8F=143
90=144
91=145
92=146
93=147
94=148
95=149
96=150
97=151
98=152
99=153
9A=154
9B=155
9C=156
9D=157
9E=158
9F=159
A0=160
A1=161
A2=162
A3=163
A4=164
A5=165
A6=166
A7=167
A8=168
A9=169
AA=170
AB=171
AC=172
AD=173
AE=174
AF=175
B0=176
B1=177
B2=178
B3=179
B4=180
B5=181
B6=182
B7=183
B8=184
B9=185
BA=186
BB=187
BC=188
BD=189
BE=190
BF=191
C0=192
C1=193
C2=194
C3=195
C4=196
C5=197
C6=198
C7=199
C8=200
C9=201
CA=202
CB=203
CC=204
CD=205
CE=206
CF=207
D0=208
D1=209
D2=210
D3=211
D4=212
D5=213
D6=214
D7=215
D8=216
D9=217
DA=218
DB=219
DC=220
DD=221
DE=222
DF=223
E0=224
E1=225
E2=226
E3=227
E4=228
E5=229
E6=230
E7=231
E8=232
E9=233
EA=234
EB=235
EC=236
ED=237
EE=238
EF=239
F0=240
F1=241
F2=242
F3=243
F4=244
F5=245
F6=246
F7=247
F8=248
F9=249
FA=250
FB=251
FC=252
FD=253
FE=254
FF=255


How to better Use a Color Chart;
330000 330033 330066 330099 3300CC 3300FF


Notice the pattern across the line?
(00,33,66,99,CC,FF)


Well to get colors in between its easy. Here is How it works;
    330000 330011 330022 330033 330044 330055 330066 330077
    330088 330099 3300AA 3300BB 3300CC 3300DD 3300EE 3300FF
So this will get you to fine tune colors better by using simple math you'll see, its easy! Find a color you like, and fine tune it to your perfection


Also the same goes for the first 2 #'s and Middle 2 #'s like;
    330033 331133 332233 333333 334433 335533 336633 337733
    338833 339933 33AA33 33BB33 33CC33 33DD33 33EE33 33FF33
... Like above, Just look across the chart for a pattern, and change the 2 #'s in the pattern to get colors in between them, and you are gray scaling and getting the graduations of colors as fast as your brain can figure it out what you really want


How to use Gray Scales;

Heres how this pattern of Black to grays to white works;

000000 111111 222222 333333 ect... to FFFFFF

(0123456789abcdef)

000000=black [in between is Grays] FFFFFF=white

Some grays are 797979 and 272727, See how each set of #'s are the same, so C6C6C6 is also gray, see how it works with the 3 sets of numbers?


One Last Lesson;

You like a color but want it darker or lighter (Gray scaled) well this is easy also, all you do is this;

336699is the color you like; to make it darker just subtract 1 from each set of numbers, [33 becomes 22] [66 becomes 55] [99 becomes 88] like; 225588 or darker yet 114477 Lighter goes in the opposite direction, like; 336699 becomes 4477AA or lighter yet, 5588BB or even lighter 6699CC

Gray scaling is the final touch to any page;


Like heres Green 00FF00, (the brightest you can get of green) Gray scale it and you will see what I mean, to gray scale green it goes like this,
    00FF00 00EE00 00DD00 00CC00 00BB00 00AA00 009900 008800
    007700 006600 005500 004400 003300 002200 001100 000000
There is some really nice dark greens in there, better then any chart ever gave!!!! Doing gray scales Is beyond handy!!! and you'll get that perfect color you wanted, without days of searching.


Heres the final test if I explained it all right, gray scale the number 27DE8A(Now how do I explain that?)

27DE8A scaled one darker is 16CD79

27=16 from the math (2-1=1, 7-1=6)

DE=CD from the math (D-1=C, E-1=D)

8A=79 from the math (8-1=7, A-1=9)

See I subtracted 1 from each number in each number. You can jump down 4 scales if you want to;

The Math for 47DE8A, remember 0123456789abcdef is all there is in doing the math

47=03 from the math of 4-4=0 and 7-4=3

DE=9A from the math of D-4=9 and E-4=A

8A=46 from the math of 8-4=4 and A-4=6

and the color is 039A46

039A46 is 4 scales darker then #47DE8A since a computer reads single digits, (a is 10) (b is 11) (c is 12) ect.. to F [letters must be used to represent the numbers] I have 023456789abcdef on a piece of paper here so I can count back easy when dealing with the letters and reducing and enlaging them for quick jumps down the scale..


NOTE, before reading below;

The #FF0000 looks Orange Doesnt it? (Its pure Red) Well thats because of the Background Color, Yes Background Color mixes with the Font colors to make its own color, also, take notice how the bold changes color above also; So this color is a combination of the font color #FF0000 plus the BGCOLOR of #FFEBCD


Now heres how the numbers relate to colors;

The first 2 digits are the RED, the middle 2 are the Green, the last 2 are the Blue, when you Hit FF in the code, its as much of that color you can get, (there is no GG or HH ect..) when you hit 00, is smallest amount possible which is none by the way, hence #FF0000 is all red and no green or blue, playing this way is like having a pallet and mixing your own colors, it will drive you nuts if you dont have a starting point, LOL....


Peace and Enjoy!!!
DSWS