Overlays are a powerful way to check your website using various simulators (like color blindness or dyslexia) or to check your site for things like text contrast, layout issues and other accessibility concerns. There are over a dozen different simulators available to use.

You can find the overlays for each pane above the pane size, by clicking the three-layer icon. If an overlay is active for the current page, a blue dot will be displayed.

Do you have an idea for a useful overlay? Let us know.

Overview of all overlays

Polypane currently has 21 overlays. They are split into Debug tools and simulators. Below we list them all.

Debug tools

The debug tools give you insight into how your page is built.

Layout Debugging

Quickly find out if elements are where you expect them to be, or which element is causing a horizontal overflow.

Contrast checker

Polypane will go through all your text and backgorund combinations and calculate the contrast ratio. All correct ratios are mentioned once, whole the failing ones are all highlighted.

Edit content

Edit content makes the entire page editable so you can quickly try out new content and see how it looks.


A11y.css will highlight any accessibility mistakes and possible risks on your page.


Tota11y is an accessibility visualisation toolkit with many different features: list headings and links, check labels and simulate screen readers.

Show z-index

Show the z-indices of all visible elements, including if their ancestors have z-indices.

Audible changes

With audible changes, Polypane will sounds a beep whenever the page changes. A nice way to figure out when your page is too busy, or making changes when it does not have to.


Polypane simulates different types of impairments, permanent or situational, that lets you test your pages in different scenarios

We simulate all 8 types of color blindness. Together they affect roughly 1 in 12 men (8%) and one in 200 women in the world.

Red-green color blindness

The most common forms or color blindness all fall under Red-Green color blindness:





Blue-yellow color blindness

Less prevalent are Blue-yellow colorblindness. 0.02% of the worldwide population has this.



Full color blindness

Full, or near-full loss of color is incredibly rare and affects less than 0.0001% of worldwide population.



Visual impairments

Other visual impairments usually blur or dull someone's vision. As people get older, these become more prevalent.

Farsightedness Makes it difficult to see details up close.

Glaucoma Blurs vision, especially around the peripheral vision

Cataracts Blurs and clouds vision

Bright sunshine

Colors get washed out and low contrast parts of your page become invisible when watching a screen in bright sunlight.

Night mode

Many devices have a night mode, that lowers the blue colors and increases the red colors for a more pleasant display when there is less light.


Dyslexia affects 5 to 10% of the population worldwide, but it might be as high as 17% as not all dyslexia is diagnosed.

There is no single way to simulate dyslexia as it affects different people in different ways. Our simulator makes you aware of the reading difficulty it brings.

Add your own

Do you have an idea for a useful overlay? Let us know.

Is your question not answered?
Ask via Twitter, Slack or our contact form

Get Polypane

The browser for developers and designers building amazing sites and web apps.

Try for free
Polypane screenshot
By using our site you agree to our privacy policy and disclaimer