https://github.com/mindscreen/caat-color-contrast-bookmarklet
With the CAAT Color Contrast Checker, you can easily check the color contrasts of website elements directly in your browser as a bookmarklet.
https://github.com/mindscreen/caat-color-contrast-bookmarklet
Last synced: 3 months ago
JSON representation
With the CAAT Color Contrast Checker, you can easily check the color contrasts of website elements directly in your browser as a bookmarklet.
- Host: GitHub
- URL: https://github.com/mindscreen/caat-color-contrast-bookmarklet
- Owner: mindscreen
- License: mit
- Created: 2025-02-11T15:36:36.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-08-28T15:26:03.000Z (11 months ago)
- Last Synced: 2025-08-28T22:20:08.660Z (11 months ago)
- Language: JavaScript
- Size: 26.4 KB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# CAAT-Color-Contrast-Bookmarklet
With the CAAT Color Contrast Checker, you can easily check the color contrasts of website elements directly in your browser as a bookmarklet.
This tool evaluates the contrast conformity according to the W3C guidelines for small and large text, as well as non-text content.
Additionally, the color values and the calculated contrast ratio can be easily copied for further use.
## Features
- Provides color contrast checks for websites
- Adheres to the Web Content Accessibility Guidelines (WCAG) 2
- Usable as a bookmarklet in all major browsers
- Standalone and offline usage
- Real-time preview for different text sizes and non-text content
- Easy reuse by copying the values
## Building the Color Contrast Checker
Bookmarklet for check color contrasts directly in the browser.
1. Install the dependencies with `npm install`
2. Build the bookmarklet with `npm run build`
The default colors are controlled by the following variables:
- `const defaultForegroundColor` (default: #323130)
- `const defaultBackgroundColor` (default: #cdece8)
## Notes
The color picker function is not available in all browsers and operating systems.
If you have any questions or feedback, please open an issue.