Quick answer
Red-green colour blindness affects up to 1 in 12 men and 1 in 200 women, so never let colour alone carry meaning in a screenshot. Add a shape, a label or a position, and check the set in greyscale.
The short answer
> Quick answer: Never let colour be the only thing carrying a message. Add a shape, a word or a position alongside it, and your screenshots work for everybody.
That's the entire principle. It isn't a redesign, it's a second signal.
And it's worth doing because the audience is much larger than most people assume.
That's the entire principle. It isn't a redesign, it's a second signal.
And it's worth doing because the audience is much larger than most people assume.
How many people we're talking about
Red-green colour blindness affects up to 1 in 12 males, which is 8 percent, and 1 in 200 females, which is 0.5 percent.
Among people of Northern European ancestry the figures run to as many as 8 percent of men and 0.4 percent of women.
Deuteranomaly is the single most common form, at about 5 percent of males, with protanomaly next at 1.3 percent.
Blue-yellow colour blindness exists but it's much rarer, so red and green is where your effort goes.
Those figures come from the reference article on colour blindness, not from a design blog's rounding of them.
Among people of Northern European ancestry the figures run to as many as 8 percent of men and 0.4 percent of women.
Deuteranomaly is the single most common form, at about 5 percent of males, with protanomaly next at 1.3 percent.
Blue-yellow colour blindness exists but it's much rarer, so red and green is where your effort goes.
Those figures come from the reference article on colour blindness, not from a design blog's rounding of them.
What that means for a store listing
Do the arithmetic on your own traffic and it stops being abstract.
If your app skews male, and plenty do, then roughly one in every twelve people looking at your screenshots isn't seeing the colour distinction you built the design around.
They don't know they're missing it. There's no error state.
They just find the screenshot slightly harder to read than the app next to yours, and they scroll.
That's a conversion cost you'll never see in any dashboard.
If your app skews male, and plenty do, then roughly one in every twelve people looking at your screenshots isn't seeing the colour distinction you built the design around.
They don't know they're missing it. There's no error state.
They just find the screenshot slightly harder to read than the app next to yours, and they scroll.
That's a conversion cost you'll never see in any dashboard.
The one rule that fixes most of it
It's a formal accessibility criterion and it's very short.
Use of Color says colour must not be the only visual means of conveying information, indicating an action, or distinguishing an element.
In screenshot terms: if you'd have to say "the green one" to explain your image, it fails.
Add a tick, a label, an arrow or a position, and it passes.
That's the whole standard and you can apply it in ten minutes.
Use of Color says colour must not be the only visual means of conveying information, indicating an action, or distinguishing an element.
In screenshot terms: if you'd have to say "the green one" to explain your image, it fails.
Add a tick, a label, an arrow or a position, and it passes.
That's the whole standard and you can apply it in ten minutes.
The classic failure, and it's everywhere
Red for bad, green for good.
It's in charts, status dots, error states, progress bars, budget apps, fitness apps and every dashboard ever built.
To a deuteranomalous viewer those two can sit very close together, so a screenshot showing "you're over budget in red" says nothing at all.
The fix isn't dropping red and green. It's adding an arrow, a plus and minus, or a word.
Keep the colour. Just don't make it the messenger.
It's in charts, status dots, error states, progress bars, budget apps, fitness apps and every dashboard ever built.
To a deuteranomalous viewer those two can sit very close together, so a screenshot showing "you're over budget in red" says nothing at all.
The fix isn't dropping red and green. It's adding an arrow, a plus and minus, or a word.
Keep the colour. Just don't make it the messenger.
Charts are the worst offender
If your app has a chart, this section is your whole job.
A multi line chart with a colour key is unreadable to a chunk of your audience, and charts show up in store screenshots constantly because they look impressive.
Label the lines directly on the chart rather than in a key at the side.
Direct labels are better for everybody. They remove a lookup step even for people who see every colour.
I counted this as the change with the best return on any screenshot with data in it.
A multi line chart with a colour key is unreadable to a chunk of your audience, and charts show up in store screenshots constantly because they look impressive.
Label the lines directly on the chart rather than in a key at the side.
Direct labels are better for everybody. They remove a lookup step even for people who see every colour.
I counted this as the change with the best return on any screenshot with data in it.
The greyscale test
The fastest check there is, and it needs nothing installed.
Convert your finished screenshot set to greyscale and look at it.
Anything that becomes ambiguous was relying on hue. Anything that still reads is safe.
It's not a perfect simulation, because colour blindness isn't greyscale vision. But it catches almost every real problem in about thirty seconds.
Do it on the whole set at once, not one image at a time, because consistency across the set is part of what's being tested.
Convert your finished screenshot set to greyscale and look at it.
Anything that becomes ambiguous was relying on hue. Anything that still reads is safe.
It's not a perfect simulation, because colour blindness isn't greyscale vision. But it catches almost every real problem in about thirty seconds.
Do it on the whole set at once, not one image at a time, because consistency across the set is part of what's being tested.
Simulators are worth one pass
After greyscale, run one proper simulation.
Most design tools have a colour vision filter built in now, and they'll show you deuteranopia and protanopia versions of your canvas.
Check those two and skip the rest. They cover the overwhelming majority of cases.
What you're looking for isn't ugliness. It's ambiguity, where two things you meant to separate have merged.
One pass at the end of the design is enough. This isn't something to check constantly.
Most design tools have a colour vision filter built in now, and they'll show you deuteranopia and protanopia versions of your canvas.
Check those two and skip the rest. They cover the overwhelming majority of cases.
What you're looking for isn't ugliness. It's ambiguity, where two things you meant to separate have merged.
One pass at the end of the design is enough. This isn't something to check constantly.
Brand colours are usually fine
A relief for anybody worried this means changing their palette.
Your brand colour appearing differently to some viewers doesn't matter. It's decoration, not information.
The problem is only ever colour that means something. Status, category, difference, correctness.
So you almost never need to change a palette. You need to add a label next to the three places the palette is doing a job.
That's a much smaller task than people expect when they start.
Your brand colour appearing differently to some viewers doesn't matter. It's decoration, not information.
The problem is only ever colour that means something. Status, category, difference, correctness.
So you almost never need to change a palette. You need to add a label next to the three places the palette is doing a job.
That's a much smaller task than people expect when they start.
When the app itself is the problem
Sometimes the screenshot isn't fixable, because the interface behind it isn't.
If your app uses colour alone for status inside the product, then an honest screenshot of it inherits that problem, and dressing the picture up hides a real defect.
That's a moment worth passing back to whoever owns the interface, rather than solving in the marketing layer.
You can still add an annotation over the top for the store image, and you should.
But note it, because the same one in twelve readers who struggle with the screenshot will struggle with the app after they install it, and that shows up as a refund rather than a lost tap.
If your app uses colour alone for status inside the product, then an honest screenshot of it inherits that problem, and dressing the picture up hides a real defect.
That's a moment worth passing back to whoever owns the interface, rather than solving in the marketing layer.
You can still add an annotation over the top for the store image, and you should.
But note it, because the same one in twelve readers who struggle with the screenshot will struggle with the app after they install it, and that shows up as a refund rather than a lost tap.
Contrast is the bigger win anyway
Worth putting in proportion.
Low contrast affects far more people than colour blindness does, including everybody reading your screenshot outdoors on a bright day.
So if you only fix one thing, fix contrast. It helps the colour blind reader too, because lightness difference survives every kind of colour vision.
Two colours with the same lightness are the dangerous pair, whatever their hues.
Our caption text size post covers the ratios to hold.
Low contrast affects far more people than colour blindness does, including everybody reading your screenshot outdoors on a bright day.
So if you only fix one thing, fix contrast. It helps the colour blind reader too, because lightness difference survives every kind of colour vision.
Two colours with the same lightness are the dangerous pair, whatever their hues.
Our caption text size post covers the ratios to hold.
Don't add an accessibility badge to your screenshots
A tempting move and usually a bad one.
Putting an accessibility icon on a store screenshot spends a slot on a claim rather than on showing your app.
It also invites scrutiny you may not survive, because a badge implies the app itself is accessible, not just the picture of it.
If your app genuinely does the work, say it in the description where you have room to be specific.
The screenshots should just quietly work.
Putting an accessibility icon on a store screenshot spends a slot on a claim rather than on showing your app.
It also invites scrutiny you may not survive, because a badge implies the app itself is accessible, not just the picture of it.
If your app genuinely does the work, say it in the description where you have room to be specific.
The screenshots should just quietly work.
It helps your video too
The same rule applies to an app preview and it's easier to break there.
Video moves, so a viewer can't stop and study an ambiguous frame.
If your preview highlights something by turning it green for half a second, a chunk of viewers see nothing happen.
Add motion, a shape or a size change alongside the colour and it reads for everybody.
Our app preview specs post covers the rest of what that asset needs.
Video moves, so a viewer can't stop and study an ambiguous frame.
If your preview highlights something by turning it green for half a second, a chunk of viewers see nothing happen.
Add motion, a shape or a size change alongside the colour and it reads for everybody.
Our app preview specs post covers the rest of what that asset needs.
What this costs you
Honestly, almost nothing, which is why it's worth doing.
You're adding a label, an icon or a direct chart annotation in about three places per screenshot set.
None of it makes the design worse. Direct labels and explicit icons are clearer for everyone, not a compromise for a minority.
The only real cost is the ten minutes of testing at the end.
I ran the greyscale pass on a full set while writing this and it took under five.
You're adding a label, an icon or a direct chart annotation in about three places per screenshot set.
None of it makes the design worse. Direct labels and explicit icons are clearer for everyone, not a compromise for a minority.
The only real cost is the ten minutes of testing at the end.
I ran the greyscale pass on a full set while writing this and it took under five.
A checklist you can run today
Four steps, in order, on your existing screenshots.
One: find every place colour means something. Status, category, good, bad.
Two: add a second signal to each. A word, a shape, an arrow, a position.
Three: convert the set to greyscale and look for anything that merged.
Four: run one deuteranopia simulation as a final check. You can rebuild and re-export the set on the create page once you know what needs the extra label.
That's it. It's an afternoon once, and then it's just how you build them.
One: find every place colour means something. Status, category, good, bad.
Two: add a second signal to each. A word, a shape, an arrow, a position.
Three: convert the set to greyscale and look for anything that merged.
Four: run one deuteranopia simulation as a final check. You can rebuild and re-export the set on the create page once you know what needs the extra label.
That's it. It's an afternoon once, and then it's just how you build them.
The short version
Up to 1 in 12 men can't separate red from green reliably.
They're looking at your store listing right now and they aren't going to tell you.
So don't make colour the only messenger. Add a shape or a word beside it.
Test in greyscale, then run one simulation.
None of it changes how your screenshots look to everyone else, which is the best kind of fix there is.
They're looking at your store listing right now and they aren't going to tell you.
So don't make colour the only messenger. Add a shape or a word beside it.
Test in greyscale, then run one simulation.
None of it changes how your screenshots look to everyone else, which is the best kind of fix there is.
Frequently asked questions
How many people are colour blind?
Red-green colour blindness affects up to 1 in 12 males, about 8 percent, and 1 in 200 females, about 0.5 percent. Deuteranomaly is the most common single form at roughly 5 percent of males. Blue-yellow colour blindness exists but is much rarer.
What is the main rule for colour blind accessible screenshots?
Never let colour be the only thing carrying meaning. If explaining your screenshot requires you to say "the green one", it fails. Add a shape, a label, an arrow or a position alongside the colour and it works for everybody.
How do I test my screenshots for colour blindness?
Convert the whole set to greyscale and look at it. If two things that were meant to be different are now the same shade, colour was doing work that nothing else was doing. It's the fastest single test and it needs no plugin.
Do red and green really cause the most problems?
Yes, because red-green is by far the most common type. A red error state next to a green success state is the classic failure, and it appears in a huge number of app interfaces, so it lands in a huge number of store screenshots.
Does this affect my caption text too?
It can, if the caption is coloured to match something in the image. Contrast is a separate issue from hue and matters more. Our [screenshot design mistakes post](/blog/app-screenshot-design-mistakes-fix-fast-2026) covers the contrast failures that turn up most often.
Build the mockup in your browser.
Drop a screenshot into a real device frame and export at the exact store size — free, no signup.