koobas.hobune.stream
Shader: Creating a shader that acts like Photoshops 'Color' blendingmode
Hello there,
I am having trouble creating a shader that behaves like the 'Color' layer effect in Photoshop. I have Googled my ass of to find a decent shader for this but it lead to nowhere.
What I want to achieve is the following: I have gray-scaled images for my menu buttons and I want to colorize the gray areas in the image. The default shaders like 'Transparent/Diffuse' is almost what I want except that it also colorizes the white pixels, and I only need the gray areas to colorize.
I am stuck with this. Is there anybody who can help me? I basicly need a shader with one texture input and one colour input that automagicly combines the two into what I need.
In the following image you can see what I am trying to achieve:
I found the following piece of code at the following URL http://www.yaldex.com/open-gl/ch19lev1sec6.html :
float lu$$anonymous$$ance = dot(base, lumCoeff);
if (lu$$anonymous$$ance < 0.45)
result = 2.0 * blend * base;
else if (lu$$anonymous$$ance > 0.55)
result = white - 2.0 * (white - blend) * (white - base);
else
{
vec4 result1 = 2.0 * blend * base;
vec4 result2 = white - 2.0 * (white - blend) * (white - base);
result = mix(result1, result2, (lu$$anonymous$$ance - 0.45) * 10.0);
}
It could be because I have no idea how to port this ;), but this gives an error at the first line. I think it has to do about dot-products, because it needs to be a mobile shader.
I also found the following snippet at http://www.pegtop.net/delphi/articles/blendmodes/overlay.htm:
if (a < 128)
result := (a*b) SHR 7;
else result := 255 - ((255-a) * (255-b) SHR 7);
Could this be anything usefull?
Your codes are not giving me correct result for replicating the "Color" blending mode of Photoshop. I am Googling for a solution, and I have not found any yet. Somebody can help me?
Well I'm hope it's not too late for you but I think I might have found the solution for this:
Just use this Shader that is a modified version of Unlit Transparent Colored and copies the Photoshop's Overlay behavior on Layers.
Shader "Unlit/Photoshop Overlay"
{
Properties
{
_MainTex ("Base (RGB), Alpha (A)", 2D) = "" {}
}
SubShader
{
LOD 100
Tags
{
"Queue" = "Transparent"
"IgnoreProjector" = "True"
"RenderType" = "Transparent"
}
Pass
{
Cull Off
Lighting Off
ZWrite Off
Fog { Mode Off }
Offset -1, -1
ColorMask RGB
AlphaTest Greater .01
Blend SrcAlpha OneMinusSrcAlpha
ColorMaterial AmbientAndDiffuse
SetTexture [_MainTex]
{
Combine Texture +- Primary, Texture * Primary
}
SetTexture [_MainTex]
{
Combine Texture +- previous, Texture * Primary
}
}
}
}
Good luck.
Thanks! This is exactly what I was looking for, and it would have taken me forever to figure out something that didn't turn pink or look like overexposed crap or have to resort to some far more complex solution that wasted draw calls.
This really ought to be in at least one of Unity's built in shaders; it's far more useful to me than the default murky multiply combine mode.
The shader I did with it (modified mobile / particels / alpha blended)
Shader "$$anonymous$$obile/Particles/AlphaBright" {
Properties {
_$$anonymous$$ainTex ("Particle Texture", 2D) = "white" {}
}
Category {
Tags { "Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent" }
Blend SrcAlpha One$$anonymous$$inusSrcAlpha
Cull Off Lighting Off ZWrite Off Fog { Color (0,0,0,0) }
BindChannels {
Bind "Color", color
Bind "Vertex", vertex
Bind "TexCoord", texcoord
}
SubShader {
Pass {
SetTexture [_$$anonymous$$ainTex]
{
Combine Texture +- primary, Texture * primary
}
SetTexture [_$$anonymous$$ainTex]
{
Combine Texture +- previous, Texture * primary
}
}
}
}
}
Have a look at the code here: http://mouaif.wordpress.com/2009/01/05/photoshop-math-with-glsl-shaders/ - but essentially you convert to the HueSaturationLuminance (HSL)-colorspace, and replace the Hue with your input hue.
"Overlay" is not "color" these act very differently in Photoshop. Overlay is additive, it makes tings lighter (closer to white), color leaves sum RGB value the same.
For example I need a shader that makes things monochrome. In photoshop I create a white colour layer and issue blending mode "color", this makes it grayscale. Next I make another color blending layer with a desired colour.
"I need" is not something we want to read on Unity Answers. Feel free to hire a Unity Expert on Unity Connect if you want someone to do the job for you without putting some effort into solving your own problem first of all.
I am sorry, maybe I expressed myself wrong. I already have a solution in formula (I do not do coding but we have coder in our $$anonymous$$m). I was simply reflecting what the user case (need) might be, and I was describing a problem and a solution in Photoshop (which of course uses different formulas and converts RGB to HSL/LAB etc.
The formula is like this: Input = int( (R + G + B)/3) = iR iG iB --- this gives approximated grayscale value
Shader colour = sR sG sB --- simple rgb value input
Now do for each color:
R = iR + sR; iG - sR/2; iB - sR/2
G = iR - sG/2; iG + sG/2; iB - sG
B = iR - sB/2; iG - sB/2; iB + sB
Values capped to 255 of course.
