Item logo image for A11y Gradient

A11y Gradient

Item media 3 (screenshot) for A11y Gradient
Item video thumbnail
Item media 2 (screenshot) for A11y Gradient
Item media 3 (screenshot) for A11y Gradient
Item video thumbnail
Item video thumbnail
Item media 2 (screenshot) for A11y Gradient
Item media 3 (screenshot) for A11y Gradient

Overview

It gives you contrast ratio (accessibility standards) for text against each pixel of multi-colored backgrounds.

Chrome developer tools gives you contrast ratio of text against only monochromatic backgrounds. There are so many sites using gradients or images as backgrounds. The texts are not accessible because there is no tool to assess them. This tool will help you fix those issues. You can compare background against text color, text border and even element border. There is no specification for element borders but I think it might help in making better visually appealing UIs. It will help you analysis how the background at different regions are affecting the color contrast ratio against the selected text and gives you an average contrast ratio as well. Stay tuned for more features taking accessibility of your site to the next level. Feedback appreciated.

Details

  • Version
    0.2.6-alpha
  • Updated
    March 31, 2025
  • Offered by
    biboswan98
  • Size
    109KiB
  • Languages
    English (United States)
  • Developer
    Email
    bibo@biboswanroy.com
  • Non-trader
    This developer has not identified itself as a trader. For consumers in the European Union, please note that consumer rights do not apply to contracts between you and this developer.

Privacy

Manage extensions and learn how they're being used in your organization

A11y Gradient has disclosed the following information regarding the collection and usage of your data. More detailed information can be found in the developer's privacy policy.

A11y Gradient handles the following:

Website content

This developer declares that your data is

  • Not being sold to third parties, outside of the approved use cases
  • Not being used or transferred for purposes that are unrelated to the item's core functionality
  • Not being used or transferred to determine creditworthiness or for lending purposes

Related

Reader View

4.7

Removes clutter like buttons, backgrounds, adjusts text size, contrast, and layout for better readability

Text Blackness

3.4

Darken grey/colourful text on web pages. No more squinting at grey fonts for those of us with bad eyesight.

Color Inverter

0.0

Invert colors on specific websites with optional monochrome filter. Settings are per-domain with hierarchical matching.

Dark mode / night reader

4.2

Inverts page colors, showing white text on a dark background

Colour Contrast Checker

3.5

Check the contrast between different colour combinations against WCAG standards

WCAG Contrast Checker

5.0

Use WCAG Contrast Checker to easily check color contrast ratio and for online accessibility testing with WCAG contrast standards.

WCAG Color contrast checker

3.9

To check the color contrast between foreground and background of the texts

Simple Contrast Toggle

0.0

Click icon to apply simple high contrast (black text on white background) to the current page.

Transparent Standalone Images

4.1

This add-on renders standalone images on a transparent background, so you can see the image in all its glory!

Color Picker Chrome extension

4.1

Color Picker Chrome extension addon lets you to pick color from any webpage

Make Chrome Text Black

4.0

Make text easier to read in Google Chrome

GET WEB SITE THEME COLOR

3.4

Extract the theme colors from the current website and easily check their usage ratio and color codes.

Reader View

4.7

Removes clutter like buttons, backgrounds, adjusts text size, contrast, and layout for better readability

Text Blackness

3.4

Darken grey/colourful text on web pages. No more squinting at grey fonts for those of us with bad eyesight.

Color Inverter

0.0

Invert colors on specific websites with optional monochrome filter. Settings are per-domain with hierarchical matching.

Dark mode / night reader

4.2

Inverts page colors, showing white text on a dark background

Colour Contrast Checker

3.5

Check the contrast between different colour combinations against WCAG standards

WCAG Contrast Checker

5.0

Use WCAG Contrast Checker to easily check color contrast ratio and for online accessibility testing with WCAG contrast standards.

WCAG Color contrast checker

3.9

To check the color contrast between foreground and background of the texts

Simple Contrast Toggle

0.0

Click icon to apply simple high contrast (black text on white background) to the current page.

Google apps