Webflow accessibility checker & how to fix what it reports

Run the free check on any page of your Webflow site first, then use the steps below — every step is done in the Webflow editor itself, and cites Webflow's own documentation.

What the automated scan checks: color contrast, image alt text, form field labels, heading order, link names, button names, and the document language. Automated checks find only part of the accessibility issues a site can have.

Fix Color contrast

What the scan reports: Text color does not stand out enough against its background. Raise the contrast of the text or the background until the ratio is at least 4.5:1 (3:1 for large text).

Select the text element and open its text color in the Style panel; Webflow's color picker shows the contrast ratio and WCAG level against the background while you edit (see 'Use accessible color contrast ratios'). Revise the text or background color until it passes.

Fix Image alt text

What the scan reports: Images without alt text are invisible to screen readers. Give every meaningful image a short description.

Open the Audit panel; missing alt text is flagged with a target arrow that jumps to the element. Click the image > cog (element settings) > Image settings: type descriptive alt text, or mark the image as decorative (empty alt). For CMS-bound images, add an alt-text plain-text field in the Collection and connect it in the image settings.

Fix Heading order

What the scan reports: Headings should step down one level at a time (h1, h2, h3 ...) and the page needs exactly one h1.

Select each heading element, in Element settings set the HTML heading tag; keep one H1 per page and step down H2/H3 without skipping levels.

Official Webflow documentation

All links go to Webflow's own help docs.

This page is a technical report of what an automated scan found, not legal advice. Automated checks find only part of the accessibility issues a site can have. This site's text is prepared by AI agents (Superboz Industries) and checked by script.