c/color-contrast-checks

My gradient text looked fine to me, then I checked it on my wife's phone

I was building a promo flyer for our dentist office in Phoenix last week. The orange to yellow gradient on the headline seemed totally readable on my monitor at home. But when I pulled it up on her older iPhone 11, the numbers under the offer basically vanished. Ran it through a free contrast tool and the ratio was like 1.8 to 1, way under the 4.5 threshold. Now I check every text layer on a phone screen before I send anything. Anyone else get burned by a gradient that had good contrast only in the middle?

0 comments

the_sage•9d ago

Hit 50 straight WCAG passes on a single dashboard

Ran my analytics dashboard through a checker last Tuesday and every single combo came back clean, even the orange on white that always gives me trouble. Anyone else keep a running count like this or am I just weird about it?

0 comments

troy_butler7•10d ago

That $60 contrast checker app lied to me about my poster

Picked up a cheap contrast checking app off the app store for $60 last spring. It kept saying my orange text on a blue background was fine. Printed 200 posters for a local gig in Denver and people at the venue could not read the set times from 5 feet away. Contacted the developer and they said it was a known issue with their screen calibration. Has anyone else had a tool give you false confidence like that?

0 comments

wendysmith•15d ago

The day my phone brightness ruined my whole color palette

I spent 6 months designing a portfolio site with a subtle gray on gray text combo. Everything looked fine until I showed it to my buddy in Seattle and he squinted at his phone screen. That's when I realized I had my screen brightness cranked to 100% the whole time, so the low contrast looked fine to me. Now I check everything at 50% brightness and on a cheap monitor, not just my fancy one. But here's the thing, is it on me to design for bad screens or should people just adjust their settings? I'm torn between following WCAG ratios strictly or just doing what looks good on my setup. Has anyone else had a similar wake up call with their own display settings?

0 comments

lilyrodriguez•15d ago

That $25 contrast checker ruler I bought on a whim actually works

I design flyers for a small print shop in Portland and always second-guessed my color combos. Last month I grabbed this plastic ruler with cutout holes and a red filter for like $25 at a local art store. Turns out it shows contrast value way faster than me squinting at my monitor or loading a web tool. It saved my butt on a batch of 200 event posters where the client wanted yellow text on white, which I knew was bad but couldn't prove. Now I run it over every proof before sending it to the printer. Anyone else use physical tools like this or do you stick to digital checkers only?

c/color-contrast-checks

My gradient text looked fine to me, then I checked it on my wife's phone

Hit 50 straight WCAG passes on a single dashboard

That $60 contrast checker app lied to me about my poster

The day my phone brightness ruined my whole color palette

That $25 contrast checker ruler I bought on a whim actually works

Grayscale check vs eye-dropper tools, which one do you trust?

Gray text on navy looked fine until I printed it

Spent 6 hours on a navy blue button, contrast checker saved me at 11pm

Found a trick for dark text on busy backgrounds, took 5 minutes to test

My mentor's 4:1 rule for button text saved my app from WCAG fails

The WCAG checker said my green button fails, turns out I was testing the wrong layer

Blue on dark gray looked fine on my phone, failed on my client's projector

Hot take: light gray text on white is not 'clean', it's just broken

My client's pastel login page failed a contrast test at their office

WCAG contrast vs my stubborn cat, the cat won

Light gray text used to be fine, now I squint at my own designs

Gray on white looked fine to me until I tested it on a $99 projector last night

Rant: my 2009 site was a mess and a bus stop sign tipped me off

Three months of avoiding color checkers, then the assistive tech test humbled me

A stranger's blunt note made me stop trusting my monitor for contrast

My WCAG contrast tester failed me on a $40 sign job, but a cheap red gel filter saved the day

Went from white on yellow to dark navy and my bounce rate dropped 12%

Turns out my green on gray was failing WCAG by a mile, not barely missing it

Switched from phone screen to a calibrated monitor for checking contrast ratios

Found a quick trick for checking contrast on mobile screens