I'm working on an app and I have two images. One is the reference image and the other is the image produced in production (it's the layout created in HTML if you must know).

To make sure that my production layout is accurate I'm setting the background of the production layout to the reference image. This way I can see how far off I am and make adjustments.

The problem I'm having is that it's hard to tell the two images apart as you'll see.

Here's a screen shot:

enter image description here Here is red as a background tint:

enter image description here

Color is set to black and opacity is half:

enter image description here

I was going to make a script to colorize the reference image in red but if the image already contained a lot of red that won't work. So my question is, if I had to pick two colors that will work as background colors what would I use? I hope this makes sense.

PS Also, could someone create the tag "onion-skinning"?

  • 2
    For what it's worth I tend to use red as you suggested or just reduce opacity if red isn't feasible.
    – Cai
    Mar 15, 2016 at 2:16
  • I don't think onion-skinning would be a tag that is useful enough to warrant creation. It's a pretty niche subject that is rarely asked about Mar 15, 2016 at 4:25
  • @ZachSaucier it's not used that often but if we add the tag to this question then people can find it in the future under that keyword. I added a lower opacity image to the post. I think in this case the production image is off so much there's not too much that can be done to make it look better. I might try and add lines through the image and see how that looks. After I have a more accurate representation I'll post how another screenshot. Mar 15, 2016 at 4:49


Your Answer

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

Browse other questions tagged or ask your own question.