By platform · Framer
In Framer, the Canvas Will Not Tell You What Is Wrong
A design tool that publishes real websites, which puts the accessibility of the result on whoever moved the layers. Framer says as much itself, and it ships more controls for it than most people know about.
Last reviewed August 30, 2026
For designers and studios shipping client sites from Framer rather than handing off to a developer.
Framer collapsed the gap between designing a site and publishing one. That is genuinely useful, and it moves the whole accessibility question onto the person at the canvas. Framer puts it the same way, saying that it automates some of this and the real impact lies in how you assign meaning to the elements.
The tool is also better than its reputation. It assigns semantic tags to defined text styles, exposes alt text, offers a custom tab order, ARIA labels, control over which layers receive pointer events, a contrast readout and a reduced-motion setting. What none of that can do is notice that the thing you styled to look like a heading was never marked as one.
What breaks on Framer
The failures we find most often on this platform, and the rule each one breaks.
Text styled as a heading without the tag
Framer assigns semantic tags automatically to text styles you have defined. Ad hoc text you made large and bold directly on the canvas is a paragraph, and the tag is a separate setting. A page built that way gives a screen reader user no outline to move through, and heading navigation is how most of them read.
1.3.1 Info and Relationships
Scroll and appear animations nobody tested with motion off
Framer has a setting that disables parallax, transform and layout animations for people who ask their system for reduced motion, so the path exists. Turning it on is the easy part. The hard part is that a page built around large parallax and scale effects often stops making sense once they stop, and those effects cause nausea for people with vestibular disorders. Note the neighboring rule while you are here. Motion the visitor triggers by scrolling is one criterion. A hero video that autoplays by itself is a different one, and that one is Level A.
2.3.3 Animation from Interactions
Frames used as buttons
A clickable frame is a div with a handler on it. It is not reachable by keyboard and it announces nothing about what it does, so for anyone not using a mouse the button simply is not there.
4.1.2 Name, Role, Value
Focus states left at the default
Framer's visual states cover hover and pressed, which are the two a designer thinks about while designing. Focus is easy to skip entirely, and a design with no focus style ships without one.
2.4.7 Focus Visible
CMS collection images with an unmapped alt field
If the alt property was never bound to a field, every item in the collection publishes with no alternative text at all, and the canvas gives you no hint of it. Check a published collection page rather than trusting the binding.
1.1.1 Non-text Content
Low-contrast text over imagery and gradients
The canvas makes light text on a photograph look right at full size. Measured against the busiest and palest part of the image it usually is not. One exemption is worth knowing so you do not waste time on it. Text that is part of a logo or a brand name has no contrast requirement, so measure everything on the hero except the wordmark.
1.4.3 Contrast (Minimum)
The plugin question, answered
Framer has a plugin API and there are contrast-checking plugins in it. There is no plugin that fixes structure, because structure is a decision you make while building rather than a layer you add afterwards.
The tools that matter here are Framer's own, and most of them sit in the accessibility panel where a designer working to a deadline never looks.
Framer's accessibility panel
Per-element controls for semantic tags, alt text, keyboard tab order, ARIA labels and pointer events.
- What it does
- Custom tab order is the direct fix when the visual order and the source order disagree, and Framer's own description of what good tab order feels like is the best short explanation going. A page should flow like reading a book. Pointer event control is the direct fix for a decorative frame sitting on top of a button and swallowing the click, which is a canvas failure almost nobody looks for.
- What it cannot
- It is a set of controls, so it does exactly what you tell it and nothing you do not. Nothing in the panel notices that a heading is missing its tag, or that the alt text you wrote describes the wrong thing.
Contrast-checking plugins
Canvas plugins that measure foreground against background on the layer you have selected.
- What it does
- Catching a contrast problem while the layer is still selected is far cheaper than catching it after publishing, and cheaper still than catching it in an audit.
- What it cannot
- They measure a flat pair of colors. Text over a photograph or a gradient needs measuring against the worst region of the image, which none of them does for you.
Framer's built-in components
The stock navigation, accordion and form components.
- What it does
- They handle keyboard behavior and state better than anything you would assemble from frames, so prefer them wherever one exists for what you need.
- What it cannot
- They do not stop you rebuilding the same pattern from frames on the next section, which is where the failures come from. Consistency is a discipline the tool will not enforce.
Overlay widgets (accessiBe, UserWay, AudioEye and the rest)
A script you paste into your template that draws a toolbar for visitors and claims to repair your pages automatically as they load.
- What it does
- The toolbar half is real. Bigger text, higher contrast, adjusted spacing and a reading guide are preferences some visitors use, and the field's own reference document on overlays says a non-trivial array of accessibility problems can genuinely be repaired this way.
- What it cannot
- It does not change the markup your server sends, and the categories it handles worst are the ones that decide whether a site works at all. Text alternatives, form labels and error handling, and keyboard access. More than 5,000 US digital accessibility lawsuits were filed in 2025, and the firm that compiles that dataset reads the filings the same way every year, which is that widgets do not materially reduce legal risk. Our overlays page has the documented record.
What to actually do
- Go through every text layer and set the correct tag. This is the single highest-value pass in Framer and it is an hour on most sites.
- Publish, then tab the live site. The canvas cannot show you focus order, so this has to happen on the published page.
- Add a focus style to every interactive component, not just a hover state.
- Turn reduced motion on in your operating system, reload, and see what still moves and whether the page still makes sense.
- Bind alt text on every CMS image field, then open a published collection page to check it actually arrived.
- Measure contrast on the published page over the real background image, sampling the palest region, rather than on the canvas swatch.
On themes and templates
Framer templates are sold on visual impact, and the animation-heavy ones are the hardest to make work for everybody. If a template's whole selling point is its scroll effects, budget time for a reduced-motion version before you buy it, because turning the animation off is not the same as the page still making sense without it. There is no published accessibility bar a Framer template has to clear, so the demo is the only evidence you have.
One honest limit
Framer publishes what you build. There is no theme layer to blame, no plugin that retrofits structure, and nobody upstream to report a bug to. Every fix on this page is editorial work inside the tool, done by the person who made the design. Which is either the best or the worst news, depending on who that is.
Keep reading
Other platforms
Framer
We test all 55 WCAG 2.2 A and AA rules on your Framer site, with an expert review and a real blind screen-reader user on your key journeys. Every finding screenshotted and mapped to its fix. $499, report in 5 business days.