On one of our web apps we have a directory structure viewer with a legend and certain highlight colors for folders and files which have special meaning. In the majority of cases where the app is used, there will never be a conflict where you need to show more than one special attribute for a specific file or folder, however, we have just recently ran into a situation where more than one attribute was needed for the item, and in the current design, only one color emerged, which detracted from the usability. In this scheme, what would be the best method to represent multiple special attributes applying to a single file or folder on the tree? (data has been obfuscated)

Example of interface

  • If you just use colours to indicate different attributes, then you'll have to colour colour blindness friendly palettes to ensure that there isn't an issue with some users. My suggestion is to go with another visual element such as a shape or icon to make it more accessible.
    – Michael Lai
    May 26, 2017 at 0:43

1 Answer 1


Consider showing multiple colors as bands or stripes, added on to the edge of the labels.

enter image description here

  • Depending on whether accessibility is an issue or not, simply showing multiple colours when there might be users that are colour blind is still going to be a problem.
    – Michael Lai
    May 26, 2017 at 0:42
  • 1
    Fair enough, though if this is an issue, it's an issue with the whole color label approach, not just the combination of those colors : /
    – dennislees
    May 26, 2017 at 1:34

Your Answer

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

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