Accessible App Store screenshots: contrast, text size
App Store screenshots aren't browsable with a screen reader the same way a web page is — Apple doesn't expose screenshot alt text to the user directly. But the visual accessibility rules (contrast, text size, color independence) absolutely apply, and they happen to be the same rules that govern thumbnail-size readability. Worth doing both because they're the same work.
Contrast: WCAG AA as a baseline
WCAG AA contrast ratios:
- Normal text: 4.5:1 minimum against background.
- Large text (24pt+ regular or 18pt+ bold): 3:1 minimum.
- Graphical elements / UI controls: 3:1.
Use a contrast checker — there are many free ones — on every caption against the panel background it sits on. If your background is a gradient, check against the darkest and lightest points of the gradient where the caption sits.
Common failure: white text over a light-orange-to-dark-orange gradient. Where the caption sits on the light orange, contrast drops below 4.5:1 and the text disappears at thumbnail size.
Text size at thumbnail
App Store screenshots render at multiple sizes:
- Full size on the product page (~1290 px wide).
- Search-result preview (~600 px wide).
- Search-result thumbnail (~300 px wide).
If your caption is 60px in the design file at 1290 × 2796, it renders at ~14px in a 300px search thumbnail. 14px is below recommended minimum size for legibility. The fix: design captions at 80-100px so they render at 18-22px in thumbnails. Specifically for panels 1-3 which are what shows in search.
Color independence
Don't rely on color alone to communicate information. The most common violation: caption text in a color that's distinguishable from the background only by hue (red text on green background, for example). Anyone with red-green color blindness sees mud.
Test: if you grayscale your screenshot, can you still read every caption? If yes, you're color- independent. If no, increase the luminance (lightness) difference, not just the hue difference.
Alt text in App Store Connect
App Store Connect doesn't expose screenshot alt text in the same way a web page exposes
alt attributes. But App Store Connect does have an "accessibility tags" field
per screenshot that's used by VoiceOver users browsing the App Store. Fill it in. Short
description of what the screenshot shows: "Home screen with monthly spending overview" rather
than "Screenshot 1".
This is the single biggest accessibility win because almost no developers do it. VoiceOver users browsing the App Store currently hear "screenshot 1, screenshot 2" for the vast majority of apps. A few sentences of description per panel makes your listing dramatically more usable for that audience.
The "small font, decorative type" anti-pattern
Decorative fonts (handwriting scripts, ultra-thin display fonts) almost always fail accessibility and thumbnail tests at once. The thin strokes that look elegant at full size become illegible at 300px and unreadable to users with low vision.
Use these decorative styles for one accent word per carousel at most. Body captions and any important text need a font with consistent stroke weight at the sizes you care about — most modern grotesque sans-serifs (Inter, SF Pro, Roboto) work.
Caption position and safe areas
Apple sometimes overlays UI on top of the App Store carousel (the "Get" button, age rating chip, "Open" button after install). If your caption sits in those areas, it gets occluded. Keep captions in the safe zone: 60px from each side, 80px from the top, 200px clear at the bottom for App Store UI.
What to test before shipping
- Run every caption through a contrast checker against its panel background.
- View your screenshots at 300px width in a thumbnail simulator (or just resize in Figma). Every caption should still be readable.
- Grayscale-test for color independence.
- Write accessibility tags for each panel in App Store Connect.
- If you have a VoiceOver user in your testing pool, ask them to browse your listing and report.
Why this matters beyond accessibility
The contrast and size rules WCAG codifies are derived from human vision research. They aren't arbitrary — they're the thresholds below which a meaningful percentage of users can't read text comfortably. Designing for AA means designing for the population that includes older users, users on bright outdoor screens, users with mild uncorrected vision issues, plus everyone scrolling fast through search.
The same rules that help users with low vision read your screenshot also help users scrolling the App Store on a sunny train. Same problem; same fix.