{"id":16226394,"url":"https://github.com/ericrovell/blossom","last_synced_at":"2026-04-01T20:29:49.384Z","repository":{"id":46779822,"uuid":"386368704","full_name":"EricRovell/blossom","owner":"EricRovell","description":"Blossom is a JS library tool for colour manipulations and transformations.","archived":false,"fork":false,"pushed_at":"2022-09-30T21:37:47.000Z","size":370,"stargazers_count":3,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2024-10-20T22:38:55.048Z","etag":null,"topics":["cmyk","color","converter","hex","hsl","hsv","rgb"],"latest_commit_sha":null,"homepage":"https://ericrovell.github.io/blossom-web","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/EricRovell.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","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":"2021-07-15T17:13:16.000Z","updated_at":"2023-01-06T01:13:59.000Z","dependencies_parsed_at":"2022-09-26T18:11:35.274Z","dependency_job_id":null,"html_url":"https://github.com/EricRovell/blossom","commit_stats":null,"previous_names":[],"tags_count":12,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EricRovell%2Fblossom","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EricRovell%2Fblossom/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EricRovell%2Fblossom/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EricRovell%2Fblossom/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/EricRovell","download_url":"https://codeload.github.com/EricRovell/blossom/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":221727819,"owners_count":16870759,"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":["cmyk","color","converter","hex","hsl","hsv","rgb"],"created_at":"2024-10-10T12:48:59.819Z","updated_at":"2026-04-01T20:29:49.332Z","avatar_url":"https://github.com/EricRovell.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n  \u003cimg\n    alt=\"Library logo as flower\"\n    src=\"assets/logo.svg\"\n    width=\"125px\"\n    height=\"125px\"\n    padding=\"25px\"\n  /\u003e\n\u003c/div\u003e\n\n\u003cdiv align=\"center\"\u003e\n  \u003ca href=\"https://github.com/EricRovell/blossom/actions\"\u003e\n    \u003cimg alt=\"build action status\" src=\"https://github.com/EricRovell/blossom/workflows/build/badge.svg\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://codecov.io/gh/EricRovell/blossom\"\u003e\n    \u003cimg src=\"https://codecov.io/gh/EricRovell/blossom/branch/main/graph/badge.svg?token=39QNLRFB05\"/\u003e\n  \u003c/a\u003e\n\u003c/div\u003e\n\n\u003cdiv align=\"center\"\u003e\n  \u003ca href=\"https://www.npmjs.com/package/@ericrovell/blossom\"\u003e\n    \u003cimg alt=\"npm package version\" src=\"https://badgen.net/npm/v/@ericrovell/blossom/\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/@ericrovell/blossom\"\u003e\n    \u003cimg alt=\"types included\" src=\"https://badgen.net/npm/types/@ericrovell/blossom/\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/@ericrovell/blossom\"\u003e\n    \u003cimg alt=\"downloads count\" src=\"https://badgen.net/npm/dt/@ericrovell/blossom/\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/@ericrovell/blossom\"\u003e\n    \u003cimg alt=\"node version\" src=\"https://badgen.net/npm/node/@ericrovell/blossom/\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/@ericrovell/blossom\"\u003e\n    \u003cimg alt=\"licence\" src=\"https://badgen.net/npm/license/@ericrovell/blossom/\" /\u003e\n  \u003c/a\u003e\n\u003c/div\u003e\n\n\u003cdiv align=\"center\"\u003e\n  \u003ca href=\"https://bundlephobia.com/package/@ericrovell/blossom\"\u003e\n    \u003cimg alt=\"minified size\" src=\"https://badgen.net/bundlephobia/min/@ericrovell/blossom/\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://bundlephobia.com/package/@ericrovell/blossom\"\u003e\n    \u003cimg alt=\"minzipped size\" src=\"https://badgen.net/bundlephobia/minzip/@ericrovell/blossom/\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://bundlephobia.com/package/@ericrovell/blossom\"\u003e\n    \u003cimg alt=\"dependency count\" src=\"https://badgen.net/bundlephobia/dependency-count/@ericrovell/blossom/\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://bundlephobia.com/package/@ericrovell/blossom\"\u003e\n    \u003cimg alt=\"tree-shaking\" src=\"https://badgen.net/bundlephobia/tree-shaking/@ericrovell/blossom/\" /\u003e\n  \u003c/a\u003e\n\u003c/div\u003e\n\n# Blossom\n\nBlossom is a JS library tool for color manipulations and transformations.\n\n## Features:\n\n- Chainable API;\n- Ummutable;\n- Written in Typescript;\n- Types included;\n- Dependency-free;\n\n## Getting started\n\n```\nnpm i @ericrovell/blossom\n```\n\n```\nimport { blossom } from \"@ericrovell/blossom\";\n\nblossom(\"#FF0000\")\n  .grayscale\n  .setAlpha(0.25)\n  .toStringRGB\n\n// -\u003e rgb(128 128 128 / 0.25)\n```\n\n## Supported color models\n\n- Hexadecimal strings;\n- RGB (objects, strings);\n- HSL (objects, strings);\n- HSV (objects);\n- CMYK (objects);\n- XYZ (objects);\n- LAB (objects);\n- LCH (objects, strings);\n- HWB (objects, strings);\n- [Named colors](https://css-tricks.com/snippets/css/named-colors-and-hex-equivalents/)\n\n## API\n\n### Color parsing\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003eblossom\u003c/code\u003e\n  \u003c/summary\u003e\n  \n  Parses the given input and creates a new Blossom instance.\n\n  ```js\n  import { blossom } from \"@ericrovell/blossom\";\n\n  // string input\n  blossom(\"#ABC\");\n  blossom(\"#AABBCC\");\n  blossom(\"#ADCDEF12\");\n  blossom(\"rgb(100, 200, 255)\");\n  blossom(\"rgba(100, 200, 255, 0.5)\");\n  blossom(\"rgba(10% 20% 30% / 35%)\");\n  blossom(\"hsl(180, 78%, 87%)\");\n  blossom(\"hsla(180, 78%, 87%, 0.5)\");\n  blossom(\"hsla(180deg 78% 87% / 50%)\");\n\n  // object input\n  blossom({ r: 12, g: 34, b: 56 });\n  blossom({ r: 12, g: 34, b: 56, a: 1 });\n  blossom({ h: 180, s: 50, l: 75 });\n  blossom({ h: 180, s: 50, l: 75, a: 1 });\n  blossom({ h: 180, s: 50, v: 65 });\n  blossom({ h: 180, s: 50, v: 65, a: 1 });\n  blossom({ c: 25, m: 50, k: 75, k: 100 });\n  blossom({ c: 25, m: 50, k: 75, k: 100, a: 1 });\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003egetModel\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Parses a color and returns a color model name of the given input.\n\n  ```js\n    import { getModel } from \"@ericrovell/blossom\";\n\n    getModel(\"#ADC123\"); // -\u003e \"hex\"\n    getModel({ r: 13, g: 237, b: 162 }); // -\u003e \"rgb\"\n    getModel(\"hsl(180deg 50% 50%)\"); // -\u003e \"hsl\"\n    getModel(\"Hi!\"); // -\u003e null\n  ```\n\u003c/details\u003e\n\n### Color transformations\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.hex\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the hexadecimal representation of a color.\n  Outputs the modern `#RRGGBBAA` opacity syntax for transparent colors.\n\n  ```js\n  blossom(\"rgb(0, 255, 0)\").hex; // -\u003e \"#00FF00\"\n  blossom({ h: 300, s: 100, l: 50 }).hex; // -\u003e \"#FF00FF\"\n  blossom({ r: 255, g: 255, b: 255, a: 0 }).hex; // -\u003e \"#FFFFFF00\"\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.rgb\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the RGB color model object of a color.\n\n  ```js\n  blossom(\"#ff0000\").rgb; // -\u003e { r: 255, g: 0, b: 0, a: 1 }\n  blossom({ h: 180, s: 100, l: 50, a: 0.5 }).rgb; // -\u003e { r: 0, g: 255, b: 255, a: 0.5 }\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.toStringRGB\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the RGB color model string of a color.\n  Outputs the modern whitespace syntax.\n\n  ```js\n  blossom(\"#ff0000\").toStringRGB; // -\u003e \"rgb(255 0 0)\"\n  blossom({ h: 180, s: 100, l: 50, a: 0.5 }).toStringRGB; // -\u003e \"rgb(0 255 255 / 0.5)\"\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.hsl\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the HSL color space object of a color.\n\n  ```js\n  blossom(\"#ffff00\").hsl; // -\u003e { h: 60, s: 100, l: 50, a: 1 }\n  blossom(\"rgba(0, 0, 255, 0.5)\").hsl; // -\u003e { h: 240, s: 100, l: 50, a: 0.5 }\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.toStringHSL\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the HSL color space string of a color.\n  Outputs the modern whitespace syntax.\n\n  ```js\n  blossom(\"#ffff00\").toStringHSL; // -\u003e \"hsl(60deg 100% 50%)\"\n  blossom(\"rgba(0, 0, 255, 0.5)\").toStringHSL; // -\u003e \"hsl(240deg 100% 50% / 0.5)\"\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.hsv\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the HSV color space object of a color.\n\n  ```js\n  blossom(\"#ffff00\").hsv; // -\u003e { h: 60, s: 100, v: 100, a: 1 }\n  blossom(\"rgba(0, 255, 255, 0.5)\").hsv; // -\u003e { h: 180, s: 100, v: 100, a: 1 }\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.toStringHSV\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the HSV color space string of a color.\n  Outputs the modern whitespace syntax.\n\n  ```js\n  blossom(\"#FFFF00\").toStringHSV; // -\u003e \"hsc(60deg 100% 100%)\"\n  blossom(\"rgba(0, 0, 255, 0.5)\").toStringHSV; // -\u003e \"hsc(240deg 100% 100% / 0.5)\"\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.cmyk\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the CMYK color space object of a color.\n\n  ```js\n  blossom(\"#FFFFFF\").cmyk; // -\u003e { c: 0, m: 0, y: 0, k: 0, a: 1 }\n  blossom(\"#555AAA\").cmyk; // -\u003e { c: 50, m: 47, y: 0, k: 33, a: 1 }\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.toStringCMYK\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the CMYK color space string of a color.\n\n  ```js\n  blossom(\"#FFFFFF\").toStringCMYK; // -\u003e device-cmyk(0% 0% 0% 0%){ c: 0, m: 0, y: 0, k: 0, a: 1 }\n  blossom(\"#555AAA80\").toStringCMYK; // -\u003e device-cmyk(50% 47% 0 33% / 0.5)\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.xyz\u003c/code\u003e, available via \u003cstrong\u003eXYZ\u003c/strong\u003e plugin\n  \u003c/summary\u003e\n\n  Returns the [CIE XYZ](https://www.sttmedia.com/colormodel-xyz) color space object of a color.\n\n  ```js\n  blossom(\"#FFFFFF\").xyz; // -\u003e { x: 95.047, y: 100, z: 108.883 a: 1 }\n  blossom({ x: 0, y: 0, z: 0 }).hex; // -\u003e \"#000000\"\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.toStringXYZ\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the CIE XYZ color space string of a color.\n\n  ```js\n  blossom(\"#FFFFFF\").toStringXYZ; // -\u003e color(xyz 96.42 100 82.52)\n  blossom(\"#555AAA80\").toStringXYZ; // -\u003e color(xyz 13.65 11.79 29.83 / 0.5)\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.lab\u003c/code\u003e, available via \u003cstrong\u003eLAB\u003c/strong\u003e plugin\n  \u003c/summary\u003e\n\n  Returns the [CIE LAB](https://en.wikipedia.org/wiki/CIELAB_color_space) color space object of a color.\n\n  ```js\n  blossom(\"#FFFFFF\").lab; // -\u003e { l: 100, a: 0, b: 0, alpha: 1 }\n  blossom(\"#123ABC\").lab; // -\u003e { l: 29.95, a: 29.48, b: -72.93, alpha: 1 }\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.toStringLAB\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the CIE LAB color space string of a color.\n\n  ```js\n  blossom(\"#FFFFFF\").toStringLAB; // -\u003e lab(100% 0 0)\n  blossom(\"#555AAA80\").toStringLAB; // -\u003e lab(40.88% 15.43 -44.4)\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.lch\u003c/code\u003e, available via \u003cstrong\u003eLCH\u003c/strong\u003e plugin\n  \u003c/summary\u003e\n\n  Returns the [CIE LCH](https://lea.verou.me/2020/04/lch-colors-in-css-what-why-and-how/) color space object of a color.\n\n  ```js\n  blossom(\"#FFFFFF\").lch; // -\u003e { l: 100, c: 0, h: 0, a: 1 }\n  blossom(\"#123ABC\").lch; // -\u003e { l: 29.95, c: 78.66, c: 292.01, alpha: 1 }\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.toStringLCH\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the CIE LCH color space string of a color.\n\n  ```js\n  blossom(\"#FFFFFF\").toStringLCH; // -\u003e lch(100% 0 0)\n  blossom(\"#555AAA80\").toStringLCH; // -\u003e lch(40.88% 47.01 289.16 / 0.5)\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.hwb\u003c/code\u003e, available via \u003cstrong\u003eHWB\u003c/strong\u003e plugin\n  \u003c/summary\u003e\n\n  Returns the [HWB](https://en.wikipedia.org/wiki/HWB_color_model) color space object of a color.\n\n  ```js\n  blossom(\"#FFFFFF\").hwb; // -\u003e { h: 0, w: 100, b: 0, a: 1 }\n  blossom(\"#123ABC\").hwb; // -\u003e { h: 226, w: 7, b: 26, a: 1 }\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.toStringHWB\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the HWB color space string of a color.\n\n  ```js\n  blossom(\"#FFFFFF\").toStringHWB; // -\u003e hwb(0 100% 0%)\n  blossom(\"#555AAA80\").toStringHWB; // -\u003e hwb(236 33% 33% / 0.5)\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.name\u003c/code\u003e, available via \u003cstrong\u003eNames\u003c/strong\u003e plugin\n  \u003c/summary\u003e\n\n  Returns the name of the color as **exact** match of [browser supported list of 140 named colors](https://css-tricks.com/snippets/css/named-colors-and-hex-equivalents/). If the color has not an alias returns `null` instead.\n\n  ```js\n  blossom(\"#FF0000\").name; // -\u003e \"red\"\n  blossom(\"#123ABC\").name; // -\u003e null\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.closestName\u003c/code\u003e, available via \u003cstrong\u003eNames\u003c/strong\u003e plugin\n  \u003c/summary\u003e\n\n  Returns the closest named color from [browser supported list of 140 named colors](https://css-tricks.com/snippets/css/named-colors-and-hex-equivalents/) color.\n\n  ```js\n  blossom(\"#FF0001\").closestName; // -\u003e \"red\"\n  blossom(\"#66339A\").closestName; // -\u003e \"rebeccapurple\"\n  ```\n\u003c/details\u003e\n\n### Color manipulation\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.setAlpha(value)\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Changes the alpha channel value and returns a new `Blossom` instance.\n\n  ```js\n  blossom(\"rgb(0, 0, 0)\")\n    .setAlpha(0.5)\n    .toStringRGB; // -\u003e \"rgb(0 0 0 / 0.5)\"\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.inverted\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Creates a new `Blossom` instance with an inverted color.\n\n  ```js\n  blossom(\"#aabbcc\")\n    .inverted\n    .hex; // -\u003e \"#554433\"\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.saturate(amount = 0.1)\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Increases the HSL saturation of a color by the given amount.\n\n  ```js\n  blossom(\"#bf4040\")\n    .saturate(0.25)\n    .hex; // -\u003e \"#df2020\"\n\n  blossom(\"hsl(0, 50%, 50%)\")\n    .saturate(0.5)\n    .toStringHSL; // -\u003e \"hsl(0deg 100% 50%)\"\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.desaturate(amount = 0.1)\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Decreases the HSL saturation of a color by the given amount.\n\n  ```js\n  blossom(\"#df2020\")\n    .saturate(0.25)\n    .hex; // -\u003e \"#bf4040\"\n\n  blossom(\"hsl(0, 100%, 50%)\")\n    .saturate(0.5)\n    .toStringHSL; // -\u003e \"hsl(0deg 50% 50%)\"  \n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.grayscale\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Creates a gray color with the same lightness as a source color.\n  Same result as `.desaturate(1)`.\n\n  ```js\n  blossom(\"#bf4040\")\n    .grayscale\n    .hex; // -\u003e \"#808080\"\n\n  blossom(\"hsl(0, 100%, 50%)\")\n    .grayscale\n    .toStringHSL; // -\u003e \"hsl(0deg 0% 50%)\"\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.lighten(amount = 0.1)\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Increases the HSL lightness of a color by the given amount.\n\n  ```js\n  blossom(\"#000000\")\n    .lighten(0.5)\n    .hex; // -\u003e \"#808080\"\n\n  blossom(\"#223344\")\n    .lighten(0.3)\n    .hex; // -\u003e \"#5580aa\"\n\n  blossom(\"hsl(0, 50%, 50%)\")\n    .lighten(0.5)\n    .toStringHSL; // -\u003e \"hsl(0deg 50% 100%)\"\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.darken(amount = 0.1)\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Decreases the HSL lightness of a color by the given amount.\n\n  ```js\n  blossom(\"#ffffff\")\n    .darken(0.5)\n    .hex; // -\u003e \"#808080\"\n\n  blossom(\"#5580aa\")\n    .darken(0.3)\n    .hex; // -\u003e \"#223344\"\n\n  blossom(\"hsl(0, 50%, 100%)\")\n    .lighten(0.5)\n    .toStringHSL; // -\u003e \"hsl(0, 50%, 50%)\"\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.setHue(value)\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Changes the hue value and returns a new `Blossom` instance.\n\n  ```js\n  blossom(\"hsl(90, 50%, 50%)\")\n    .setHue(180)\n    .toStringHSL; // -\u003e \"hsl(180deg 50% 50%)\"\n\n  blossom(\"hsl(90, 50%, 50%)\")\n    .setHue(370)\n    .toStringHSL; // -\u003e \"hsl(10deg 50% 50%)\"\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.rotate(amout = 15)\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Increases the HSL hue value of a color by the given amount.\n\n  ```js\n  blossom(\"hsl(90, 50%, 50%)\")\n    .rotate(90)\n    .toStringHSL; // -\u003e \"hsl(180deg 50% 50%)\"\n\n  blossom(\"hsl(90, 50%, 50%)\")\n    .rotate(-180)\n    .toStringHSL; // -\u003e \"hsl(270deg 50% 50%)\"\n  ```\n\u003c/details\u003e\n\n### Color properties\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.valid\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns a boolean indicating whether or not an input has been parsed successfully.\n  On unsuccess, color value defaults to black without error.\n\n  ```js\n  blossom(\"#FFF\").valid; // -\u003e true\n  blossom(\"#NaN\").valid; // -\u003e false\n  blossom(\"hello\").valid; // -\u003e false\n  blossom({ r: 0, g: 0, b: 0 }).valid; // -\u003e true\n  blossom({ r: 0, g: 0, v: 0 }).valid; // -\u003e false\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.alpha\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns an alpha channel value of the color.\n\n  ```js\n  blossom(\"#FFFFFF\").alpha; // -\u003e 1\n  blossom(\"rgba(50 100 150 / 0.5)\").alpha; // -\u003e 0.5\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.opaque\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns a boolean indicating whether or not a color is opaque.\n\n  ```js\n  blossom(\"#FFFFFF\").opaque; // -\u003e true\n  blossom(\"rgba(50 100 150 / 0.5)\").opaque; // -\u003e false\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.transparent\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns a boolean indicating whether or not a color is transparent.\n\n  ```js\n  blossom(\"#FFFFFF\").transparent; // -\u003e false\n  blossom(\"rgba(50 100 150 / 0.5)\").transparent; // -\u003e true\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.hue\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the Hue value of the number on the color wheel.\n\n  ```js\n  blossom(\"hsl(90deg 50% 50%)\").hue; // -\u003e 90\n  blossom(\"hsl(-10deg 50% 50%)\").hue; // -\u003e 350\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.saturation\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the saturation value of the number.\n\n  ```js\n  blossom(\"hsl(90deg 50% 50%)\").saturation; // -\u003e 0.5\n  blossom(\"hsl(-10deg 98% 50%)\").saturation; // -\u003e 0.98\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.lightness\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the lightness value of the number.\n\n  ```js\n  blossom(\"hsl(90deg 50% 50%)\").lightness; // -\u003e 0.5\n  blossom(\"hsl(-10deg 50% 46%)\").lightness; // -\u003e 0.46\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.brightness\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Returns the brightness of a color in range [0; 1].\n  The calculation logic is modified from [Web Content Accessibility Guidelines](https://www.w3.org/TR/AERT/#color-contrast).\n\n  ```js\n  blossom(\"#000000\").brightness; // -\u003e 0\n  blossom(\"#808080\").brightness; // -\u003e 0.5\n  blossom(\"#FFFFFF\").brightness; // -\u003e 1\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.light\u003c/code\u003e\n  \u003c/summary\u003e\n\n  A Boolean indicator whether or not a color is light (brightness \u003e= 0.5).\n\n  ```js\n  blossom(\"#000000\").light; // -\u003e false\n  blossom(\"#808080\").light; // -\u003e true\n  blossom(\"#FFFFFF\").light; // -\u003e true\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.dark\u003c/code\u003e\n  \u003c/summary\u003e\n\n  A Boolean indicator whether or not a color is dark (brightness \u003c 0.5).\n\n  ```js\n  blossom(\"#000000\").dark; // -\u003e true\n  blossom(\"#808080\").dark; // -\u003e false\n  blossom(\"#FFFFFF\").dark; // -\u003e false\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.luminance\u003c/code\u003e, available via \u003cstrong\u003ea11y\u003c/strong\u003e plugin\n  \u003c/summary\u003e\n\n  Returns the relative luminance of a color, normalized to range [0, 1] as from pure black to pure white according to [WCAG 2.0](https://www.w3.org/TR/WCAG20/#relativeluminancedef).\n\n  ```js\n  blossom(\"#000000\").luminance; // 0\n  blossom(\"#808080\").luminance; // 0.22\n  blossom(\"#ffffff\").luminance; // 1\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.contrast(color = \"#FFF\")\u003c/code\u003e, available via \u003cstrong\u003ea11y\u003c/strong\u003e plugin\n  \u003c/summary\u003e\n\n  Calculates a contrast ratio for a pair of colors.\n  \n  The luminance difference lies in range [1 (white on white), 21 (black on white)]. [WCAG](https://webaim.org/articles/contrast/) required a ratio at least 4.5 for normal text and 3:1 for large one.\n\n  ```js\n  blossom(\"#000000\").contrast(); // 21 (black on white)\n  blossom(\"#ffffff\").contrast(\"#000000\"); // 21 (white on black)\n  blossom(\"#777777\").contrast(); // 4.47 (gray on white)\n  blossom(\"#ff0000\").contrast(); // 3.99 (red on white)\n  blossom(\"#0000ff\").contrast(\"#ff000\"); // 2.14 (blue on red)\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.readable(color = \"#FFF\", options?)\u003c/code\u003e, available via \u003cstrong\u003ea11y\u003c/strong\u003e plugin\n  \u003c/summary\u003e\n\n  Checks that a background and text color pair is readable according to [WCAG 2.0 Contrast and Color Requirements](https://webaim.org/articles/contrast/).\n\n  ```js\n  blossom(\"#000000\").isReadable(); // true (normal black text on white bg conforms to WCAG AA)\n  blossom(\"#777777\").isReadable(); // false (normal gray text on white bg conforms to WCAG AA)\n  blossom(\"#ffffff\").isReadable(\"#000000\"); // true (normal white text on black bg conforms to WCAG AA)\n  blossom(\"#e60000\").isReadable(\"#ffff47\", { level: \"AAA\" }); // false (normal red text on yellow bg does not conform to WCAG AAA)\n  blossom(\"#e60000\").isReadable(\"#ffff47\", { level: \"AAA\", size: \"large\" }); // true (large red text on yellow bg conforms to WCAG AAA)\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.mix(color, ratio = 0.5)\u003c/code\u003e, available via \u003cstrong\u003emix\u003c/strong\u003e plugin\n  \u003c/summary\u003e\n\n  Produces a mixture of two colors and returns the result as new `Blossom` instance. Mix produced using [CIE LAB](https://en.wikipedia.org/wiki/CIELAB_color_space) color space.\n\n  ```js\n  import { colord, extend } from \"blossom\";\n  import pluginMix from \"@ericrovell/blossom/plugins/mix\";\n\n  extend([ mixPlugin ]);\n\n  blossom(\"#FFFFFF\").mix(\"#000000\").hex; // -\u003e \"#777777\"\n  blossom(\"#800080\").mix(\"#DDA0DD\").hex; // -\u003e \"#AF5CAE\"\n  blossom(\"#CD853F\").mix(\"#EEE8AA\", 0.6).hex; // -\u003e \"#E3C07E\"\n  blossom(\"#008080\").mix(\"#808000\", 0.35).hex; // -\u003e \"#50805D\"\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e.delta(color = \"#FFF\")\u003c/code\u003e, available via \u003cstrong\u003eLAB\u003c/strong\u003e plugin\n  \u003c/summary\u003e\n\n  Calculates the perceived color difference between two colors.\n  The difference calculated according to [Delta E2000](https://en.wikipedia.org/wiki/Color_difference#CIEDE2000).\n\n  Returns the normalized value in range from [0, 1], where 0 means the same colors and 1 are completely different ones.\n\n  ```js\n  colord(\"#3296fa\").delta(\"#197dc8\") // 0.099\n  colord(\"#faf0c8\").delta(\"#fff\") // 0.148\n  colord(\"#afafaf\").delta(\"#b4b4b4\") // 0.014\n  colord(\"#000\").delta(\"#fff\") // 1.0\n  ```\n\n\u003c/details\u003e\n\n### Color Utilities\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003erandom()\u003c/code\u003e\n  \u003c/summary\u003e\n\n  Creates new instance with a random color.\n\n  ```js\n  import { random } from \"@ericrovell/blossom\";\n\n  random().hex; // -\u003e \"#01C8EC\"\n  random().setAlpha(0.5).rgb; // -\u003e { r: 13, g: 237, b: 162, a: 0.5 }\n  ```\n\u003c/details\u003e\n\n## Plugins\n\n### Usage\n\nTo extend the functionality using plugins, the `extend` function should be used:\n\n```js\nimport { blossom, extend } from \"@ericrovell/blossom\";\nimport { plugin1, plugin2 } from \"plugin-path;\n\nextend([\n  plugin1,\n  plugin2\n]);\n```\n\n### Included plugins\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e\n      Harmonies\n    \u003c/code\u003e\n  \u003c/summary\u003e\n\n  Provides functionatity to generate [harmony colors](https://en.wikipedia.org/wiki/Harmony_(color)).\n\n  Available harmony pallets:\n\n  - analogous;\n  - complimentary;\n  - double-split-comlimentary;\n  - rectangle;\n  - tetradic;\n  - triadic;\n  - split-complimentary;\n\n  ```js\n  import { blossom, extends } from \"@ericrovell/blossom\";\n  import { pluginHarmonies } from \"blossom/plugins/harmonies\";\n\n  extend([ pluginHarmonies ]);\n\n  const color = blossom(\"FF0000\");\n\n  color.harmonies(\"analogous\")\n    .map(color =\u003e color.hex); // -\u003e [ \"#FF0080\", \"#FF0000\", \"#FF8000\"]\n  color.harmonies(\"complimentary\")\n    .map(color =\u003e color.hex); // -\u003e [ \"#FF0000\", \"#00FFFF\" ]\n  color.harmonies(\"double-split-complimentary\")\n    .map(color =\u003e color.hex); // -\u003e [ \"#FF0080\", \"#FF0000\", \"#FF8000\", \"#00FF80\", \"#0080FF\" ]\n  color.harmonies(\"rectangle\")\n    .map(color =\u003e color.hex); // -\u003e [ \"#FF0000\", \"#FFFF00\", \"#00FFFF\", \"#0000FF\" ]\n  color.harmonies(\"tetradic\")\n    .map(color =\u003e color.hex); // -\u003e [ \"#FF0000\", \"#80FF00\", \"#00FFFF\", \"#8000FF\" ]\n  color.harmonies(\"triadic\"  )\n    .map(color =\u003e color.hex); // -\u003e [ \"#FF0000\", \"#00FF00\", \"#0000FF\" ]\n  color.harmonies(\"split-complimentary\")\n    .map(color =\u003e color.hex); // -\u003e [ \"#FF0000\", \"#00FF80\", \"#0080FF\" ]\n  ```\n\n  Harmony color schemes type is available for import:\n\n  ```ts\n  import type { Harmony } from \"@ericrovell/blossom/plugins/harmonies\";\n  \n  const harmony: Harmony = \"analogous\";\n  const notHarmony: Harmony = \"round\"; // TypeError\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e\n      Monochromatic\n    \u003c/code\u003e\n  \u003c/summary\u003e\n\n  Provides functionatity to generate [monochromatic colors](https://en.wikipedia.org/wiki/Monochromatic_color) as:\n\n  - Tints;\n  - Shades;\n  - Tones.\n\n  ```js\n  import { blossom, extends } from \"@ericrovell/blossom\";\n  import { pluginMonochromatic } from \"blossom/plugins/monochromatic\";\n\n  extend([ pluginMonochromatic ]);\n\n  const color = blossom(\"FF0000\");\n\n  color.tints(4).map(tint =\u003e tint.hex); // -\u003e [ \"#FF0000\", \"#FF4242\", \"#FF8585\", \"#FFC7C7\", \"#FFFFFF\" ]\n  color.shades(4).map(shade =\u003e shade.hex); // -\u003e [ \"#FF0000\", \"#BD0000\", \"#7A0000\", \"#380000\", \"#000000\" ]\n  color.tones(4).map(tone =\u003e tone.hex); // -\u003e [ \"#FF0000\", \"#DF2020\", \"#BF4040\", \"#9F6060\", \"#808080\" ]\n  ```\n\n  The original color is always included as first palette item.\n\n  If there is not enough space between colors to generate **required** number of colors, less number of colors will be generated. For example, generating 10 shades for `#050505` is not practical as `#000000` is too close and all shades will be indistinguishable:\n\n  ```js\n  import { blossom, extends } from \"@ericrovell/blossom\";\n  import { pluginMonochromatic } from \"blossom/plugins/monochromatic\";\n\n  extend([ pluginMonochromatic ]);\n\n  blossom(\"#FAFAFA\").tints(10).map(tint =\u003e tint.hex); // -\u003e [ \"#FAFAFA\", \"#FDFDFD\", \"#FFFFFF\" ]\n  blossom(\"#050505\").shades(10).map(shade =\u003e shade.hex); // -\u003e [ \"#050505\", \"#020202\", \"#000000\" ]\n  blossom(\"#827D7D\").tones(10).map(tone =\u003e tone.hex); // -\u003e [ \"#827D7D\", \"#817E7E\", \"#808080\" ]\n  ```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e\n      A11Y (Accessibility)\n    \u003c/code\u003e\n  \u003c/summary\u003e\n\n  Adds accessibility and color contrast utilities working according to [Web Content Accessibility Guidelines 2.0](https://www.w3.org/TR/WCAG20/).\n\n  ```js\n  import { blossom, extend } from \"@ericrovell/blossom\";\n  import { pluginA11Y } from \"@ericrovell/blossom/plugins/a11y\";\n\n  extend([ pluginA11Y ]);\n\n  blossom(\"#000000\").luminance; // 0\n  blossom(\"#CCDDEE\").luminance; // 0.71\n  blossom(\"#FFFFFF\").luminance; // 1\n\n  blossom(\"#000000\").contrast(); // 21 (black on white)\n  blossom(\"#FFFFFF\").contrast(\"#000000\"); // 21 (white on black)\n  blossom(\"#0000ff\").contrast(\"#FF000\"); // 2.14 (blue on red)\n\n  blossom(\"#000000\").readable(); // true (black on white)\n  blossom(\"#FFFFFF\").readable(\"#000000\"); // true (white on black)\n  blossom(\"#777777\").readable(); // false (gray on white)\n  blossom(\"#E60000\").readable(\"#FFFF47\"); // true (normal red text on yellow bg conforms to WCAG AA)\n  blossom(\"#E60000\").readable(\"#FFFF47\", { level: \"AAA\" }); // false (normal red text on yellow bg does not conform to WCAG AAA)\n  blossom(\"#E60000\").readable(\"#FFFF47\", { level: \"AAA\", size: \"large\" }); // true (large red text on yellow bg conforms to WCAG AAA)\n  ```\n\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e\n      XYZ (CIE XYZ Color space)\n    \u003c/code\u003e\n  \u003c/summary\u003e\n\n  Adds support of [CIE XYZ](https://www.sttmedia.com/colormodel-xyz) color model.\n\n  ```js\n  import { blossom, extend } from \"@ericrovell/blossom\";\n  import { pluginXYZ } from \"@ericrovell/blossom/plugins/xyz\";\n\n  extend([ pluginXYZ ]);\n\n  blossom(\"#FFFFFF\").xyz; // -\u003e { x: 95.047, y: 100, z: 108.883, a: 1 }\n  blossom({ x: 0, y: 0, z: 0 }).hex; // -\u003e \"#000000\"\n  ```\n\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e\n      LAB (CIE LAB Color space)\n    \u003c/code\u003e\n  \u003c/summary\u003e\n\n  Adds support of [CIE LAB](https://en.wikipedia.org/wiki/CIELAB_color_space) color model.\n  Plugin provides `.delta` method for perceived color difference calculations: 0 for same colors, 1 for completely different ones.\n\n  ```js\n  import { blossom, extend } from \"@ericrovell/blossom\";\n  import { pluginLAB } from \"@ericrovell/blossom/plugins/lab\";\n\n  extend([ pluginLAB ]);\n\n  blossom({ l: 29.95, a: 29.48, b: -72.93 }).hex; // \"#123ABC\"\n  blossom(\"#FFFFFF\").lab; // { l: 100, a: 0, b: 0, alpha: 1 }\n  \n  blossom(\"#afafaf\").delta(\"#b4b4b4\") // 0.014\n  blossom(\"#000\").delta(\"#fff\") // 1.0\n  ```\n\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e\n      LCH (CIE LCH Color space)\n    \u003c/code\u003e\n  \u003c/summary\u003e\n\n  Adds support of [CIE LCH](https://lea.verou.me/2020/04/lch-colors-in-css-what-why-and-how/) color model.\n\n  ```js\n  import { blossom, extend } from \"@ericrovell/blossom\";\n  import { pluginLCH } from \"@ericrovell/blossom/plugins/lch\";\n\n  extend([ pluginLCH ]);\n\n  blossom({ l: 29.95, a: 29.48, b: 40.21 }).hex; // \"#6B372A\"\n  blossom(\"#FFFFFF\").lab; // { l: 100, c: 0, h: 0, a: 1 }\n  ```\n\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e\n      HWB\n    \u003c/code\u003e\n  \u003c/summary\u003e\n\n  Adds support of [HWB](https://en.wikipedia.org/wiki/HWB_color_model) color model.\n\n  ```js\n  import { blossom, extend } from \"@ericrovell/blossom\";\n  import { pluginHWB } from \"@ericrovell/blossom/plugins/hwb\";\n\n  extend([ pluginHWB ]);\n\n  blossom({h: 236, w: 33, b: 33 }).hex; // \"#555AAA\"\n  blossom(\"#FFFFFF\").hwb; // { h: 0, w: 100, b: 0 }\n  ```\n\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e\n      Mix\n    \u003c/code\u003e\n  \u003c/summary\u003e\n\n  Adds support for mixing colors. Mixture is produced using [CIE LAB](https://en.wikipedia.org/wiki/CIELAB_color_space) color space.\n\n  ```js\n  import { colord, extend } from \"blossom\";\n  import pluginMix from \"@ericrovell/blossom/plugins/mix\";\n\n  extend([ mixPlugin ]);\n\n  blossom(\"#FFFFFF\").mix(\"#000000\").hex; // -\u003e \"#777777\"\n  blossom(\"#800080\").mix(\"#DDA0DD\").hex; // -\u003e \"#AF5CAE\"\n  blossom(\"#CD853F\").mix(\"#EEE8AA\", 0.6).hex; // -\u003e \"#E3C07E\"\n  blossom(\"#008080\").mix(\"#808000\", 0.35).hex; // -\u003e \"#50805D\"\n  ```\n\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003ccode\u003e\n      Names\n    \u003c/code\u003e\n  \u003c/summary\u003e\n\n  Adds support for a list of 140 named colors supported by all modern browsers.\n\n  ```js\n  import { colord, extend } from \"blossom\";\n  import pluginNames from \"@ericrovell/blossom/plugins/names\";\n\n  extend([ pluginNames ]);\n  \n  blossom(\"white\").hex           // -\u003e \"#FFFFFF\"\n  blossom(\"red\").hex             // -\u003e \"#FF0000\"\n  blossom(\"#FF0000\").name        // -\u003e \"red\"\n  blossom(\"#ABC123\").name        // -\u003e null\n  blossom(\"#FF0101\").closestName // -\u003e \"red\"\n  blossom(\"#66339A\").closestName // -\u003e \"rebeccapurple\"\n  ```\n\n\u003c/details\u003e\n\n## Types\n\nBlossom is written in strict TypeScript and ships with types in the library itself.\n\nWhile not only typing its own functions and variables, you can also type yours. Depending on the color space you are using, the types can be also imported and used to type the code.\n\n```js\nimport type { ColorRGB, ColorHSL } from \"@ericrovell/blossom\";\n\nconst foo: ColorHSL = { h: 0, s: 0, l: 0 };\nconst bar: ColorRGB = { r: 0, g: 0, v: 0 }; // type error!\n```\n\n## Extending the functionality\n\nTo extend functionality for your needs, just extend the `Blossom` class:\n\n```ts\nimport { Blossom } from \"@ericrovell/blossom\";\n\nclass BlossomExtended extends Blossom {\n  constructor(input?) {\n\t\tsuper(input);\n\t}\n\n  get red() {\n    return this.color.r;\n  }\n}\n\nconst extended = new BlossomExtended(\"#FF0000\");\nextended.red // -\u003e 255;\n```\n\n## Inspiration\n\nIt was a long time I was thinking about this project. There were two unsuccessfull attemps, it was not thoughfull enough.\n\nThis project is inspired by fantastic [colord](https://github.com/omgovich/colord) project, that gave me the idea about architecture and implementation.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fericrovell%2Fblossom","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fericrovell%2Fblossom","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fericrovell%2Fblossom/lists"}