The Design Community Hub

c/dark-mode-design

28

amy302•16d ago

Why does everyone keep using pure white text on dark mode?

I keep seeing apps and sites using #FFFFFF for text on dark backgrounds and it kills my eyes after 10 minutes. I run a shop and look at my phone between jobs so I notice this a lot. Even a slight off white like #E0E0E0 is way easier to read and strains less. Am I the only one who finds pure white text actually harder to read on dark themes?

27

the_diana•16d ago

Used to hate dark mode until last week at work

I always thought dark mode was just a gimmick for gamers. But last week I was working on a client project at 2am and my eyes were burning. I switched their app mockup to a dark theme just to see what it'd look like. The contrast actually made the content pop way more and I finished the whole layout in like an hour. Has anyone else had a project that suddenly made dark mode click for them?

14

joseph_lewis92•17d ago

Debate: Should dark mode text always be pure white or a softer off-white?

I'm working on a project and my client in Austin hates off-white text, says it looks washed out. But pure white (#FFF) on dark backgrounds gives me eye strain after about 2 hours of coding. Which side are you on and why? Got a specific hex code you swear by?

5

bailey.sandra•17d ago

Client told me my text was disappearing on dark backgrounds

I had a client in Portland last month who sent me a screenshot with their phone brightness turned way down. I couldn't even read the body copy on my dark theme. That's when I realized I never tested my contrast ratios on lower brightness settings. Now I always check my color pairings at 30% brightness before I call a design done. Anyone else had to adjust their color palette after seeing it on a real device?

11

king.dakota•18d ago

Serious question, is pure black dark mode actually hurting your eyes?

I spent 6 months building two versions of my app's dark theme, one with #000000 and one with a dark gray like #121212. Tested them on 30 people in my design meetup group here in Austin. Almost everyone complained about eye strain and halos with pure black after reading for 20 minutes. The dark gray version got way better feedback, people said they could read for way longer without headaches. I think Material You and iOS are onto something by not going all the way to pure black. Has anyone else tested this with real users or am I overthinking it?

3

perez.cole•18d ago

I finally stopped using pure black after a client complaint

Was working on a dashboard redesign at a coworking space in Austin last Thursday and a user said the text was hurting their eyes. Turns out my dark mode used #000000 for backgrounds and it was causing bad contrast strain on OLED screens. Anyone else switch to dark gray like #121212 instead of pure black?

16

bailey.xena•19d ago

Why does everyone keep using pure black for dark mode backgrounds?

I keep seeing new apps and websites slap #000000 as their dark mode background and it honestly hurts my eyes after 10 minutes. Pure black creates awful contrast issues with text and makes everything feel washed out if you have any colorful elements. I switched my design to a dark gray like #1A1A2E about 2 years ago after reading a study from Google about eye strain and dark mode readability. Has anyone else noticed this trend getting worse in the last 6 months?

11

paigewood•22d ago

Chat with a UX designer in Denver made me rethink my dark mode contrast

I was at a coffee shop last week and sat next to a UX designer working on her laptop. She mentioned that dark mode should aim for about 70% contrast instead of the typical high contrast we all think about, because harsh whites on black can cause eye strain. She also said she uses a specific cool gray like #2C2C2C for backgrounds instead of pure black to reduce that effect. Has anyone else played around with different shades of dark gray in their themes?

11

josephs26•22d ago

Paid $80 for a premium dark theme plugin and it was a total waste

I thought I was being smart buying this fancy dark mode plugin for my website last month. Cost me $80 and it promised all these auto-switching features based on user timezone. But honestly, it made everything look washed out and the contrast was terrible on my OLED screen. I spent another 6 hours tweaking the CSS just to get it looking half decent. My free Bootstrap dark theme I had before actually worked better. Why do people keep pushing these paid solutions when the basics work just fine? Has anyone else had better luck with a paid plugin or am I the only one who got burned?

13

riley58•23d ago

My dark mode buttons looked washed out until I stopped using pure white text

I kept wondering why my call-to-action buttons had no pop on dark backgrounds, so I tried #E0E0E0 instead of #FFFFFF and the contrast actually improved. Has anyone else found specific off-white values that work better than pure white in dark themes?

27

willow_anderson85•24d ago

Had to pick between #121212 and #1a1a1a for my app background

Spent 3 hours testing both on an OLED phone. Pure black looked too harsh. The slight gray of #1a1a1a was way easier on my eyes after 20 minutes. Went with the gray. Users haven't complained yet. Anyone else have a preference for their dark mode base color?

24

barbara429•24d ago

Tried dark mode with pure black vs dark gray and my eyes noticed immediately

I was building a dark theme for a dashboard last week and used #000000 for the background out of habit. Then I switched it to #1E1E1E on a whim and honestly the difference was huge - way less eye strain after staring at it for 4 hours straight. Has anyone else found that dark gray beats pure black for readability, or is it just a personal preference thing?

16

the_ray•24d ago

Unpopular opinion: pure black backgrounds (#000000) are actually terrible for reading

I tried using #000000 as the background for my note-taking app last month because everyone says dark mode should be 'true black' for battery savings. After 3 days my eyes were strained way worse than with a light theme. The contrast ratio between pure black and white text is like 21:1 which causes halation effects on OLED screens. I switched to a dark gray like #1A1A2E instead and reading feels way more comfortable. Has anyone else noticed this problem with true black or is my vision just weird?

24

the_lee•25d ago

Spent $60 on a dark mode testing tool and it caught 14 contrast issues I missed

I design mostly on a nice calibrated monitor but never thought about how my dark themes look on cheap laptop screens or phones with auto brightness. Last week I bought a subscription to a contrast analyzer that simulates different screen types and lighting conditions. Found issues in all three of my recent projects. Has anyone else used one of these tools or do you just rely on your own eyes and design software?

13

nancy3•26d ago

Chat with a night shift nurse changed my whole approach to dark mode

I've always been a "just invert the colors" type for dark themes. Last week my neighbor Sarah who works overnights at County General saw me coding and asked why my dark mode was so blue. She said it hurts their eyes after 4 hours in a dark room. Turns out they use a warm gray with like 15% saturation at her hospital. I tried it on my dashboard and it's way easier on my eyes after midnight. Has anyone else experimented with warm tones vs cool tones for their dark mode?

28

grace926•29d ago

My dark mode design was too dark and my client didn't notice for 2 weeks

Last month I was working on a dashboard redesign for a small logistics company near Chicago. I set the background to pure black, #000000, and the text to a super dim gray. I liked how sleek it looked on my monitor, but when I sent the preview to my client, they just said "looks good" and moved on. Two weeks later, they called saying their employees couldn't read the screen in a sunny office. Turns out the text contrast ratio was like 2:1, totally failing accessibility standards. I had to redo the whole dark theme with proper contrast ratios. Has anyone else had a client sign off on a design that was obviously broken?

13

ericjackson•29d ago

Just found out dark mode doesn't actually save battery on LCD screens

I saw this article from DisplayMate that said only OLED screens get a real battery bump from dark mode. My laptop has an IPS LCD panel so I'm just making things harder on my eyes for no reason apparently. Been designing dark themes for years thinking I was saving power but nope. Anyone else feel kinda stupid learning this late?

29

troy_butler7•1mo ago

Overheard a dev say dark mode is just inverted colors... had to bite my tongue

Was sitting in a coffee shop in Austin last Tuesday and overheard two junior devs talking. One said dark mode is basically just flipping the color scheme and lowering the brightness. I almost choked on my drink. In my experience, that approach makes text look washed out and hurts readability on long pages. But I get where they're coming from since a lot of starter tutorials oversimplify it. What do you all think is the biggest misconception about designing dark themes that beginners get wrong?

6

wadeyoung•1mo ago

Update: Switched my dark mode editor background to a dark blue after a truck stop coffee break

Was sitting at a Pilot in Ohio last week, reading documentation on my laptop, and realized the pure black theme was making my eyes water after 30 minutes. Changed it to a navy-like #1a1a2e and now I can stare at code for almost 2 hours before needing a break. Anyone else swap away from pure black for readability?

14

paigewood•1mo ago

I keep seeing dark themes that use pure black (#000000) for backgrounds and it hurts my eyes after like 10 minutes

I tried reading on a site with #000 black background and white text last week and got crazy eye strain, turns out using a dark gray like #121212 gives way better readability and still looks dark enough, has anyone else noticed this making a difference?

14

gavinwood•1mo ago

Sat down to pick dark mode colors for a dashboard and 4 hours later still had nothing

I thought I'd just swap the background to #1e1e1e and call it a day, but then every text color looked washed out or too harsh. Ended up going through 30+ shades of gray before finding one that worked with the accent blue, took way longer than the actual layout work. Anyone else get stuck in the color picking hole for way too long?

23

brown.susan•1mo ago

I used to think contrast ratios didn't matter much for dark mode

Read a post on UX Stack Exchange that said even a 0.5 point difference in contrast can make text unreadable for some users with astigmatism. Now I'm double checking all my gray-on-gray combos. Anyone else started measuring their contrast levels differently since then?

6

sandra146•1mo ago

Read a study that said 78% of people pick dark mode if it's the default option

I was looking at some user research from Nielsen Norman Group last week and that number blew my mind. It means default settings are WAY more powerful than just making a good dark theme. How do you decide what the default should be for a new app?

17

grant_torres•1mo ago

Trying to decide between pure black or dark gray for a dashboard background

Honestly, I had to pick a base color for a new analytics dashboard last week. It was between pure black (#000000) and a dark gray (#121212). I went with the dark gray because I read it reduces eye strain from high contrast. After testing with a few users, one person actually said 'this feels easier to look at for a long time.' Has anyone else found gray to be better than true black for data-heavy screens?

21

betty_fisher5•1mo ago

My colorblind cousin tried my new app's dark mode and asked if I was trying to 'hide the buttons'.

He said the text and icons just blended into the dark gray background, which made me realize I'd only tested it with my own eyes and needed way more contrast for accessibility.