WCAG 1.4.9: Images of Text (No Exception)
When text is baked into an image, users lose every control they have over how text looks — size, font, spacing, colors, contrast. This Level AAA criterion draws the hardest line WCAG has on the subject: use images of text only for pure decoration or where that exact visual presentation is essential. Everything else must be real, live, restylable text.
The success criterion, in full
Images of text are only used for pure decoration or where a particular presentation of text is essential to the information being conveyed.
Note: Logotypes (text that is part of a logo or brand name) are considered essential.
Despite the “No Exception” in the name, two narrow allowances remain: decorative images of text, and presentations that are truly essential. What disappears at AAA — compared to 1.4.5 Images of Text at AA — is the general permission to use images of text when they are user-customizable.
Who this helps and why
Real text is infinitely adaptable: a browser can enlarge it, reflow it, swap its font, recolor it, add letter spacing, or hand it to a screen reader or translator. An image of text is a photograph of words — every one of those adaptations is impossible, and zooming just produces bigger, blurrier pixels.
People with low vision
Need to enlarge text far beyond 200%, change foreground/background colors, or apply high-contrast themes. Image text ignores all of it and degrades into blur when magnified.
People with dyslexia and reading disabilities
Often rely on specific fonts, wider letter and line spacing, and tinted backgrounds to read comfortably — adjustments covered by 1.4.12 Text Spacing that only work on real text.
Screen reader and braille users
Can only access the alt attribute of an image, which frequently drifts out of sync with the pixels. Real text is always exactly what it says.
Everyone else, too
Real text can be searched, selected, copied, translated, and rendered crisply on any screen density. Search engines index it; text in images is invisible to Find-in-page.
This criterion dates from an era when web typography was so limited that designers exported headlines as GIFs. With web fonts, variable fonts, and modern CSS, the visual argument for image text has essentially vanished — which makes this one of the easier AAA criteria to meet in a new build.
The requirement and its two allowances
An image of text is text that has been rendered in a non-text form — pixels in a PNG, JPEG, WebP, or a canvas — in order to achieve a particular visual effect. The rule is simple: if the words carry information, they must be real text. Only two situations are exempt:
- Pure decoration. Text that serves only an aesthetic purpose, provides no information, and has no function — letterforms scattered across a hero background as texture, for example. If nobody needs to read it, it may be an image (with empty
alt=""). - Essential presentation. The specific visual form of the text is the information: logotypes and brand names (explicitly named as essential), samples of typefaces on a font foundry site, a scan of a historical letter where the handwriting matters, or a screenshot showing what a UI actually looks like.
Note what is noton that list: “the designer preferred this font,” “the CMS made it easy,” and “the image is customizable” — that last one is the AA-level allowance in 1.4.5 that this criterion deliberately removes. Essential means the information would be lost or changed if the text were presented any other way, not that the presentation is preferred.
Pass and fail examples
✓ Passes 1.4.9
- A hero headline styled with a web font, CSS gradient fill, and text-shadow — visually rich, but real text underneath.
- The company logo as an SVG with stylized lettering, with an accessible name — logotypes are essential.
- A font foundry showing specimen images of its typefaces — the letterform rendering is the content.
- A screenshot of an app in a tutorial, with the key text repeated in the surrounding prose.
- Faded dictionary-page letterforms used as a purely decorative background texture with
alt="".
✗ Fails 1.4.9
- Section headings exported from a design tool as PNGs to preserve a brand font.
- A promotional banner with the offer text (“20% off until Friday”) baked into the image.
- A restaurant menu uploaded as a JPEG scan instead of marked-up text.
- Pull quotes rendered as images so they keep fancy quotation-mark styling.
- An image of text that users can customize (font/size picker regenerates the image) — passes 1.4.5 at AA, but still fails 1.4.9 at AAA.
Code: real text instead of images
Replace an image headline with styled text
Almost any “we needed the brand look” image can be reproduced with a web font and CSS — including gradient fills that once required Photoshop.
<!-- ✗ Text frozen into pixels -->
<img src="/img/headline-summer-sale.png" alt="Summer sale — up to 40% off" />
<!-- ✓ Real text with the same visual treatment -->
<h2 class="promo-headline">Summer sale — up to 40% off</h2>
<style>
@font-face {
font-family: "BrandDisplay";
src: url("/fonts/brand-display.woff2") format("woff2");
font-display: swap;
}
.promo-headline {
font-family: "BrandDisplay", system-ui, sans-serif;
font-size: clamp(2rem, 5vw, 3.5rem);
background: linear-gradient(90deg, #7c3aed, #db2777);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
text-shadow: none;
}
</style>Use SVG text for lockups that need precise shapes
When text must follow a path or sit inside artwork, SVG <text> keeps the characters real and readable by assistive technology while giving you full geometric control.
<!-- ✓ Selectable, scalable, announced by screen readers -->
<svg viewBox="0 0 600 120" role="img" aria-labelledby="badge-title">
<title id="badge-title">Certified accessible — 2026 audit</title>
<path id="arc" d="M 50 100 Q 300 20 550 100" fill="none" />
<text font-size="28" fill="currentColor">
<textPath href="#arc" startOffset="10%">
Certified accessible — 2026 audit
</textPath>
</text>
</svg>The two legitimate image cases, marked up correctly
<!-- ✓ Essential: a logotype (still needs a text alternative per 1.1.1) -->
<a href="/">
<img src="/img/acme-logo.svg" alt="Acme Corporation home" />
</a>
<!-- ✓ Pure decoration: letterforms as background texture -->
<img src="/img/type-texture.png" alt="" role="presentation" />Common failures
- Headings, navigation labels, or buttons exported as images to preserve a corporate typeface instead of loading it as a web font.
- Marketing banners and social cards reused on the page itself, with dates, prices, and offer terms readable only in the pixels.
- Menus, price lists, schedules, or infographics uploaded as scans or exported charts with no equivalent text version.
- Email-style HTML reused on the web, where entire paragraphs are sliced images — a legacy email technique that fails badly on the web.
- Text rendered into <canvas> without an accessible text equivalent, freezing it just as thoroughly as a PNG.
- Relying on the 1.4.5 'customizable' allowance — an image-of-text generator with font settings — which no longer counts at the AAA level.
- Stretching the 'essential' exception to cover brand preference: a tagline or campaign slogan is not a logotype just because it sits near the logo.
How to test for 1.4.9
- 1
Try to select the text with your cursor
Drag across every heading, banner, and label. Real text highlights character by character; an image selects as a single block. Anything you cannot select character-by-character is a candidate image of text.
- 2
Zoom to 400% and look for blur
Real text stays razor sharp at any zoom level. Raster image text softens and pixelates. This catches image text that visually blends in at 100%.
- 3
Disable images and see what disappears
Turn images off in the browser (or block them in DevTools). Every piece of information that vanishes — rather than being replaced by equivalent text — was living in an image.
- 4
Audit each remaining image against the two allowances
For every image containing words, ask: is it purely decorative (conveys nothing), or is this exact presentation essential (logotype, type specimen, historically significant rendering, UI screenshot)? If neither, it fails 1.4.9 — even if a customization mechanism exists.
- 5
Check the survivors for text alternatives
Legitimate essential images of text still need a correct alt under 1.1.1, and decorative ones need alt="". While you are there, confirm contrast of any essential image text against 1.4.3.
Automated scanners cannot reliably tell whether an image contains text, so this is a visual, manual check. Fold it into your full WCAG 2.2 checklist review.
Relationship to 1.4.5 and friends
1.4.9 is the AAA tightening of 1.4.5 Images of Text (AA). Both share the decoration and essential allowances; 1.4.5 additionally permits images of text that the user can customize to their own requirements, and — in practice — tolerates them wherever the visual presentation cannot be achieved with technology. 1.4.9 deletes that flexibility. A team already meeting AA gets to AAA here mostly by replacing legacy image headlines with web fonts.
Three neighbors complete the picture: 1.1.1 Non-text Content (A) requires the images of text you legitimately keep — logos, specimens — to carry a proper text alternative. 1.4.3 Contrast (Minimum) (AA) applies its contrast ratios to image text just as it does to real text. And 1.4.12 Text Spacing (AA) is a big part of the why: users must be able to override spacing without loss of content — an adaptation only real text can honor.
Frequently asked questions
What does WCAG 1.4.9 Images of Text (No Exception) require?
It requires that images of text are only used for pure decoration or where a particular presentation of text is essential to the information being conveyed. In every other case, the text must be actual text — characters rendered by the browser that users can restyle, resize, recolor, and have read aloud. It is a Level AAA success criterion under Guideline 1.4 Distinguishable, introduced in WCAG 2.0 and unchanged in WCAG 2.1 and 2.2.
How is 1.4.9 different from 1.4.5 Images of Text (Level AA)?
1.4.5 (AA) allows images of text in two situations: when the image is customizable to the user's requirements, or when the particular presentation is essential. 1.4.9 (AAA) removes the 'customizable' allowance entirely — the name 'No Exception' refers to removing that general-use allowance. At AAA only two narrow cases remain: pure decoration, and presentations that are essential, such as logotypes. If you meet 1.4.9 you automatically meet 1.4.5.
Are logos exempt from WCAG 1.4.9?
Yes. WCAG explicitly states that logotypes — text that is part of a logo or brand name — are considered essential, so a logo containing stylized text passes both 1.4.5 and 1.4.9. The exemption covers the logo itself, not everything near it: a tagline, navigation label, or heading rendered as an image next to the logo still fails. The logo image still needs a text alternative under 1.1.1 Non-text Content.
Why are images of text an accessibility problem at all?
Because pixels are frozen. Users with low vision cannot resize image text without blur, cannot change its font, color, letter spacing, or line height, and cannot apply a high-contrast theme to it. People with dyslexia often rely on custom fonts and spacing that images ignore. Screen readers cannot read the pixels — only the alt text, which can silently drift out of date. Text in images also breaks translation tools, text search, and copy-paste, and looks blurry on high-density screens.
Do screenshots and photos containing text fail 1.4.9?
Usually not. A screenshot in documentation shows what a user interface actually looks like — the particular presentation is the information, which makes it essential. A photo of a street scene that happens to include a shop sign is not being 'used to present text' at all. What fails is using an image as a substitute for content text: headings exported from a design tool, banners with promotional copy baked in, or menus rendered as images.
With web fonts and modern CSS, is there ever a reason to use images of text?
Almost never — and that is exactly why this AAA criterion is more achievable today than when it was written. Web fonts (@font-face, variable fonts), CSS text-shadow, gradients with background-clip: text, transforms, and SVG <text> elements can reproduce nearly any visual treatment while keeping the characters real, selectable, and restylable. The practical rule: if you can achieve the effect in CSS or SVG text, 1.4.9 says you must.
Related Success Criteria
Color is not used as the only visual means of conveying information.
Audio that plays automatically can be paused, stopped, or controlled.
Text has a contrast ratio of at least 4.5:1 (3:1 for large text).
Text can be resized up to 200% without loss of content or functionality.
Text is used instead of images of text, except for customizable or essential images.