# Color Contrast Auditor (WCAG 2.2) (`pattonholdings/color-contrast-auditor`) Actor Audits any URL against WCAG 2.2 AA and AAA color contrast standards. Returns per-element contrast ratio, pass/fail flags, worst offenders, and overall A-F grade. Built on the heuristics from a battle-tested Chrome extension. - **URL**: https://apify.com/pattonholdings/color-contrast-auditor.md - **Developed by:** [Coleton Patton](https://apify.com/pattonholdings) (community) - **Categories:** Developer tools - **Stats:** 2 total users, 1 monthly users, 100.0% runs succeeded, 0 bookmarks - **User rating**: No ratings yet ## Pricing Pay per usage This Actor is paid per platform usage. The Actor is free to use, and you only pay for the Apify platform usage, which gets cheaper the higher subscription plan you have. Learn more: https://docs.apify.com/platform/actors/running/actors-in-store#pay-per-usage ## What's an Apify Actor? Actors are a software tools running on the Apify platform, for all kinds of web data extraction and automation use cases. In Batch mode, an Actor accepts a well-defined JSON input, performs an action which can take anything from a few seconds to a few hours, and optionally produces a well-defined JSON output, datasets with results, or files in key-value store. In Standby mode, an Actor provides a web server which can be used as a website, API, or an MCP server. Actors are written with capital "A". ## How to integrate an Actor? If asked about integration, you help developers integrate Actors into their projects. You adapt to their stack and deliver integrations that are safe, well-documented, and production-ready. The best way to integrate Actors is as follows. In JavaScript/TypeScript projects, use official [JavaScript/TypeScript client](https://docs.apify.com/api/client/js.md): ```bash npm install apify-client ``` In Python projects, use official [Python client library](https://docs.apify.com/api/client/python.md): ```bash pip install apify-client ``` In shell scripts, use [Apify CLI](https://docs.apify.com/cli/docs.md): ````bash # MacOS / Linux curl -fsSL https://apify.com/install-cli.sh | bash # Windows irm https://apify.com/install-cli.ps1 | iex ```bash In AI frameworks, you might use the [Apify MCP server](https://docs.apify.com/platform/integrations/mcp.md). If your project is in a different language, use the [REST API](https://docs.apify.com/api/v2.md). For usage examples, see the [API](#api) section below. For more details, see Apify documentation as [Markdown index](https://docs.apify.com/llms.txt) and [Markdown full-text](https://docs.apify.com/llms-full.txt). # README ## Color Contrast Auditor (WCAG 2.2) Audit any webpage for color contrast accessibility issues — letter-graded report (A+ to F), pass rates for AA and AAA, and the 25 worst offenders with full selector + color hex details. ### What it does Loads a URL in a real browser, walks every visible text element, computes the WCAG contrast ratio between the resolved foreground and background colors, and grades pass/fail against: - **WCAG 2.2 AA** — 4.5:1 normal text, 3:1 large text - **WCAG 2.2 AAA** — 7:1 normal text, 4.5:1 large text "Large text" is 18pt+ (24px) regular OR 14pt+ (18.66px) bold per the spec. ### Input ```json { "url": "https://example.com" } ```` Or batch: ```json { "urls": ["https://a.com", "https://b.com"] } ``` Max 1000 URLs per run. ### Output Each URL produces one dataset item: ```json { "url": "https://example.com", "grade": "B", "passRateAA": 92.3, "passRateAAA": 78.1, "elementsChecked": 247, "failAA": 19, "failAAA": 54, "worstOffenders": [ { "selector": ".btn-cta", "textPreview": "Sign up free", "fgHex": "#FFFFFF", "bgHex": "#A0A0A0", "fontSizePx": 14, "fontWeight": 600, "isLargeText": false, "contrastRatio": 2.85, "aaThreshold": 4.5, "aaaThreshold": 7.0, "passAA": false, "passAAA": false } ], "allElements": [ /* full list, capped at 500 per page */ ] } ``` ### Use cases - **a11y monitoring pipelines** — wire into CI to catch contrast regressions - **Pre-launch design reviews** — feed staging URLs, get a grade - **WCAG audit automation** — drop a sitemap, get a portfolio-wide report - **Lead enrichment for a11y agencies** — find prospects with failing pages ### Pricing model (when published) Pay-per-result: **$0.10 per URL audited.** Most pages return in 10-15 seconds. ### Author note Built by [Peak Post](https://peakpost.ca) — solo developer running 22 Chrome extensions with ~104 active users. This Actor ports the contrast-checking logic from the [Color Contrast Checker Chrome extension](https://chromewebstore.google.com/) into a programmatic API. ### Roadmap - v1.1: pass non-text elements (icon contrast 3:1 minimum, WCAG 1.4.11) - v1.2: detect and skip decorative/aria-hidden text - v1.3: focus state contrast (hover/focus pseudo-elements) - v2.0: site-wide crawl mode with sitemap.xml ingestion # Actor input Schema ## `url` (type: `string`): A single page URL to audit. Provide either `url` or `urls`. ## `urls` (type: `array`): Array of URLs to audit in one run (max 1000). ## Actor input object example ```json { "url": "https://example.com" } ``` # API You can run this Actor programmatically using our API. Below are code examples in JavaScript, Python, and CLI, as well as the OpenAPI specification and MCP server setup. ## JavaScript example ```javascript import { ApifyClient } from 'apify-client'; // Initialize the ApifyClient with your Apify API token // Replace the '' with your token const client = new ApifyClient({ token: '', }); // Prepare Actor input const input = { "url": "https://example.com" }; // Run the Actor and wait for it to finish const run = await client.actor("pattonholdings/color-contrast-auditor").call(input); // Fetch and print Actor results from the run's dataset (if any) console.log('Results from dataset'); console.log(`💾 Check your data here: https://console.apify.com/storage/datasets/${run.defaultDatasetId}`); const { items } = await client.dataset(run.defaultDatasetId).listItems(); items.forEach((item) => { console.dir(item); }); // 📚 Want to learn more 📖? Go to → https://docs.apify.com/api/client/js/docs ``` ## Python example ```python from apify_client import ApifyClient # Initialize the ApifyClient with your Apify API token # Replace '' with your token. client = ApifyClient("") # Prepare the Actor input run_input = { "url": "https://example.com" } # Run the Actor and wait for it to finish run = client.actor("pattonholdings/color-contrast-auditor").call(run_input=run_input) # Fetch and print Actor results from the run's dataset (if there are any) print("💾 Check your data here: https://console.apify.com/storage/datasets/" + run["defaultDatasetId"]) for item in client.dataset(run["defaultDatasetId"]).iterate_items(): print(item) # 📚 Want to learn more 📖? Go to → https://docs.apify.com/api/client/python/docs/quick-start ``` ## CLI example ```bash echo '{ "url": "https://example.com" }' | apify call pattonholdings/color-contrast-auditor --silent --output-dataset ``` ## MCP server setup ```json { "mcpServers": { "apify": { "command": "npx", "args": [ "mcp-remote", "https://mcp.apify.com/?tools=pattonholdings/color-contrast-auditor", "--header", "Authorization: Bearer " ] } } } ``` ## OpenAPI specification ```json { "openapi": "3.0.1", "info": { "title": "Color Contrast Auditor (WCAG 2.2)", "description": "Audits any URL against WCAG 2.2 AA and AAA color contrast standards. Returns per-element contrast ratio, pass/fail flags, worst offenders, and overall A-F grade. Built on the heuristics from a battle-tested Chrome extension.", "version": "1.0", "x-build-id": "CIrjcxCrdxOLMAps6" }, "servers": [ { "url": "https://api.apify.com/v2" } ], "paths": { "/acts/pattonholdings~color-contrast-auditor/run-sync-get-dataset-items": { "post": { "operationId": "run-sync-get-dataset-items-pattonholdings-color-contrast-auditor", "x-openai-isConsequential": false, "summary": "Executes an Actor, waits for its completion, and returns Actor's dataset items in response.", "tags": [ "Run Actor" ], "requestBody": { "required": true, "content": { "application/json": { "schema": { "$ref": "#/components/schemas/inputSchema" } } } }, "parameters": [ { "name": "token", "in": "query", "required": true, "schema": { "type": "string" }, "description": "Enter your Apify token here" } ], "responses": { "200": { "description": "OK" } } } }, "/acts/pattonholdings~color-contrast-auditor/runs": { "post": { "operationId": "runs-sync-pattonholdings-color-contrast-auditor", "x-openai-isConsequential": false, "summary": "Executes an Actor and returns information about the initiated run in response.", "tags": [ "Run Actor" ], "requestBody": { "required": true, "content": { "application/json": { "schema": { "$ref": "#/components/schemas/inputSchema" } } } }, "parameters": [ { "name": "token", "in": "query", "required": true, "schema": { "type": "string" }, "description": "Enter your Apify token here" } ], "responses": { "200": { "description": "OK", "content": { "application/json": { "schema": { "$ref": "#/components/schemas/runsResponseSchema" } } } } } } }, "/acts/pattonholdings~color-contrast-auditor/run-sync": { "post": { "operationId": "run-sync-pattonholdings-color-contrast-auditor", "x-openai-isConsequential": false, "summary": "Executes an Actor, waits for completion, and returns the OUTPUT from Key-value store in response.", "tags": [ "Run Actor" ], "requestBody": { "required": true, "content": { "application/json": { "schema": { "$ref": "#/components/schemas/inputSchema" } } } }, "parameters": [ { "name": "token", "in": "query", "required": true, "schema": { "type": "string" }, "description": "Enter your Apify token here" } ], "responses": { "200": { "description": "OK" } } } } }, "components": { "schemas": { "inputSchema": { "type": "object", "properties": { "url": { "title": "URL", "type": "string", "description": "A single page URL to audit. Provide either `url` or `urls`." }, "urls": { "title": "URLs", "uniqueItems": true, "type": "array", "description": "Array of URLs to audit in one run (max 1000).", "items": { "type": "string" } } } }, "runsResponseSchema": { "type": "object", "properties": { "data": { "type": "object", "properties": { "id": { "type": "string" }, "actId": { "type": "string" }, "userId": { "type": "string" }, "startedAt": { "type": "string", "format": "date-time", "example": "2025-01-08T00:00:00.000Z" }, "finishedAt": { "type": "string", "format": "date-time", "example": "2025-01-08T00:00:00.000Z" }, "status": { "type": "string", "example": "READY" }, "meta": { "type": "object", "properties": { "origin": { "type": "string", "example": "API" }, "userAgent": { "type": "string" } } }, "stats": { "type": "object", "properties": { "inputBodyLen": { "type": "integer", "example": 2000 }, "rebootCount": { "type": "integer", "example": 0 }, "restartCount": { "type": "integer", "example": 0 }, "resurrectCount": { "type": "integer", "example": 0 }, "computeUnits": { "type": "integer", "example": 0 } } }, "options": { "type": "object", "properties": { "build": { "type": "string", "example": "latest" }, "timeoutSecs": { "type": "integer", "example": 300 }, "memoryMbytes": { "type": "integer", "example": 1024 }, "diskMbytes": { "type": "integer", "example": 2048 } } }, "buildId": { "type": "string" }, "defaultKeyValueStoreId": { "type": "string" }, "defaultDatasetId": { "type": "string" }, "defaultRequestQueueId": { "type": "string" }, "buildNumber": { "type": "string", "example": "1.0.0" }, "containerUrl": { "type": "string" }, "usage": { "type": "object", "properties": { "ACTOR_COMPUTE_UNITS": { "type": "integer", "example": 0 }, "DATASET_READS": { "type": "integer", "example": 0 }, "DATASET_WRITES": { "type": "integer", "example": 0 }, "KEY_VALUE_STORE_READS": { "type": "integer", "example": 0 }, "KEY_VALUE_STORE_WRITES": { "type": "integer", "example": 1 }, "KEY_VALUE_STORE_LISTS": { "type": "integer", "example": 0 }, "REQUEST_QUEUE_READS": { "type": "integer", "example": 0 }, "REQUEST_QUEUE_WRITES": { "type": "integer", "example": 0 }, "DATA_TRANSFER_INTERNAL_GBYTES": { "type": "integer", "example": 0 }, "DATA_TRANSFER_EXTERNAL_GBYTES": { "type": "integer", "example": 0 }, "PROXY_RESIDENTIAL_TRANSFER_GBYTES": { "type": "integer", "example": 0 }, "PROXY_SERPS": { "type": "integer", "example": 0 } } }, "usageTotalUsd": { "type": "number", "example": 0.00005 }, "usageUsd": { "type": "object", "properties": { "ACTOR_COMPUTE_UNITS": { "type": "integer", "example": 0 }, "DATASET_READS": { "type": "integer", "example": 0 }, "DATASET_WRITES": { "type": "integer", "example": 0 }, "KEY_VALUE_STORE_READS": { "type": "integer", "example": 0 }, "KEY_VALUE_STORE_WRITES": { "type": "number", "example": 0.00005 }, "KEY_VALUE_STORE_LISTS": { "type": "integer", "example": 0 }, "REQUEST_QUEUE_READS": { "type": "integer", "example": 0 }, "REQUEST_QUEUE_WRITES": { "type": "integer", "example": 0 }, "DATA_TRANSFER_INTERNAL_GBYTES": { "type": "integer", "example": 0 }, "DATA_TRANSFER_EXTERNAL_GBYTES": { "type": "integer", "example": 0 }, "PROXY_RESIDENTIAL_TRANSFER_GBYTES": { "type": "integer", "example": 0 }, "PROXY_SERPS": { "type": "integer", "example": 0 } } } } } } } } } } ```