How does one get the colour value (rgb) after applying an alpha to a colour?
I would like to apply an alpha to a colour and get the rgb values from the result.
Maybe I am over thinking this, or is it just the value e.g. 120 * alpha (0.6) = resulting colour? White is at 255 though, so should it be 120 += 120 * alpha (0.6) ?
The resulting color of the pixel would be dependent on what color was painted behind it, if the color is partially transparent. Which makes this far more complex that you might think.
The rgb values of the color do not change at all when you apply the alpha. All the changes is how that color will blend with other elements in the view.
So you would have to know where on the screen the color will be drawn, and query the view for the color at that pixel, and then blend it with your color according to the colors alpha value.
//psuedocode
resultColor = (backgroundColor * (1 - alpha)) + (myColor * alpha)
So if your alpha was 0.2 you blend the colors so the result is 80% background color and 20% foreground color.
Related
I want to create a Maxwell color triangle
(https://homepages.abdn.ac.uk/npmuseum/article/Maxwell/Legacy/MaxTri.html)
using Matplotlib.
I have found code for something similar: http://www.f-legrand.fr/scidoc/docmml/image/niveaux/couleurs/couleurs.html
However, in that case, equal proportions of R, G, and B yield darker colors which is not what I want.
Any ideas are welcome. I am really struggling with this.
Inside Maxwell Triangle: r + g + b = 1.0, it means the center will be RGB(1/3, 1/3, 1/3) ([0.0,1.0] range) which is dark compared to white RGB(1.0,1.0,1.0).
In order to get white (RGB(1.0,1.0,1.0)) at the center it is possible to multiply RGB values by 3.0: center would be perfectly white but out-of-bound values would be cropped ie RGB(2.0,1.0,1.0) would be displayed as RGB(1.0, 1.0, 1.0).
Another way is to maximize brightness: RGB(r,g,b) -> 1 / max(r,g,b) * RGB(r, g, b) e.g. RGB(0.2, 0.5, 0.1) -> RGB(0.4, 1.0, 0.2). That way values are never clipped and brightness is maximal.
I am facing an issue in which I have to dynamically set the font color regarding the background image brightness.
For instance, if the background image is dark, I would put font color on 'white'.
Is there any tool that can give my the brightness of the image using React-Native?
This seems to be a similar question as mentioned in How to access image pixel data in react-native
Step 1
The marked answer shows a solution in wich create a native (android) function wich returns a object that contains among other things an array filled with the color of every pixel (width, height, hasAlpha and pixels).
Step 2
I am no graphic designer so I am not a 100% sure if this is correct but it sounds ok. As mentioned in the question Image Dark/Light Detection Client Sided Script
JavaScript provides a function that converts each color to gray scale and then returns an average pixel. I don't actually know if react-native provides this function - try it and then I will change the answer to this step.
Step 2.1 - Converting to gray scale
I my understanding it's just that easy:
* Indigo Color Example as you can see in the color detail you have 3 different parts - R (81) G (43) B (219)
* Add these three for each pixel and divide them with 3
* 81+43+219 = 343 / 3 = 114,3 -> 114 = grayscale
Step 2.2 - Adding all grayscales together and divide through sum
All your pixel should be able to transfaired into grayscale. There you can go and add them together and divide it through the amount of pixels you got
Step 3
There is my most questionable point where you maybe have to try it yourself. I would say if 0 is the minimum (dark) and 255 is the maximum (white) the middle 127 is where you decide if the color is dark or white
Examples for dark or light colors
127 is where we decide to go dark or light
Misty Rose graycolor = 236 = light
Indigo Color Example graycolor = 114 = dark
#46bfb0 graycolor = 145 = light
Misty Rose 4 graycolor = 129 = light
#72632f graycolor = 87 = dark
This short experiment by me showed me that 127 as line is maybe not perfect if you look at #46bfb0 it could be dark instead of light - so test it out and please commend your solutions with this project.
I'm new to computer vision.
Does the negative pixels produced by the convolutional layer filters mean it's black in color?
And if the ReLU only converts all negative pixels to 0, is it just converting black color to black color?
0 or negative does not necessarily mean black color. For example, if you rescale pixel values of an image between 0-1, that does not mean all the pixels will look like black color. It is relative i.e. now pixels closer to the value 1 will look like closer to white color. Similar situation happens in your case.
Using C# I'd like to find out if a Hex color (web format, e.g: #FF2233) is dark or light based on which I can decide what the fore color (font color) should be.
The color is selected by application's users as background of certain elements.
The program then needs to figure out if the user's background color is dark then choose white as the font color (for best readability and contrast) otherwise black is chosen.
So far I have been trying to count the number of occurrences of the "F","E","C","D","B" and "A". If there are at least 4 occurrences I consider the color bright. It works for about 70% of times.
Is there a better solution for this?
What if you convert your [Hex color to rgb][1] format then you make the summ of red green and blue
if it's over ((255*3)/2) it's a dark color, else it's light color
System.Drawing.Color col = System.Drawing.ColorTranslator.FromHtml("#FF2233");
if (col.R * 0.2126 + col.G * 0.7152 + col.B * 0.0722 < 255 / 2)
{
// dark color
}
else
{
// light color
}
Edit: Updated with Luminance, thanks to #Jon idea
[1]: How do I get the color from a hexadecimal color code using .NET?
Edit: fixed condition, thanks to #sam360
It's pretty straightforward to compute the luminance of the color from the RGB components. While this will not give the most accurate result on the planet if judged from a human's perspective, it's going to be massively better than other naive attempts.
Given the values of the color components R, G, B, the luminance Y is
Y = 0.2126 R + 0.7152 G + 0.0722 B
You would then pick an arbitrary threshold for Y that separates "dark" from "light" colors.
Let's say I have a picture, I want to create some variations by changing a color. How to do this ?
I don't want to apply color filter to a picture, I want to change pixels color pixel by pixel by testing a color pixel if it is let's say red, i want to turn it to blue.
In Rebol images are also series, so you can use most of the series functions to change/find rgb colors etc.
i: load %test.png
type? i
image!
first i
255.255.255.0 (the last value is alpha)
change i 255.0.0.0 ;change the first rgba value to red
view layout [image i] ;you can see the upper-left pixel is now red
you can dump all rgba values in an image:
forall i [print first i]
you can also change a continues part:
change/dup head i blue 100 ;change first 100 pixels to blue
you can also work on i/rgb and i/alpha, these are binary values (bytes)
and you can use copy to get a part of an image:
j: copy/part at i 100x100 50x50 ;copy from 100x100 to 150x150 to a new image.
Use some of the image processing capabilities as documented here:
http://www.rebol.com/docs/view-guide.html
Demo program showing some of them in action here:
http://www.rebol.com/view/demos/gel.r