- Home /
mantain color brightness and change only hue
Hello everyone! I have a self illuminated material. I want to change its hue value but keep its brightness always at the same value at runtime. I attach the color scheme to better explain myself: i need the white circle to stay always at that position and only the color slider on the right to go up and down over time, choosing random values every bunch of seconds. How can i code this?
Answer by robertbu · Jan 13, 2013 at 04:49 PM
There are several snippets of code on the web for HSL translations. Typically they are called TransformHSL or TransformHSV. When I needed to do an HSL translation I based my code on the information and sample code (towards the bottom) in this web page: HSV color transforms
Note that this link deals with perceptual color transformations, not with the "HSV" color model, which is just a (perception independent) different representation of an RGB color. Furthermore, that webpage uses the YIQ color model, which is a perceptual color model based on the NTSC standard, and therefore ideally for TV broadcasting. It will usually not yield very good results for computer monitors and such, and will distort the colors.
For a simple RGB<->HSV transformation, you don't need any 3x3 color space transformation matrix.
On the other hand, if you really are interested in a perceptually "correct" hue transformation, you would need a calibrated color space in the first place, which is an entirely different concept than the "RGB" colors everybody uses.
Ok, i've used the HSBColor.cs from Unify Community and imported in /Plugins folder. Now how can i access to saturation and brightness values of the object so i can block them at a certain value?
Use the functions provided in that class (C# example):
// example 1
HSBColor hsbCol1=new HSBColor(renderer.material.color);
// example 2
HSBColor hsbCol2=HSBColor.FromColor(renderer.material.color);
// example: clamp saturation
if(hsbCol2.s>0.5f)
hsbCol2.s=0.5;
// convert back to Color, assign
renderer.material.color=hsbCol2.ToColor();
Thanks for the info wolfram! I'll go back and revisit my code.
(little color conversion discourse)
I should mention the code you linked to is not wrong, it just does a different thing. Sometimes this is what you need, but sometimes this can lead to artifacts. The simple "hue bar" of the color picker uses the straight-forward HSV-conversion mentioned in the other answers (and HSBColor.cs). Once you envolve perception dependent color models such as YIQ, things will get more complicated. You might get a better result for hue animations and so on, but you might get clipping, as mentioned in the article, for example by trying to convert a bright green towards blue or red, since the algorithm tries to keep perceived brightness constant, which is not possible in this case, since blue and red are perceived much darker than green.
For a worst-case example, changing the hue from RGB blue (0,0,255) to green using HSBColor.cs or RGB<->HSV conversion results in (0,255,0). When using the YIQ conversion, the result is (-66,108,-129), which a) needs to be clipped, and which is much "darker" (0,108,0) than "full" green.
The other worst-case is to convert (0,255,0) to "blue" by assu$$anonymous$$g a standard hue rotation of 120 degrees, which results in (152,89,457). Simply clipping this to (152,89,255) results in a pale pink ins$$anonymous$$d of the probably expected bright blue. Trying to achieve a really blue color in this case requires a rotation by only 106 degrees, which results in (110,112,448). Clipping this results in (110,112,255), which is a very unsaturated blue.
Answer by tomekkie2 · Jan 13, 2013 at 04:33 PM
You just need to manipulate with hue value in a HSV color model and then convert the color to RGB.
You can find some conversion scripts for that
Answer by Wolfram · Jan 13, 2013 at 04:43 PM
If you want this for the Color chooser in the Editor, just click on the little striped square just above the 4 numbers seen in your snapshot, then the sliders change to HSV.
To do this via script, you'll need a RGB<->HSV conversion, for example here: http://pastebin.com/A16q3tbU
EDIT: woops, I see @tomekkie2 already answered this, but as a comment.
Answer by felipedejesus145 · Jul 29, 2014 at 05:39 PM
hi there, old post, but if anyone is wondering how to do a hue slider, use this (js):
public var SkyColor : Color = Color.white;
public var hSliderValue : float = 120.0;
public var cSliderValue : float = 0;
function Update() {
SkyColor = EditorGUIUtility.HSVToRGB(cSliderValue/360,hSliderValue/180,1);
}
function OnGUI() {
hSliderValue = GUI.HorizontalSlider (Rect (822, 196+(Mathf.Sin(hSliderValue*-.0175)*30), 243, 39), hSliderValue, 0.0, 180.0);
}
Answer by Sjael · Sep 21, 2016 at 08:13 PM
Here's a nice package for easy HSV blending, which is what you're looking for. Basically just change Color.Lerp()
to Colorx.Slerp()
.
Your answer
Follow this Question
Related Questions
Lerp color of verts with position bigger than 1 1 Answer
Lerp Color doesn't work 2 Answers
Adjusting hue/tint for material color? 1 Answer
How can I change the color of a light over time? 3 Answers
How do I loop a Color32.Lerp? 3 Answers