: Distinct palette for translucent markers over greyscale image? I'm trying to choose a discrete set of 10+ "cold" to "hot" colors to be used by translucent markers/icons displayed over a continuous
I'm trying to choose a discrete set of 10+ "cold" to "hot" colors to be used by translucent markers/icons displayed over a continuous tone grey scale image where each step is clearly different it's the neighbors. (i.e. not just some smooth gradient.)
Being perceived as "cold" to "hot" is not as important as each level being distinct from the next.
Some of the more naive choices have at least some colors that differ mostly in "brightness" (?). This can cause confusion when the markers from these colors blend with the underlying grey values.
Is there a known palette (or method to generate a palette) to use where no matter how the colors blend with the grey values, each bin remains clearly distinguishable from all others?
For an example of usage:
Base image is a black/white image representing the relative landscape elevation for an area of rough and knotty terrain.
Translucent marker icons would be indicating a spot measurement of temperature or gas density.
Markers are colored according to bins of value over the actual range. e.g. If the captured values are 10 to 100 degrees across all markers, the colors would be: 10-19 degrees is blue, 20-29 degrees is green, [...], 100+ degrees is red)
Markers are not opaque, since the underlying image features needs to be visible through them.
The question is how to select a good ~10 colors for the translucent markers such that they remain distinguishable no matter the underlying grey value.
Seems like the sort of thing that would be known in the data visualization field, but my Google skills are failing me here.
Thank you!
More posts by @Sent7350415
3 Comments
Sorted by latest first Latest Oldest Best
If you can implement a two-part tag with an underlayer which is rgb(128,128,128) @ 50% opacity and set to an "exclusion blend mode", and then the colored tag @ 50% opacity, you will wind up with a tag that maintains its color identity on a very wide range of grey values.
This will give you some leeway for picking tag colors.
It will modify the contrast a little of the underlying image but it will be minimal and will be masked by the tag color.
The top square is without the exclusion layer.
The problem of using "lightness differences" of semi-transparent coloured icons/markers on a background of varying lightness is one will interfere with the other at some point.
No problem with up to 6 different colours. After that, you must make concessions which adds to the ambiguity between one colour and another.
You have a better chance of success if you can use some other attribute in addition to hue variation of your icons/markers. Anything you can add to the icon/marker colour will help define the variable: Size, Shape, Texture.
To accomplish the overlay effect and keep colors saturated but transparent, change the marker's/icon's opacity from Normal to Multiply in any Adobe program.
To find a good set of colors to use, you can use the Color Guide in Illustrator to see a bunch of color options that go with a color you've already selected (ex: select red in the swatches, then click the Color Guide, then go through each dropdown to see a variety of shades, tints, complimentary colors, etc. and you can be sure that the colors will all go together but have enough contrast between them). Or you can try kuler.com and browse different color schemes or create your own.
Terms of Use Create Support ticket Your support tickets Stock Market News! © vmapp.org2024 All Rights reserved.