{"id":13401249,"url":"https://github.com/jxnblk/colorable","last_synced_at":"2025-04-08T09:03:45.057Z","repository":{"id":26924654,"uuid":"30386842","full_name":"jxnblk/colorable","owner":"jxnblk","description":"Color combination contrast tester","archived":false,"fork":false,"pushed_at":"2021-07-05T14:37:59.000Z","size":2514,"stargazers_count":2022,"open_issues_count":27,"forks_count":130,"subscribers_count":38,"default_branch":"master","last_synced_at":"2025-04-01T08:29:08.718Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://colorable.jxnblk.com","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/jxnblk.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-02-06T00:44:54.000Z","updated_at":"2025-03-31T15:10:30.000Z","dependencies_parsed_at":"2022-08-07T12:01:18.280Z","dependency_job_id":null,"html_url":"https://github.com/jxnblk/colorable","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jxnblk%2Fcolorable","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jxnblk%2Fcolorable/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jxnblk%2Fcolorable/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jxnblk%2Fcolorable/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jxnblk","download_url":"https://codeload.github.com/jxnblk/colorable/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247809963,"owners_count":20999816,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-07-30T19:01:00.377Z","updated_at":"2025-04-08T09:03:45.024Z","avatar_url":"https://github.com/jxnblk.png","language":"HTML","funding_links":[],"categories":["HTML","Tools \u0026 Resources"],"sub_categories":["107. Colorable"],"readme":"# Colorable\n\nTake a set color palette and get contrast values for every possible combination – \nuseful for finding safe color combinations with predefined colors\nand includes pass/fail scores for the\n[WCAG accessibility guidelines](http://www.w3.org/TR/WCAG20/#visual-audio-contrast).\n\n## Getting Started\n\n```bash\nnpm i --save colorable\n```\n\n## Usage\n\nPass an array of color strings or an object with color strings as values. \n\n```js\nvar colorable = require('colorable')\n\nvar colors = {\n  red: 'red',\n  green: 'green',\n  blue: 'blue'\n}\n\nvar result = colorable(colors, { compact: true, threshold: 0 })\n```\n\nReturns an array of colors with combinations for all other colors and their\n[WCAG contrast](http://www.w3.org/TR/WCAG20/#visual-audio-contrast)\nvalues.\n\n```json\n[\n  {\n    \"hex\": \"#FF0000\",\n    \"name\": \"red\",\n    \"combinations\": [\n      {\n        \"hex\": \"#008000\",\n        \"name\": \"green\",\n        \"contrast\": 1.28483997166146,\n        \"accessibility\": {\n          \"aa\": false,\n          \"aaLarge\": false,\n          \"aaa\": false,\n          \"aaaLarge\": false\n        }\n      },\n      {\n        \"hex\": \"#0000FF\",\n        \"name\": \"blue\",\n        \"contrast\": 2.148936170212766,\n        \"accessibility\": {\n          \"aa\": false,\n          \"aaLarge\": false,\n          \"aaa\": false,\n          \"aaaLarge\": false\n        }\n      }\n    ]\n  },\n  ...\n]\n```\n\n### Accessibility object\n\nEach key is a boolean value indicating if the color contrast meets the following criteria:\n- `aa` - greater than 4.5 (for normal sized text)\n- `aaLarge` - greater than 3 ([for bold text or text larger than 24px](http://www.w3.org/TR/WCAG20/#larger-scaledef))\n- `aaa` - greater than 7 \n- `aaaLarge` - greater than 4.5 \n\n---\n\n## Options\n\n### `compact`\n\n_Type: Boolean (default: `false`)_\n\nIf set to `true`, the result will be a smaller object that only includes hex value color strings, a name for each color (if an object is passed to the function), contrast, and accessibility values.\nWhen set to `false`, the result also includes the entire [harthur/color](https://www.npmjs.com/package/color) object for each color, which includes other properties and methods for color manipulation.\n\n### `threshold`\n\n_Type: Number (default: `0`)_\n\nWhen set, the colorable function only returns combinations that have a contrast above this value. This is useful for only seeing combinations that pass a minimum contrast level.\n\n### `uniq`\n\n_Type: Boolean (default: true)_\n\nWhen set to `true`, the array of colors is passed through lodash.uniq to remove duplicates.\n\n\n---\n\nMIT License\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjxnblk%2Fcolorable","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjxnblk%2Fcolorable","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjxnblk%2Fcolorable/lists"}