Can I DevTools?

Share this post

Tips & Tricks #3

canidevtools.substack.com

Tips & Tricks #3

Can I simulate vision deficiencies like blurred vision, color blindness etc.,?

Pankaj Parashar
May 3, 2022
Share this post

Tips & Tricks #3

canidevtools.substack.com

Chrome

  1. Run the Command menu using Cmd+Shift+P or Ctrl+Shift+P > Search for “Show Rendering” > Press Enter to open the Rendering drawer.

  2. Scroll down to the section called “Emulate vision deficiencies” and select the type of deficiency to test your website.

Simulating vision deficiencies in Chrome
Simulating vision deficiencies in Chrome

Edge

  1. Run the Command menu using Cmd+Shift+P or Ctrl+Shift+P > Search for “Show Rendering” > Press Enter to open the Rendering drawer.

  2. Scroll down to the section called “Emulate vision deficiencies” and select the type of deficiency to test your website.

Simulating vision deficiencies in Edge
Simulating vision deficiencies in Edge

Opera

  1. Run the Command menu using Cmd+Shift+P or Ctrl+Shift+P > Search for “Show Rendering” > Press Enter to open the Rendering drawer.

  2. Scroll down to the section called “Emulate vision deficiencies” and select the type of deficiency to test your website.

Simulating vision deficiencies in Opera

Firefox

  1. Open devtools > Accessibility (Click >> icon for more tabs if hidden).

  2. Click the Simulate dropdown to test the website against different vision deficiencies.

Simulating vision deficiencies in Firefox

Thanks for reading Can I DevTools?! Subscribe for free to receive new posts and support my work.

Share this post

Tips & Tricks #3

canidevtools.substack.com
Previous
Next
Comments
TopNew

No posts

Ready for more?

© 2023 Pankaj Parashar
Privacy ∙ Terms ∙ Collection notice
Start WritingGet the app
Substack is the home for great writing