2

In my case, I have a background color #333 and a "+" layer with blend mode difference. The blend mode is evidently so that the "+" is always nicely visible for any background color variation. But the default value for the background is #333.

Now I don't know what color I have to input for the "+" so that it looks against the default #333 as if the "+" had a color of #eee for blend mode normal. #eee and difference is darker than #eee and normal; darker than what I want.

Is there some sort of formula or online calculator for these sort of things? Or maybe the graphic editing app I need it for (Inkscape 0.92.3) has it somewhere?

3 Answers 3

5

This is not possible using the Difference Blend Mode with your chosen background color (#333333).

The math formula for the difference blend mode is (B-A). B is the background color and A is the foreground color.The result will always be a positive number (disregard the negative).

In RGB your background color (#333333) is 51,51,51- Your foreground color (#eeeeee) is 238,238,238. The "difference" of these 2 colors is 187,187,187 (always a positive number). This is the "darker color" you see with these colors and the difference blend mode applied.

Even using pure white (255,255,255) as a foreground color your blended color is 204,204,204. That is the closest you can get to your desired (238,238,238) using the difference blend mode and your chosen background and foreground color.

One option to achieve your desired "blended color" using the difference blend mode is to use pure white as your foreground color (255,255,255) and change your background color to (17,17,17). This will result in your "blended color" being #eeeeee (238,238,238).

note- this is color theory and no direct connection to inkscape. I do not use inkscape so I am not familiar with it's particulars.

1
  • Hm, I had searched the wrong corners of the internet. Wikipedia has the answers. Jan 6, 2021 at 19:54
1

I ran into the same problem while building my site recently, and wasn't able to find any solution, so I just wrote an online calculator in case anyone else might have need of it.

https://ashieliw.github.io/Mix-Blend-Mode-Calculator/

0

I've used this one recently, it basically does what you're describing: takes 2 colors and a number of in-between steps (max. 10), then calculates blending colors: https://meyerweb.com/eric/tools/color-blend/#FF9999:339999:10:hex

1
  • This is a useful tool but not really for this problem. I can't enter any blend mode like difference or, say, multiply; and neither does this tell me how many steps I need for difference, and which step to pick. Jan 6, 2021 at 14:38

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.