Grow your CSS skills. Land your dream job.

Poll Results: Light-on-Dark is Preferred

Published by Chris Coyier

This poll asked people if they like their code editor colors "dark code on light background" or "light code on dark background." Turns out about 2/3 of people prefer light code on dark background.

For the first several days after the Poll ran, light-on-dark was winning by a landslide with 90 or more percent. But over the last month, it has settled into 63% of people preferring it and 37% preferring dark-on-light.

Personally I'm surprised it went as low as 63%. In all the places I've worked and places I've visited and such, rarely do I see a coder working in dark-on-light in their actual code editor. In blog posts and the like, dark-on-light is more common for whatever reason. Probably to be more consistent with the writing in which dark-on-light is nearly ubiquitously preferred.

Now that we have some numbers on preference, it's interesting to think about why it is that way. Especially in contrast to writing. Is it because there just happens to be more quality light-on-dark themes available? Is it easier on the eyes for longer periods? Is dark-on-light actually easier to read but harder on the eyes? Is there something about the brain and the type of thinking that coding requires that prefers more dark? Is it the environments around the computer screen that encourage more dark? Jeremy wonders if corrected vision plays a role. Does age play a role? Are there more connections to be found between how people prefer it and other factors?

Normally I let polls run a little longer but I have another idea ready so look for a new poll in the next day or so.

Comments

  1. Personally I like my code editors like I like my women, dark and mysterious with optional plugins.

  2. I didn’t see this poll, but i completely agree. I have had an ever expanding love affair for SublimeText2 and i use ‘Tomorrow Night’ colour scheme with SublimeText3 & Soda Package. I prefer light on dark because it doesn’t screw my eyes up nearly as much!

    • Scott
      Permalink to comment#

      Funny, I find the exact opposite – light-on-dark makes my eyes go funny. Or at least full white-on-black, Sublime’s default colour scheme isn’t too bad. I know that dark-on-light has been proven over and over in studies to be the best for reading on screens, which is why 90% of all websites use that.

  3. Ivano Pagano
    Permalink to comment#

    I used to give no credit to the dark background and was really buffled at all its popularity, other than thinking that it was a legacy for console terminals users.

    Then I met the interesting work of Ethan Schoonover on Solarized and I had one of those “aha!” moments.

    Now for me it’s about readability and eye-strain prevention: light for day-work, dark for late night shows…

    • I love Solarized as well, but I’m firmly in the 37% camp who prefers a light background. The light Solarized theme is just about perfect IMO.

      Light text on a dark background gives me a headache.

    • Solineoz
      Permalink to comment#

      … thinking that it was a legacy for console terminals users.

      An interesting point there, I actually prefer dark background and I played a lot with MS-DOS and Qbasic in my past.
      I think it is also easier for “my” eyes.

      Probably that the hardware, some display settings, the lighting, etc can influence on our preference.

  4. Light on dark provides better syntax highlighting contrast. Or perhaps just more pleasing contrast.

    • Alex
      Permalink to comment#

      Totally agree on the syntax highlighting. Lots of colours against a white background just don’t read as well.

    • Jeff Carlsen
      Permalink to comment#

      This is the reason I use light on dark. Colored text just doesn’t stand out as much on a light background. I think the brightness of the white background overpowers the highlighting.

  5. Felix
    Permalink to comment#

    Besides it makes you look “hackerish” even though you are just working on CSS!

    • Sarah Dayan
      Permalink to comment#

      I was about to say the same thing, light on dark makes you feel like you’re typing some nerdy Linux commands on a console while you’re only adjusting the width of your div.

  6. Cat Man BanaerLover
    Permalink to comment#

    Light on Dark is the way to go.

  7. MaxArt
    Permalink to comment#

    I use dark on light just because some editors and environments (WinEdt, Notepad++, Eclipse, Visual Stu- ugh!) have that as the default theme, and I’m too lazy to change it.

    Mind you that I actually began coding with light on dark when I was a kid… with Basic and QuickBasic on DOS. And for the latter one I could change the color of pretty much everything. So it’s not really a matter of choice, it’s a matter that I can get used to whatever theme pretty fast so adjusting the colors to my own preferences it’s just not worth the effort.

    Especially if you consider that you will eventually look at code on a PC that’s not your own.

  8. darrenm
    Permalink to comment#

    Being an old phart, when I first started coding light against dark was all there was. I worked on an IBM mainframe system and the terminals had a dark green or black background. Monochrome monitors had either bright green or orange text. The lucky ones got a colour monitor which supported about 6 font colours but still with a dark background. Moving to one of those was luxury. No syntax highlighting though, you got one colour for code and that was it.

    When I started working on PCs, dark on light was such a novelty. I actually stuck with it for nearly 20 years until I saw this poll and thought I’d give light on dark a go again. Can’t say that I feel that strongly about it either way, but it maybe reduces a bit of eye-strain – especially when working late afternoon/evening.

    Going high contrast/dark background in the browser makes some web sites look a bit weird and I need to see what they will look like on a typical monitor setup. But as I have two monitors, with a code window open in one and the browser in the other, I sometimes find white web pages a bit distracting out the corner of my eye when coding in the light on dark editor, especially at night.

    So I’m caught between the light and dark at the moment…

  9. The reason light on dark is more popular is because it is less fatiguing to the eyes over extended period of times.

  10. artem
    Permalink to comment#

    Dark on light is better in usual light environments, most of the time I work using it. But when the light turned off and environment is dark, light on dark reduces contrast and does not hurt eyes.

  11. Brad
    Permalink to comment#

    Tie it to OS, and age and I would bet OSX is younger with light on dark mostly. I have tried light on dark a lot but can’t handle it, I find it harder to search/distinguish code highlighting. All the while I love light on dark in terminal when it is one command at a time,

  12. To me it feels like black on white has a better readability, but as soon as you add colors to it, light on dark has the advantage. So when you’re coding with syntax highlighting light on dark is way easier to read.
    (Being honest, the “it-just-looks-cooler” factor may also be a reason why I prefer light on dark.)

  13. Kaspar
    Permalink to comment#

    Bright on dark is just much more impressive when people walk by the screen.

  14. Subash Pathak
    Permalink to comment#

    I use WebStorm for most of the javascript development and like their light on dark color scheme but for html and css work I prefer Sublime text with flatland theme and light on dark color scheme.

  15. Carl
    Permalink to comment#

    Light on dark because I think syntax highlighting is more effective against a dark background and a dark background for me feels easier on my eyes.

    It does “look cooler” too but…ahem…that’s not why I choose it.

  16. I like ‘light code on dark background’ for my eyes. My eyes some mornings after coding a lot on white screens would tear up and it was an issue. The darker backgrounds are healing for me.

  17. I prefer dark code on light background

  18. I chose Light on dark because its your signature ever since you changed it. i found that sure normally when its dark on light and the code is colourized to differentiate the elements with attributed and properties, to me, it wasn’t clear enough, and some how with light on dark its so much more clear to me, i found that I was learning much quicker and understanding more, I’m not sure if its the specific colors, but i do believe there’s a co-relation between associating colors with tags and properties to help understand code. And for me, when reading your articles, its a really nice transition from dark on light in an article and moving to light on dark code, its like my mind knows to go into a different mode where maybe my thought process changes and I’m more analytical and I know that when I’m looking at the code that I’m trying to understand and dissect the code and really understand it and then when I’m in article mode then I’m more open and I’m more apt to remember the ideas or the concept of the article.

  19. Light on Dark purely due to the fact I find it easier on the eyes for longer periods of time. But yeah as well as Andy Howells I also prefer “my my code editors like I like my women, dark and mysterious with optional plugins”. Best comment I’ve ever seen on CSS Tricks!

  20. I enjoy the Monokai color scheme. It has light text, but a dark grey background. With me working on an iMac (gloss screen) the 100% black background annoys me due to the crazy amounts of reflections.

    I used to get nasty headaches when I would stare at dark text and a stark white background, as soon as I switched it got rid of my headaches.

  21. No one changes their color scheme depending on their environment?

    I always use dark code on a light background during the day. I don’t find that darker text on a light grey (not white) background strains my eyes, and it’s easier to read in a brightly lit room or outside, when you have a glossy screen.

    As soon as it starts to get later in the day, I’ll switch to a light on dark color scheme, which is much easier on the eyes in a dimly lit room or in the dark.

  22. I agree with Chris, I like Monokai color scheme as well. Interestingly the results of this poll seems authenticating my intuitions, makes me feel psychic.

  23. I think the poll was so one-sided because of the specific images used. If I was to pick between those two examples, the dark wins by a mile.

    But my actual colour scheme of choice is Solarized Light (http://ethanschoonover.com/solarized) which is dark on light.

  24. Another reason I love Aptana – by default it comes with a light-on-dark.

  25. I’ve read somewhere that most comfortable colours for reading are green text on dark dark brown background. Also too much white in my face annoys me a lot.

  26. Skun QS
    Permalink to comment#

    I am 14 and Ialso prefer light on dark. I think that dark on light is used in normal websites because we all have white paper and darker ink. It would be quite strange if we had a website with dark background and white text and when we print it, it would be dark on white…

  27. Patrick
    Permalink to comment#

    For me it’s simply because light on dark is impossible to read in direct sunlight, and I quite like coding outdoors.

  28. I have found that with glossy displays, I have to use dark on light, or the entire display becomes a huge mirror. I’ve never had a strong preference before, so it wasn’t that big a deal to switch.

  29. Sid
    Permalink to comment#

    Before MS Windows came along, virtually all applications used a dark background, but since then Microsoft has been intent on forcing us to use white, even though it hurts the eyes and has many other disadvantages.

    Then along came the Web to make our lives even harder. Then glossy reflective screens took over, despite the fact nearly everyone prefers matte.

    Nobody asked us if we wanted these things, they just forced them on us.
    I’m sure even after years of white-bleached awfulness the vast majority of people (perhaps with the exception of desktop print publishers) would gladly switch back to dark themes if they were easy to apply and worked for everything (including the internet!) without conflicts.

    Sadly it takes determination to set up a global dark theme.
    In Windows 7, I use a heavily modded version of the High Contrast Black theme with the bold text removed and garish colours toned down, as well as some manual hacking via notepad to get the borders looking less harsh.
    Most applications respect High Contrast themes, so using that as a start point is the best way to avoid nasty white ribbons etc. Even Office 2013 is black on my PC!
    For the internet I use Chrome with “Stylish” Extension running the “Black Web” scheme from UserStyles.org.

Leave a Comment

Current day month ye@r *

*May or may not contain any actual "CSS" or "Tricks".