Blog V. Life, HSL Color Reference

Celebrating Art


Using the subject from yesterday’s post [Blogging My Life Versus Living It], I experimented with HSL, a third option in color choice for Inkscape. Last time, I messed around with RGB and CMYB, [State Of The Blog Logo & Color Reference]. Most of the following is for my own reference. If color theory isn’t your thing, smile at the pretty graphic and move on. If color theory is your thing, what should I explore next?

Delta h
Hue is the color wheel.
0 degrees to 360 degrees IRL, 0 to 255 in Inkscape
Image color values:
h = 0 -> 255
s = 255, full saturation
l = 128, halfway between 0 black & 255 white

Delta s
Saturation goes from gray to full color.
Adding gray to a color is tone
0% to 100% IRL, 0 to 255 in Inkscape
Image color values:
h = arbitrary color, chosen for pretty
s = 0 -> 255
l = 128, halfway between 0 black & 255 white

Delta l
Lightness goes from black to white.
Adding black to a color is shade, adding white is tint.
0% to 100% IRL, 0 to 255 in Inkscape
Image color values:
h = arbitrary color, chosen for pretty
s= 255, full saturation
l = 0 -> 255

Letter Values
B – 0
L – 85
O – 170
G – 255

L – 85
I – 142
F – 199
E – 255

Process Notes

Letter arrangement. Which way? The way I used makes life an offshoot of the blog. The other way, with the word blog across the top and life running vertical, could be interpreted as life supporting the blog. It looked better graphically since the square letters of “life” stacked up nicely, but didn’t read as well, which reduced life to even more of a secondary position. Neither life as offshoot nor life as support was my intended message. Probably unavoidable with “life” coming off the second letter of “blog.”

Notes from Fri. From a thematic point of view, Friday’s post [Coloring Contest] should have been a Sunday post. That’s usually when I do art stuff. However, a) I already had this, and b) boosting the signal on Friday would give people more time before the deadline on Tuesday.

As I said, I did the coloring by the numbers. Since I had just finished fiddling with HSL for today’s post, I used that again in GIMP. The grays are increments of 10 on the V (value) slider 0 to 100. The rest of the colors are increments of 10 on the H (hue) slider, 0 to 360, with V and S (saturation) at max for the brightest possible color. The post was in GIMP rather than Inkscape, hence the different ranges. Also, GIMP has HSV, while Inkscape has HSL. Not completely clear on the difference.

Inkscape 0 to 255, colors
GIMP 0 to 360, colors

Inkscape 0 to 255, gray to full color
GIMP 0 to 100, white to full color

Inkscape 0 to 255, black to color to white

GIMP 0 to 100, black to full color

So, lightness in Inkscape combines value and saturation in GIMP. I think. Getting into deeply-colored waters here.

It gets worse – or at least less artistic. Even using numbers I was being mechanical. With the grays, I noticed that I was filling area with two colors (binary) or with a color gradation (rainbow). When I noticed this, I threw in a triad. Intuitive coloring wasn’t on the table.

BTW, ‘grAy -> America. grEy -> England. It’s that easy.’ This had to be pointed out to me. Unable to attribute the source as I don’t recall it.

Stay safe. Stay sane.
Katherine Walcott

4 thoughts on “Blog V. Life, HSL Color Reference

Comments are closed.

%d bloggers like this: