4

I'm not sure that this orange color meshes well with my green and white theme, or that it's easily readable.

enter image description here

If it is not readable, is there a better color that would be more easily readable? Should the hover be a different color?

I've tried some color wizards like: http://www.colorsontheweb.com/colorwizard.asp but either I'm extremely sceptical and my eyes are malfunctioning, or it doesn't quite look right. What say you guys?

Update Thanks to you guys, I think I've got it figured out, in my opinion it looks better anyway. From what I understood orange on white was fine with the white and green - so I kept that. I chose to make the breadcrumb black, since that was about the only color that I thought looked descent and would provide something visibly presentable to the different variations of color-blindness. The bottom "New topic" is the hover for the links which is a slightly darker orange than the standard link color. Would anyone differ in the opinion that this would be a solution to my initial Question. enter image description here

Improve this question
  • 2
    Welcome to UX.SE Jakob! Your question as it currently reads now sounds like a critique request, which we don't allow on here. However, with some re-wording you could turn it into a question about the accessibility of certain color combinations. – Matt Rockwell Sep 1 '11 at 17:26
  • 2
    Aaaaaauugugughhghg my eyes – Rahul Sep 1 '11 at 18:34
  • The goggle, oh my, I don't see! – GUI Junkie Sep 1 '11 at 20:53
  • 1
    @Matt Rockwell - thank you for the rephrasing - I will keep that in mind in my future posts. I was obviously unaware of this, and I see that you put some effort into making it permitable so thank you for the kind information :) – Jakob Sep 1 '11 at 21:30
  • 1
    A quick way to test a color choice is to remove ALL color from the design. In Photoshop or Fireworks (or just about any other graphics tool) you can do this by going to Hue/Saturation and turning the Saturation down to 0. If something isn't clear in grayscale, it won't be clear in color, and it certainly won't be clear to the color-blind. – peteorpeter Sep 2 '11 at 20:18
8

The current combination of green and orange that you have here is very hard to see, especially for those with visual impairments. A great resource for checking the accessibility of color combinations is Snook's Colour Contrast Check. This tool checks against multiple color accessibility standards set forth by W3C. This question What are good resources for testing UI design for color-blind users? might give you some additional info.

Improve this answer
2

I have found for myself Adam Polselli's color combination:

dark gray
+ light gray
+ color #1
+ color #2: tint or shade of color #1
+ color #3: complementary color of color #1
= the perfect color scheme!

This is a sample as I understood it.

Improve this answer
2

IMO, the combination of orange and green on the same page works perfectly fine, and the orange text is readable.

However the Orange ON the Green is unreadable, and so should be avoided. They work well on the same page, just not together.

Improve this answer
0

This is perhaps a question better asked on Graphic Design.

That said...no, it's not very readable. The issue is the intensity of the colors. Colors of the same intensity, when placed on top of each other, are really jarring to the eyes as it struggles to fine the delimiter between the objects. The issue is contrast. If you were to use a darker green, or a lighter orange, for instance, it may not be as big of a deal.

Improve this answer
0

This type of color scheme is called Split-Complementary color scheme.

The split-complementary color scheme is a variation of the complementary color scheme. In addition to the base color, it uses the two colors adjacent to its complement.

This color scheme has the same strong visual contrast as the complementary color scheme, but has less tension.

The split-complimentary color scheme is often a good choice for beginners, because it is difficult to mess up.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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