Do all 8 bit colors exist in 24 bit color space? If so how to map? - colors

With 8 bit color depth there are 256 colors. With 24 bit color depth there are 16,777,216 colors. Is there a direct mapping between every color in the 8 bit space to a color in the 24 bit space? I would think the answer to this question is yes, but the comments to this answer suggest the mapping is only an approximation.
What I would like to do is create a palette of 8 bit colors in the 24 bit color space by specifying a 24 bit RGB value. I figured I could do this using this (obviously broken) logic:
3 bits for red == 8 unique values of red, 0-7
3 bits for green == 8 unique values of green, 0-7
2 bits for blue == 4 unique values of blue, 0-3
255/8 = 32 for red and green increment value
255/4 = 64 for blue increment value
{
"Red": [0,31,63,95,127,159,191,223,255],
"Green": [0,31,63,95,127,159,191,223,255],
"Blue": [0,63,127,191, 255]
}
So with 9 values of red, 9 values of green, and 5 values of blue I get 405 colors which is wrong. I know I need 8 values of red and green and 4 values of blue so I just adjusted things a bit:
255/87 = 36.57142857142857 for red and green increment value
255/43 = 85 for blue increment value
So this works for blue, but now my red and green increment value is not a whole number.
Once I got the mapping figured out I was going to loop through it like this:
for(r in rgbData.get("Red")) {
for(g in rgbData.get("Green")) {
for(b in rgbData.get("Blue")) {
colors.add("rgb ${r} ${g} ${b}")
}
}
}
This may be a totally incorrect approach to do what I want, just wanted to show I have tried something :)
UPDATE:
I tried the approach #Marc B suggested but it doesn't seem right. For instance, there is no white in the map I generated (which is 255, 255, 255 using 24 bit RGB). Using his approach this makes sense to me because the highest RGB value is 224, 224, 192 as can be seen:
full red == 111
111 >> 5 == 11100000
full green == 111
111 >> 5 == 11100000
full blue == 11
11 >> 6 == 11000000
11100000 11100000 11000000 == 224, 224, 192
224, 224, 192 != white
Here is the map generated using his approach:
{
"Red": [0,32,64,96,128,160,196,224],
"Green": [0,32,64,96,128,160,196,224],
"Blue": [0,64,128,192]
}
And the palette it generates:
UPDATE 2:
After doing some more research I have realized that when "X colors" (X being some number like 256, 16,777,216, etc.) are referred to that those colors can be just about anything. There is not a predefined set of 256 colors that are "the" 256 colors, though there are (as several have already mentioned) predefined sets of 256 colors that are "the" 256 colors for a specific implementation. I was also able to find a GIMP .gpl palette file on my organizations wiki that specified the 256 colors I am concerned with, so I can just copy the values out of there.

The practical answer is probably yes. Having said that, it's really a hardware dependant thing. #Marc B is close to correct (probably close enough for most people) but the real answer is it depends, it depends on the hardware, and it wont be exact from (hardware)implementation to implementation, but it will likely be exact enough for most people.

The way to convert is to multiply each channel by the highest level you want output and divide by the highest level of input.
{
"Red": [0,36,72,109,145,182,218,255],
"Green": [0,36,72,109,145,182,218,255],
"Blue": [0,85,170,255]
}
With this method you don't need to devote an even number of bits to each channel, you can use an arbitrary number of levels for each. You can get a more even distribution, but you don't get to use all 256 colors. One common arrangement is 6/7/6 for 252 colors:
{
"Red": [0,51,102,153,204,255],
"Green": [0,42,85,127,170,212,255],
"Blue": [0,51,102,153,204,255]
}

I know this answer is probably a bit late, but it might be useful for others. If someone knows what the algorithm outlined below is called, please let me know in a comment.
I'm currently working with different display hardware and I've run into the problem of converting a channel with m bits to one with n bits, where m < n; for example: convert a 5 bit channel to an 8 bits channel. White (b11111) should map to white (b11111111) and black should map to black.
To map, for example, 5-bits b10111 to 8 bits, I pad the missing bits with the MSBs from the original data:
b10111
^^^--- we need these three MSB again later, as 8-5 = 3 missing bits
shift left 3 bits:
b10111000
and pad with MSBs:
b10111101
^^^--- the MSBs
That maps quite well (you might want to apply rounding for values that are not all 1s) and round-trips (you can convert less than 8 bits to 8 bits, convert back and the result is the same as the original value).
If the narrower channel is less than 4 bits wide (like 3), the whole value will repeat completely:
b101 -> b10110110

Related

How to find out 70% mid blue (#686e9f)

My company launched a new branding. I'm creating palettes to rework on numerous websites. One of the colors is named Mid blue (#686E9F) and an associated color is Mid Blue Tint as 70% Mid blue but no RGB/Hex values.
How to find out 70% mid blue (#686e9f)?
Reference:
In fact you can find it by using the opacity.
Your blue "tint" is the same as your #686e9f wich means this rgba representation rgba(104,110,159). And with 0.70 opacity on this you get back your color.
to test you can paste this rgba(104,110,159,0.7) on this website :
http://www.menucool.com/rgba-color-picker
So you could begin to translate the hex-number into RGB values
-> https://www.rgbtohex.net/hextorgb/
Then I presume you could multiply those values with 0.7, if I understand this 70% stuff correctly.
If I understood your question correctly and you were asking for a RGB representation:
rgb(104, 110, 159)
68 -> 104
6e -> 110
9f -> 159
The hex value is just a RGB value in hexadecimal. IF you were looking for something else, please specify a clear question.

Convert number to tkinter color

Is there a simple way to convert a number into a tkinter color (#ffeedd).
I'm already setup to take the number and multiply it by 8 to give me a bit more color range leeway, and maybe even multiply it by 16 depending on just how much leeway I have to work with, not sure on how much leeway I will have yet... but I'm guessing I'll only be able to multiply by 8. How do I take that number and convert it over so I can use it with canvas.create_line((x,y), (x,y), fill = 'color'). I tried hex(number) but it just gives me back that color 0x0 doesn't exists... kinda figured that would happen but thought it would be worth a try.
a = 326
b = a * 8
canvas.create_line((x,y), (x,y), fill = b)
Ensure you have 3 or 6 hex digits. For instance:
frame.configure(background="#{0:06X}".format(0x808080))
The actual permitted set of color specfications is given in the GetColor
manual page.

What format is this colour value? 0x000066FF

Can anyone tell me what format this colour value is in: 0x000066FF.
I believe its a 16 bit hex with an Alpha Channel?
You are right - looks like an ARGB value.
ARGB values are typically expressed using 8 hexadecimal digits, with each pair of the hexadecimal digits representing the sample values of the Alpha, Red, Green and Blue channel, respectively. For example, 0x80FFFF00 represents 50.2% opaque (non-premultiplied) yellow. The "0x" prefix is used to identify a number as hexadecimal in C notation. 0x80 represents a 50.2% alpha value, because it is 50.2% of 0xFF (in decimal 128 is 50.2% of 255), the first 0xFF represents the maximum value a red sample can have; the second 0xFF is like the previous but for green; 0x00 represents the minimum value a blue sample can have (effectively – no blue). Consequently red + green yields yellow.

Programatically step through 24 bit color spectrum, get x amount of average colors

Yes, I AM trying to re-invent the wheel. :-) . I am doing my own image compression, (testing some ideas for transmitting parts of images over tcp). Anyway... I am trying to step through 24 bit rgb color, get a complete linear range, and (step through) that range at x intervals.
I am trying to get the average 99 colors over the complete spectrum. (24bit / 99) = 167488.6363636364 , so at 16K interval I want to pic a color for my 99 color palette.
I am having trouble understanding how RGB really works... It seems the is NO linear range..., or is there...?
I am currently doing the following:
var_interval = (255 * 255 * 255) / 99
For r = 0 To 255
For g = 0 To 255
For b = 0 To 255
If var_counter = var_interval Then
objWriter.Write(r & "," & g & "," & b)
End If
var_counter += 1
Next
Next
Next
I am getting my colors, but this step does not generate "scaling" colors if you will.
Any ideas?
There certainly is a way to iterate through the color spectrum, but whether you go this approach is your own choice :). You can make use of the HSL color space (Hue, saturation, and lightness) instead of RGB (red, green, blue). The hue represents which color (ranging from 0 to 360), the saturation is how much of that color your want (0 to 100), and the lightness is how bright you want it.
So, to answer your question, you can take 360/99 as your sampling rate from the hue, choose a consistent value and intensity that you'd want and then convert that to RGB space to display it. For the conversion see:
http://web2.clarkson.edu/class/image_process/RGB_to_HSI.pdf
and for information on HSL color space see:
http://en.wikipedia.org/wiki/HSL_and_HSV

Alpha blending a red, blue, and green image to produce an image tinted to any rgb value?

Basically, I have a context where I can't programatically tint an image, though I can change it's alpha value. With some experimentation, I've found that I can layer a red, blue, and green version of the image, with specific alpha values, to produce a wide range of colors. However, I am wondering if it's possible to achieve a true RGB representation through this method? If so, what is the formula for converting an RGB value into different alpha values for the red, blue, and green layers.
The basic "equation" of alpha combination is:
alpha * (R1,G1,B1) + (1-alpha) * (R2,G2,B2)
When you have three layers with alpha you are actually combining 4 layers (the 4th one is black) so the final color is:
alpha1 * (R1,G1,B1) + (1-alpha1) * (
alpha2 * (R2,G2,B2) + (1-alpha2) * (
alpha3 * (R3,G3,B3) + (1-alpha2) * (0,0,0) ) )
Provided you have the same image on each layer and layer1 is the red channel (G1=B1=0) and layer2 is green and layer3 is blue you get:
(alpha1 * R, (1-alpha1)*alpha2 * G, (1-alpha1)*(1-alpha2)*alpha3 * B)
For a white pixel you can do any possible color. For a black pixel you cannot do anything but black. For any other pixel, you are restricted by the values of R, G and B.
Say you wanted to achieve (Rd, Gd, Bd) at a pixel where the current color is (R, G, B) then you would have to choose:
alpha1 = Rd/R
alpha2 = Gd/(G*(1-alpha1))
alpha3 = Bd/(B*(1-alpha1)*(1-alpha2))
The problem is that alpha can typically only be between 0 and 1. So, for example, if Rd > R there is nothing you can do.
You can do better if you can control the blending function (for example, in Photoshop).
I don't think that's possible, if I understand you correctly.
If, for a certain pixel, your image's red value is, say, 0.5, you can combine that with an alpha in the (typical) range [0,1] to form any value up to and including 0.5, but you can't go above, to get e.g. 0.6 or so as the output value.
If you're looking to create 3 layers that blended together add up to the original image, it's quite possible. Here's a link to a Python script that calls functions in Paint Shop Pro to do the hard parts.
http://pixelnook.home.comcast.net/~pixelnook/SplitToRGB.htm
If you need more detail than that, leave a comment and I'll try to fill it in later.

Resources