Jump to content
You must now use your email address to sign in [click for more info] ×

Recolour Adjustment - HEX code/RGB/HSL/CMYK etc?


Recommended Posts

Hi,

I recently noticed when using the recolour adjustment, it gives you the colours on a degree scale with saturation and lightness options underneath.

Everything else in the app works with HEX codes or RGB/HSL/CMYK etc sliders. Is there a reason for this? It seems to make recolouring to a set value, very difficult. Does anyone know if you can set a recolour adjustment to a HEX value (or other RGB/HSL etc) or how the degree scale translates to these other formats?

Thank you

Link to comment
Share on other sites

 

Recolor offers input for hue and saturation as absolute values in the scale 0-360 for hue, and 0-100 for saturation. 
lightness is taken from source image. The slider allows relative adjustment +/- 100%

Hex values are mostly used for absolute RGB, which does not make sense here

hex values are 00-FF, equals 0-255 in decimal. You normalize to float 0.0 -1.0 by dividing by 255.


You would need to convert RGB into HSL, take H and S, ignore L

multiply H by 360

multiply S by 100

see https://en.wikipedia.org/wiki/HSL_and_HSV

From RGB[edit]

This is a reiteration of the previous conversion.

Value must be in range {\displaystyle R,G,B\in [0,1]}.

With maximum component (i. e. value) 

{\displaystyle X_{max}:=\max(R,G,B)=:V}

and minimum component 

{\displaystyle X_{min}:=\min(R,G,B)=V-C},

range (i. e. chroma) 

{\displaystyle C:=X_{max}-X_{min}=2(V-L)}

and mid-range (i. e. lightness) 

{\displaystyle L:=\operatorname {mid} (R,G,B)={\frac {X_{max}+X_{min}}{2}}=V-{\frac {C}{2}}},

we get common hue:

{\displaystyle H:={\begin{cases}0,&{\text{if }}C=0\\60^{\circ }\cdot \left({\frac {G-B}{C}}\mod 6\right),&{\text{if }}V=R\\60^{\circ }\cdot \left({\frac {B-R}{C}}+2\right),&{\text{if }}V=G\\60^{\circ }\cdot \left({\frac {R-G}{C}}+4\right),&{\text{if }}V=B\end{cases}}}

and distinct saturations:

{\displaystyle S_{V}:={\begin{cases}0,&{\text{if }}V=0\\{\frac {C}{V}},&{\text{otherwise}}\end{cases}}}
{\displaystyle S_{L}:={\begin{cases}0,&{\text{if }}L=0{\text{ or }}L=1\\{\frac {C}{1-\left\vert 2V-C-1\right\vert }}={\frac {2(V-L)}{1-\left\vert 2L-1\right\vert }}={\frac {V-L}{\min(L,1-L)}},&{\text{otherwise}}\end{cases}}}
 
i made a conversion by procedural texture filters, see

Mac mini M1 A2348 | Windows 10 - AMD Ryzen 9 5900x - 32 GB RAM - Nvidia GTX 1080

LG34WK950U-W, calibrated to DCI-P3 with LG Calibration Studio / Spider 5

iPad Air Gen 5 (2022) A2589

Special interest into procedural texture filter, edit alpha channel, RGB/16 and RGB/32 color formats, stacking, finding root causes for misbehaving files, finding creative solutions for unsolvable tasks, finding bugs in Apps.

 

Link to comment
Share on other sites

35 minutes ago, NotMyFault said:

Wow - thank you for this, I'll have a read.

I feel like HSL recolour options could be a useful feature...and probably easily added I would have though.

Cheers

 

Recolor offers input for hue and saturation as absolute values in the scale 0-360 for hue, and 0-100 for saturation. 
lightness is taken from source image. The slider allows relative adjustment +/- 100%

Hex values are mostly used for absolute RGB, which does not make sense here

hex values are 00-FF, equals 0-255 in decimal. You normalize to float 0.0 -1.0 by dividing by 255.


You would need to convert RGB into HSL, take H and S, ignore L

multiply H by 360

multiply S by 100

see https://en.wikipedia.org/wiki/HSL_and_HSV

From RGB[edit]

This is a reiteration of the previous conversion.

Value must be in range {\displaystyle R,G,B\in [0,1]}.

With maximum component (i. e. value) 

{\displaystyle X_{max}:=\max(R,G,B)=:V}

and minimum component 

{\displaystyle X_{min}:=\min(R,G,B)=V-C},

range (i. e. chroma) 

{\displaystyle C:=X_{max}-X_{min}=2(V-L)}

and mid-range (i. e. lightness) 

{\displaystyle L:=\operatorname {mid} (R,G,B)={\frac {X_{max}+X_{min}}{2}}=V-{\frac {C}{2}}},

we get common hue:

{\displaystyle H:={\begin{cases}0,&{\text{if }}C=0\\60^{\circ }\cdot \left({\frac {G-B}{C}}\mod 6\right),&{\text{if }}V=R\\60^{\circ }\cdot \left({\frac {B-R}{C}}+2\right),&{\text{if }}V=G\\60^{\circ }\cdot \left({\frac {R-G}{C}}+4\right),&{\text{if }}V=B\end{cases}}}

and distinct saturations:

{\displaystyle S_{V}:={\begin{cases}0,&{\text{if }}V=0\\{\frac {C}{V}},&{\text{otherwise}}\end{cases}}}
{\displaystyle S_{L}:={\begin{cases}0,&{\text{if }}L=0{\text{ or }}L=1\\{\frac {C}{1-\left\vert 2V-C-1\right\vert }}={\frac {2(V-L)}{1-\left\vert 2L-1\right\vert }}={\frac {V-L}{\min(L,1-L)}},&{\text{otherwise}}\end{cases}}}
 
i made a conversion by procedural texture filters, see

 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.