The browser devtools can help you in checking color contrast between background and text colors. But only monochromatic colors, right ? They don't catch gradients. That's what A11y Gradient is all about.
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.