6 ms·
Stop using grey text (2025)
- dolebirchwood 7mo agoI appreciate the grey "LIKE?" text above the likes counter. Really drives the point home.
- Twey 7mo agoMore generally use a contrast checker on any pair of colours that are likely to be in juxtaposition and need to be legible. Helpful of the website to demonstrate the problem in situ in its tag links and code comments! (Maybe just in dark mode?)
- SoftTalker 7mo agoYes, you want enough contrast, but not too much. Either extreme is hard to look at for long periods.
- cryzinger 7mo agoWCAG color contrast checkers in particular have never steered me wrong. It's interesting (but makes sense) that contrast needs to be higher for small text than for large text!
- wobblywobbegong 7mo agoScreen brightness is a pretty important contributing factor. If you have this problem a lot, verify your screen is bright enough. ( Regardless of his point )
- chrismorgan 7mo agoOr the other way round—if you feel the contrast is too high, your screen may well be too bright and you should reduce its brightness.
- SoftTalker 7mo agoDark/charcoal grey is better than pure black for text. But it's still dark enough that most people would call it black.
- carlosjobim 7mo agoIt's not, that's a myth. The blackest black your monitor is capable of is best for text.
- ChrisMarshallNY 7mo agoThe problem is contrast, really. Some color combos are terrible, and you also have issues with color-blindness (which is why gray is used a lot). Gray text, against a gray background, can suck. I’m getting on in years, and low-contrast text affects me a lot more, these days, than it used to.
- 112233 7mo agoYeah, nothing like neon green on magenta. So much contrast, my eyes each read their own line... ZX Spectrum had some excellent color combinations
- hulitu 7mo ago> ZX Spectrum had some excellent color combinations Yes, compared with the abominations that are Windows 10, 11 and Android, ZX Spectrum was luxury.
- mr-pink 7mo agoso wrong
- tejohnso 7mo agoIsn't most of the text on the page grey? It's not white, it's rgb(215,215,216). And the background is not black. Some worse examples are shown, but then the message comes across as "don't use grey unless you know what you're doing, like I do, because I'm using grey while I tell you not to use grey, but mine is okay." Maybe aside from the unset option, something more specific about a minimum contrast threshold would be useful. Ideally the author wouldn't be breaking below that threshold themselves while explaining it.
- quuxplusone 7mo agoThat, plus the line "Or, you could just not do it [change your colors with CSS] in the first place which would look like this:" — followed by a super-duper-CSS-styled box thingie full of gray text.
- tom_ 7mo agoThe background is indeed not black, but if it isn't actually white then it's close enough that the text, which i'm sure is indeed mostly actually grey rather than black, shows up well. I've seen worse.
- cratermoon 7mo agoIndeed the WCAG guidelines provide the following criteria * The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following * Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1 Grey is not the problem. Low contrast is the problem.
- jmclnx 7mo agoYes, I wish sites that use grey text should be investigated as part of the US disability act. People with even minor sight issues can have a hard time with sites designed that way. When I run across a site like that I usually try it in lynx, if the site does not work in lynx, I block it on my system so I would not waste my time with it.
- xnx 7mo agoBlack text on a gray background is how the web was intended to be experienced.
- wombatpm 7mo agoThe number of PowerPoint and slide presentations I sat through with sans serif white and yellow text on a dark purple background still gives me nightmares. For my presentation I went black over medium-light grey. The audience sighed with relief.
- moron4hire 7mo agoBlue hyperlinks. Purple hyperlinks after you had clicked them. Images with the blue hyperlink border. Tables with Extra Chonky borders. Row and Col span. Guestbooks.
- jasomill 7mo agoDon't forget page view counters, web rings, "Under Construction", and "Best Viewed with Internet Explorer".
- kristopolous 7mo agoWhat? No it wasn't. First browser https://www.w3.org/MarkUp/tims_editor https://www.w3.org/MarkUp/tims_editor
- hulitu 7mo agoOh, no. It had a visible scrollbar. And clearly delimited UI elements. And everything square. And readable text. How primitive. /s
- kristopolous 7mo agoI'd be so down for a black and white modern interface like this. I know the attempts ... they aren't like this. (I've got a next)
- signorovitch 7mo agoI’m looking at gray text on an off-white background right now :P
- duskdozer 7mo agoWell, as long as you're not going to decide to make the dark background lighter to accommodate the brighter text... But I would be in favor of sites using variables more so that personal customization is easier. But often this goes against their desire for "branding".
- ccleve 7mo agoFor an opposing view, https://ianstormtaylor.com/design-tip-never-use-black/ https://ianstormtaylor.com/design-tip-never-use-black/
- chihuahua 7mo agoBut the author of that page is not concerned with readability or accessibility. He just wants things to look cool and design-y. One piece of supporting evidence he cites is some random photo he took that doesn't contain #000000 black. That doesn't mean anything, it could be that it's over-exposed, or has poor contrast, or had some silly filter applied. This leads me to think that the author of that page doesn't know what he's talking about.
- russelldjimmy 7mo agoAdditions without any evidence: > He just wants things to look cool and design-y > some random photo > That doesn't mean anything This leads me to believe the author of this post doesn’t know what they’re talking about
- 112233 7mo agoSo you routinely encounter photographs that have noticable areas where sensor did not receive any light during exposure? To the point where you feel not having completely unlit parts of a photo is a sign of over-exposure or filters? Are you an astrophotographer?
- cratermoon 7mo ago16161d text on a background of fafafc is an 18:1 ratio, sufficient to meet WCAG AA criteria
- kristopolous 7mo agoRight but the medium of a canvas isn't the same as an electronic screen. What if you empower the user to control their device and use reasonable baselines that maximize legibility
- neya 7mo ago
- ChrisArchitect 7mo agoA related piece from 2022 that gets a bit more into the why, readability and Accessibility Guidelines evolution etc. Please Stop Using Grey Text (2022) https://tangledweb.xyz/please-stop-using-grey-text-3d3e71acfca8 https://tangledweb.xyz/please-stop-using-grey-text-3d3e71acf... (https://archive.is/QictZ https://archive.is/QictZ) [https://news.ycombinator.com/item?id=31420938 https://news.ycombinator.com/item?id=31420938]
- msla 7mo agoWhile we're wishing, let's bring back serifs. I, for one, would like to be able to tell the difference between AI and Al without context clues, and using an inherently lossy font is the opposite of "readability".
- nikau 7mo agoFound secretary of education Linda McMahons account
- AndrewStephens 7mo agoYou are not alone. I got criticism on my blog for using a serif font but those people are just … wrong. Serif fonts are just better for reading at all font sizes.
- efilife 7mo agoI wouldn't say they are wrong but complaining about a serif point seems very weird to me. Aren't there better things to complain about?
- bee_rider 7mo agoThis Al fellow seems to have gotten up to all sorts of trouble! Probably because he keeps hallucinating.
- carcabob 7mo agoFor a while I'd see "Weird Al" in random headlines or something and my brain would read it as "Weird A.I." and I kept getting very confused.
- carcabob 7mo agoAgreed. I'm very glad Hacker News uses a typeface with serifs on 'I's, 'l's, and '1's. "Sans serif" can be descriptive, rather than prescriptive.
- GoblinSlayer 7mo ago
- manbash 7mo agoI was reviewing a confluence page which was reviewed my many stakeholders. Something bugged me to an excruciating extent about the content of the page: something was off at some parts of the text. I inspected the page and it turns out the font color somehow changed to a mildly grayer color than black. This was likely due to a copy-and-paste that has gone wrong.
- carcabob 7mo agoThis problem has been haunting me for years, except in Google Docs. At some point, some template my team used had slightly gray text, and I STILL find it cropping up in our most recent documents.
- deleted 7mo ago[deleted]
- lelandbatey 7mo agoThis takes me back to "contrast rebellion" back in 2011: https://contrastrebellion.com/ https://contrastrebellion.com/
- spiderfarmer 7mo agoIncrease Your Font Size First (2026)
- washbasin 7mo agoI created a ycombinator account after years of resisting, just to respond to this post. Stop creating web pages with huge-ass gutters/margins. If you are concerned about design you would realize your page looks ridiculous and borderline illegible on modern screens (that are not phones). Text color is an issue, but layout is worse.
- cyberax 7mo agoAh, thank you. The next version of the page will include a YUUUGE sitemap on the left and the table of contents on the right. We'll also add a wonderful floating text input box to let you chat with our helpful AI assistant.
- npilk 7mo agoThis doesn't seem too far off from ~80 characters per line, which I believe is best practice for readability. Though you could make the column wider and bump up the font size and it would be even more readable.
- sherry-sherry 7mo agoHave you ever seen a book? They have huge gutters and margins, and not-quite-black text on creme/off-white/never-actually-white backgrounds... why? Because it's easier of the eyes for long blocks of text.
- washbasin 7mo agoThis page isn't a long block of text. Look at what Reader View does to pages. It doesn't ADD gutters and margins, it shrinks them.
- jasomill 7mo agoDepends on the width of the browser window. Wide margins that are welcome in a full-page browser on a large or ultrawide display are cancer when I'm tiling windows 2 or 3 up on a smaller or narrower display.
- akrakesh 7mo agoThe article could have been more useful if its point was just 'use sufficient contrast'. As it is, the article is overly prescriptive, and feels like trying too hard to be sensational or cute.
- designerarvid 7mo agoMaybe the author is not that informed? Maximum readability for humans is black text on light grey. Contrast is not the only thing that matters.
- themafia 7mo ago> I actually believe increasing contrast for everyone improves the information density of our content. You used css to change the pointer. So instead of the I-Beam I had to use a regular pointer to select that text. Information density is nice but information access shouldn't be compromised either. Aside from that, while this is true, I'd think you'd then want something better for your users than "font-family: system-ui".
- bee_rider 7mo agoEveryone should just use something like DarkReader to make these problems go away. Web devs who fiddle with the colors are annoying, but at least they are easy to ignore.
- designerarvid 7mo agoStupid rule. In that case, why ever change a color? Just stick to ensuring WCAG 2 AA rating. If your awesome design isn’t AA there better be a good reason. If it is, everything’s fine.
- anilakar 7mo agoYour design will be looked at in direct sunlight on a six inch, non-color-calibrated screen. Stop using low contrast and extralight fonts. Next time we'll ship your Mac. No, we won't give you a new one.
- shevy-java 7mo agoThis is why I still use the marquee tag. It catches people's attention right away! Much more so than grey text on grey background could. I do use pink for it though, usually pink on red or yellow background. It makes people feel more engaged and they write all sorts of happy emails about how epic blinking pink on rainbow ponicorn background wallpapers are. The 90s were a great time for the global internets ...
- 8bitsrule 7mo agoBack in the day, for people who spent many hours each day in front of a 'display': 1. People using TTY's used black ink on very-light-yellow roll paper, or 2. Those lucky enough to have ADM-3 VDT's often chose light green or light orange on black. Just sayin. e.g. https://en.wikipedia.org/wiki/VT220#/media/File:DEC_VT220_terminal.jpg https://en.wikipedia.org/wiki/VT220#/media/File:DEC_VT220_te...
- sherry-sherry 7mo agoNo. There's pretty much nothing in the natural world that has the contrast ratio a modern screen can produce. It is easier on the eyes to not have blindingly high contrast. No printed page in any book or magazine you've seen has ever had contrast ratio a screen can show. It's just not possible to do. Legibility can be an issue, and is good to discuss. I agree that when something like "@media (prefers-contrast: more)" is set, text should be at a higher contrast level for those with lower vision. But don't blind everyone else in the process. >... the amount of times per day I ask myself if I’m literally going blind, only to find out the “designer” decided for me how I should best read their website. Yes? That's what the designers of literally everything do, decide how it will be presented to you. The magic part of HTML/CSS is you can change that to suit your needs.
- hulitu 7mo ago> There's pretty much nothing in the natural world that has the contrast ratio a modern screen can produce. The natural world has much better contrast than the majority of screens. Not everyone has or affords a Mac Retina display. The main issue is, that, since some 10 years, UX experts appeared who pushed away configurability in favor of gray on gray ( remember when you were able to select the background and foreground color ?). The majority of screens have crappy contrasts (100:1).
- sherry-sherry 7mo agoPaper and ink have at best, a ~15:1 contrast ratio (bleached white paper and black ink). > The majority of screens have crappy contrasts (100:1). No idea where you're pulling this from. A MacBook Air display from 2010, a very average non-retina screen, has about 300:1. A modern MBA is over 1000:1 real-world contrast performance. A very average quality budget TN display from 2010s is 500:1. I could not find a phone or desktop display at my local retailer with stated a contrast ratio lower than 1200:1 (stated vs real world will of course be different, but not hugely). I agree apps/websites should take into account user preferences (with things like 'prefers-contrast' in CSS). I saw a great example recently where a website had a light/dark/hi-contrast toggle... but on first visit it defaulted to the one based on current system light/dark mode and 'prefers-contrast' indicators. We can have both text that's easier for most people eyes and higher contrast and/or larger text for those who need it.
- efilife 7mo agoI thought that the grey /* comment */ block was a demonstration of what not to do. Then I realized it's just a part of the page
- deafpolygon 7mo agoFunny how he says not to use that grey text, yet uses a similar shade for the word “LIKE?” at the bottom.
- benterix 7mo agoThis ship has sailed a long time ago. The idea of "low contrast is good for the eyes" was popularized among designers well over a decade ago, together with another one that tiny fonts are elegant (I read HN at 120% and I don't wear glasses).