Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I want to make sure I style all the relevant tags so that I don't end up with a broken UI which will be ugly or difficult to use.

EDIT: I'm hope to produce a .QSS file (Qt4) that can be loaded into applications.

share|improve this question
belongs somewhere else (stackoverflow.com? not even sure what qt4 is.) –  Charles Boyung Feb 14 '11 at 5:53
Qt4 is a cross-platform application framework that is widely used for developing application software with a GUI. - I'm pretty sure it belongs here. –  palbakulich Feb 14 '11 at 6:18
I think the fact that you used the phrase QT4 confuses the matter. Basically you are asking about designing a dark desktop user interface theme. If you rephrased the question without the technology, and only include the technology as a footnote in your question it would be clearer. –  Berin Loritsch Feb 14 '11 at 13:24
I'm pretty sure it isn't that widely used since as a developer that keeps up with most development trends, I've never even heard of it. But either way, Berin is right - technology-specific details really have no place here. –  Charles Boyung Feb 14 '11 at 14:09
I'd say this is a theme implementation question. I'd start with the official documentation: qt-project.org/doc/qt-5/qtquick-usecase-styling.html –  DA01 Dec 26 '13 at 18:55
add comment

closed as unclear what you're asking by DA01, Izhaki, Erics, Charles Wesley, ChrisF Dec 29 '13 at 22:40

Please clarify your specific problem or add additional details to highlight exactly what you need. As it's currently written, it’s hard to tell exactly what you're asking. See the How to Ask page for help clarifying this question.If this question can be reworded to fit the rules in the help center, please edit the question.

1 Answer

There are two major challenges with dark themes: controlling contrast and the fact that what you are seeing is usually an inverse of what people expect. They can be very sexy, and even quite useful in dark rooms when you are trying to avoid eye fatigue.

Some concepts to consider:

  • The eye is more sensitive to contrast differences when the background is dark than when it is light.
  • The W3C came up with an algorithm for checking your contrast ratio. This page let's you try it out.
  • Font is more critical with dark backgrounds than with light backgrounds. Keep it simple, serifs will likely get in the way.

I would seriously consider keeping editing panes with a lighter background than the text. I wouldn't have the background be plain white because that will be jarring to the eye. However, a darker shade of off-white that gives you a 7:1 contrast from the text will be quite readable (example, the color #999 and #000), and work better with what you see when you print something out.

Menus, buttons, etc. should all be light text on dark backgrounds. To work out the color scheme, I'd play with Kuler to try things out. It lets you experiment freely to find combination that work well together. The tool itself is light text on dark background, so you might even find some inspiration for your theme there.

share|improve this answer
add comment

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