{"_id":"react-extract-colors","_rev":"7-7519039b3cf4a9738bba365b788c96d1","name":"react-extract-colors","dist-tags":{"latest":"1.6.0"},"versions":{"1.0.0":{"name":"react-extract-colors","version":"1.0.0","author":{"name":"Jesús Aguilar"},"license":"MIT","_id":"react-extract-colors@1.0.0","maintainers":[{"name":"jesus-aguilar","email":"aguilaraliagajesus@gmail.com"}],"homepage":"https://github.com/JesusAguilarAliaga/react-extract-colors#readme","bugs":{"url":"https://github.com/JesusAguilarAliaga/react-extract-colors/issues"},"dist":{"shasum":"5604e74229384db3c0285725f2ff8c9c16834d2a","tarball":"https://registry.npmjs.org/react-extract-colors/-/react-extract-colors-1.0.0.tgz","fileCount":4,"integrity":"sha512-zwIUG4FurTDVomcBSC+Yl6zsjG3i370SpY8XaKWviX1PJOe0ypYJIfAw4WXoxLBcHdjjCHr4QmrUf4s4pr6nRA==","signatures":[{"sig":"MEYCIQDWzrDa76sllp0NSOZHDw0Td90oFZrwCvYrIhUSOpOeyAIhAIhDpnxZizqAzUPgHVtMPf3pc4up1M9Msv66jpthk1Pv","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":10857},"main":"dist/index.js","type":"module","gitHead":"859d342d085c29cb16912bef42f6452e6af7e285","scripts":{"build":"rollup -c --environment NODE_ENV:production","build:dev":"rollup -c --environment NODE_ENV:development"},"_npmUser":{"name":"jesus-aguilar","email":"aguilaraliagajesus@gmail.com"},"repository":{"url":"git+https://github.com/JesusAguilarAliaga/react-extract-colors.git","type":"git"},"_npmVersion":"10.2.3","description":"A react component to extract dominant colors from an image","directories":{},"_nodeVersion":"20.10.0","dependencies":{"react":"^18.2.0","react-dom":"^18.2.0"},"_hasShrinkwrap":false,"devDependencies":{"rollup":"^4.9.4","@rollup/plugin-terser":"^0.4.4"},"_npmOperationalInternal":{"tmp":"tmp/react-extract-colors_1.0.0_1705036691384_0.43049834870559955","host":"s3://npm-registry-packages"}},"1.0.1":{"name":"react-extract-colors","version":"1.0.1","keywords":["extract colors","image","dominant colors","react","reactjs","react-component"],"author":{"name":"Jesús Aguilar"},"license":"MIT","_id":"react-extract-colors@1.0.1","maintainers":[{"name":"jesus-aguilar","email":"aguilaraliagajesus@gmail.com"}],"homepage":"https://github.com/JesusAguilarAliaga/react-extract-colors#readme","bugs":{"url":"https://github.com/JesusAguilarAliaga/react-extract-colors/issues"},"dist":{"shasum":"a73e160235d31e92ecc5c8f8e058737282bb6303","tarball":"https://registry.npmjs.org/react-extract-colors/-/react-extract-colors-1.0.1.tgz","fileCount":4,"integrity":"sha512-KFRBXO8axOZgh7VdZaKSouh34Y9FNa3Rn9tSRk4BTyGH1y0RVFlRGsT+G/cwZfJACZW4qleB3Y/k/GEKApBX2w==","signatures":[{"sig":"MEUCIHJ+GFgciEKXokTngSTog1N8fSocgJ9TmaXrx0sgFk0wAiEAlkoPbuz4AAH+I83bBJL6VKB/pEg6jA7b9g/NbKYGtNU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":10958},"main":"dist/index.js","type":"module","gitHead":"859d342d085c29cb16912bef42f6452e6af7e285","scripts":{"build":"rollup -c --environment NODE_ENV:production","build:dev":"rollup -c --environment NODE_ENV:development"},"_npmUser":{"name":"jesus-aguilar","email":"aguilaraliagajesus@gmail.com"},"repository":{"url":"git+https://github.com/JesusAguilarAliaga/react-extract-colors.git","type":"git"},"_npmVersion":"10.2.3","description":"A react component to extract dominant colors from an image","directories":{},"_nodeVersion":"20.10.0","dependencies":{"react":"^18.2.0","react-dom":"^18.2.0"},"_hasShrinkwrap":false,"devDependencies":{"rollup":"^4.9.4","@rollup/plugin-terser":"^0.4.4"},"_npmOperationalInternal":{"tmp":"tmp/react-extract-colors_1.0.1_1705038315901_0.7542086475751009","host":"s3://npm-registry-packages"}},"1.0.2":{"name":"react-extract-colors","version":"1.0.2","keywords":["extract colors","image","dominant colors","react","reactjs","react-component"],"author":{"name":"Jesús Aguilar"},"license":"MIT","_id":"react-extract-colors@1.0.2","maintainers":[{"name":"jesus-aguilar","email":"aguilaraliagajesus@gmail.com"}],"homepage":"https://github.com/JesusAguilarAliaga/react-extract-colors#readme","bugs":{"url":"https://github.com/JesusAguilarAliaga/react-extract-colors/issues"},"dist":{"shasum":"4299ae9ec63fea7f96c24b70fe7025c43c43bbf7","tarball":"https://registry.npmjs.org/react-extract-colors/-/react-extract-colors-1.0.2.tgz","fileCount":4,"integrity":"sha512-TbJj+MgLZ5y9bQWf2rxcw+D3QoxF5GoFdWcCJGFSHvf2rwkZHg7Ofv/uXSxDr71Fz7ZkKQPWsXUWdAqPibNbjw==","signatures":[{"sig":"MEUCIQDnn0GwoDkbvLcMJ/Ah5/o2e6M3D0lY5oT8HNWanU79AAIgCsZXO+DSBH5nH8rZ2u5a9EAAfL6cKGLeQ2toMRgLS+Y=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":10956},"main":"dist/index.js","type":"module","gitHead":"859d342d085c29cb16912bef42f6452e6af7e285","scripts":{"build":"rollup -c --environment NODE_ENV:production","build:dev":"rollup -c --environment NODE_ENV:development"},"_npmUser":{"name":"jesus-aguilar","email":"aguilaraliagajesus@gmail.com"},"repository":{"url":"git+https://github.com/JesusAguilarAliaga/react-extract-colors.git","type":"git"},"_npmVersion":"10.2.3","description":"A react component to extract dominant colors from an image","directories":{},"_nodeVersion":"20.10.0","dependencies":{"react":"^18.2.0","react-dom":"^18.2.0"},"_hasShrinkwrap":false,"devDependencies":{"rollup":"^4.9.4","@rollup/plugin-terser":"^0.4.4"},"_npmOperationalInternal":{"tmp":"tmp/react-extract-colors_1.0.2_1705089551799_0.18253155742786098","host":"s3://npm-registry-packages"}},"1.0.3":{"name":"react-extract-colors","version":"1.0.3","keywords":["extract colors","image","dominant colors","react","reactjs","react-component"],"author":{"name":"Jesús Aguilar"},"license":"MIT","_id":"react-extract-colors@1.0.3","maintainers":[{"name":"jesus-aguilar","email":"aguilaraliagajesus@gmail.com"}],"homepage":"https://github.com/JesusAguilarAliaga/react-extract-colors#readme","bugs":{"url":"https://github.com/JesusAguilarAliaga/react-extract-colors/issues"},"dist":{"shasum":"f238b08b94aedd54804684f4116f22076190b4c9","tarball":"https://registry.npmjs.org/react-extract-colors/-/react-extract-colors-1.0.3.tgz","fileCount":4,"integrity":"sha512-yqWS9CbiCwTIXiLAfXc7Cv1gm1lGFi69QRoIU5akNDQg3iEGX17+qlP/xR3T3wAT5bXtr0TA9gLnOxfjNiiw9g==","signatures":[{"sig":"MEYCIQD3xCfQa42DvOWp3mSMYLWeWuNNS6tTmyjnZBqX2jKylgIhALAepr8FKjC1ZXXx8WLMpIfqQGyF7ehsFkieRpAPHtLj","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":11047},"main":"dist/index.js","type":"module","gitHead":"859d342d085c29cb16912bef42f6452e6af7e285","scripts":{"build":"rollup -c --environment NODE_ENV:production","build:dev":"rollup -c --environment NODE_ENV:development"},"_npmUser":{"name":"jesus-aguilar","email":"aguilaraliagajesus@gmail.com"},"repository":{"url":"git+https://github.com/JesusAguilarAliaga/react-extract-colors.git","type":"git"},"_npmVersion":"10.2.3","description":"A react component to extract dominant colors from an image","directories":{},"_nodeVersion":"20.10.0","dependencies":{"react":"^18.2.0","react-dom":"^18.2.0"},"_hasShrinkwrap":false,"devDependencies":{"rollup":"^4.9.4","@rollup/plugin-terser":"^0.4.4"},"_npmOperationalInternal":{"tmp":"tmp/react-extract-colors_1.0.3_1705470711494_0.05470218767220647","host":"s3://npm-registry-packages"}},"1.5.0":{"name":"react-extract-colors","version":"1.5.0","keywords":["extract colors","image","dominant colors","react","reactjs","react-component","react colors"],"author":{"name":"Jesús Aguilar"},"license":"MIT","_id":"react-extract-colors@1.5.0","maintainers":[{"name":"jesus-aguilar","email":"aguilaraliagajesus@gmail.com"}],"homepage":"https://github.com/JesusAguilarAliaga/react-extract-colors#readme","bugs":{"url":"https://github.com/JesusAguilarAliaga/react-extract-colors/issues"},"dist":{"shasum":"b77f3bd6ef1331e91cc4fcc0e14968f8219c6e0e","tarball":"https://registry.npmjs.org/react-extract-colors/-/react-extract-colors-1.5.0.tgz","fileCount":13,"integrity":"sha512-mNT/cPCkdiZRYa1Pxp+u4kiuymznZ52IrLj8xLqDUTe6XLJwuO7hbVDLbCgM4gfebhijqDGSn+dmejRbEi0MZw==","signatures":[{"sig":"MEYCIQCVtdNtDX9VZPuj3qvJV5CBf3VbptppZ+8rorBq/I9xYAIhAIDm3sqmaZJgFkDYyGxY/LhvvgFdmMZA7Ebfah0JroUb","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":19540},"main":"dist/index.cjs.js","type":"module","types":"dist/types/index.d.ts","module":"dist/index.esm.js","exports":{".":{"types":"./dist/types/index.d.ts","import":"./dist/index.esm.js","require":"./dist/index.cjs.js"}},"gitHead":"1faa41770e82933f004a5e2f9380b88950c0b26c","scripts":{"lint":"biome lint","build":"rollup -c --environment NODE_ENV:production","format":"biome format --write","build:dev":"rollup -c --environment NODE_ENV:development"},"_npmUser":{"name":"jesus-aguilar","email":"aguilaraliagajesus@gmail.com"},"repository":{"url":"git+https://github.com/JesusAguilarAliaga/react-extract-colors.git","type":"git"},"_npmVersion":"10.8.2","description":"A react component to extract dominant colors from an image","directories":{},"_nodeVersion":"20.17.0","_hasShrinkwrap":false,"devDependencies":{"tslib":"^2.7.0","rollup":"^4.9.4","typescript":"^5.6.2","@types/react":"^18.3.8","@biomejs/biome":"1.9.3","@types/react-dom":"^18.3.0","@rollup/plugin-terser":"^0.4.4","@rollup/plugin-commonjs":"^28.0.0","@rollup/plugin-typescript":"^12.1.0","@rollup/plugin-node-resolve":"^15.3.0","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"react":">=17.0.0","react-dom":">=17.0.0"},"_npmOperationalInternal":{"tmp":"tmp/react-extract-colors_1.5.0_1728776931774_0.6144473431673061","host":"s3://npm-registry-packages"}},"1.5.1":{"name":"react-extract-colors","version":"1.5.1","keywords":["extract colors","image","dominant colors","react","reactjs","react-component","react colors"],"author":{"name":"Jesús Aguilar"},"license":"MIT","_id":"react-extract-colors@1.5.1","maintainers":[{"name":"jesus-aguilar","email":"aguilaraliagajesus@gmail.com"}],"homepage":"https://github.com/JesusAguilarAliaga/react-extract-colors#readme","bugs":{"url":"https://github.com/JesusAguilarAliaga/react-extract-colors/issues"},"dist":{"shasum":"32a847a6b528af2ca6119aa4a2e75bdbc8d8b231","tarball":"https://registry.npmjs.org/react-extract-colors/-/react-extract-colors-1.5.1.tgz","fileCount":13,"integrity":"sha512-TlB/DHMMObnA8uGdoRcx1KEbZ87cEp2AE8n6r/1fe5vcaXn13rg73SiupReViNX4EkTe/bJPiMv0pHPV9DHcXQ==","signatures":[{"sig":"MEQCIAasriNT6eXFwPreJcdehJHzLQDcpra2FnfNCtfrWrxsAiByOX4TJ3NoF9ePQ4Be/9Z+hj/I4zq1DcocsV7Cls1m+A==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":21023},"main":"dist/index.cjs.js","type":"module","types":"dist/types/index.d.ts","module":"dist/index.esm.js","exports":{".":{"types":"./dist/types/index.d.ts","import":"./dist/index.esm.js","require":"./dist/index.cjs.js"}},"gitHead":"ac5975f7b43febe052baa62cf958ab568a476e34","scripts":{"lint":"biome lint","build":"rollup -c --environment NODE_ENV:production","format":"biome format --write","build:dev":"rollup -c --environment NODE_ENV:development"},"_npmUser":{"name":"jesus-aguilar","email":"aguilaraliagajesus@gmail.com"},"repository":{"url":"git+https://github.com/JesusAguilarAliaga/react-extract-colors.git","type":"git"},"_npmVersion":"10.8.2","description":"A react component to extract dominant colors from an image","directories":{},"_nodeVersion":"20.17.0","_hasShrinkwrap":false,"devDependencies":{"tslib":"^2.7.0","rollup":"^4.9.4","typescript":"^5.6.2","@types/react":"^18.3.8","@biomejs/biome":"1.9.3","@types/react-dom":"^18.3.0","@rollup/plugin-terser":"^0.4.4","@rollup/plugin-commonjs":"^28.0.0","@rollup/plugin-typescript":"^12.1.0","@rollup/plugin-node-resolve":"^15.3.0","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"react":">=17.0.0","react-dom":">=17.0.0"},"_npmOperationalInternal":{"tmp":"tmp/react-extract-colors_1.5.1_1728778727439_0.9924587473808124","host":"s3://npm-registry-packages"}},"1.6.0":{"name":"react-extract-colors","version":"1.6.0","type":"module","description":"A react component to extract dominant colors from an image","main":"dist/index.cjs.js","module":"dist/index.esm.js","types":"dist/types/index.d.ts","exports":{".":{"types":"./dist/types/index.d.ts","import":"./dist/index.esm.js","require":"./dist/index.cjs.js"}},"scripts":{"build:dev":"rollup -c --environment NODE_ENV:development","build":"rollup -c --environment NODE_ENV:production","format":"biome format --write","lint":"biome lint"},"author":{"name":"Jesús Aguilar"},"license":"MIT","keywords":["extract colors","image","dominant colors","react","reactjs","react-component","react colors"],"repository":{"type":"git","url":"git+https://github.com/JesusAguilarAliaga/react-extract-colors.git"},"homepage":"https://react-extract-colors.netlify.app","bugs":{"url":"https://github.com/JesusAguilarAliaga/react-extract-colors/issues"},"devDependencies":{"@biomejs/biome":"1.9.3","@rollup/plugin-commonjs":"^28.0.0","@rollup/plugin-node-resolve":"^15.3.0","@rollup/plugin-terser":"^0.4.4","@rollup/plugin-typescript":"^12.1.0","@types/react":"^18.3.8","@types/react-dom":"^18.3.0","rollup":"^4.9.4","rollup-plugin-peer-deps-external":"^2.2.4","tslib":"^2.7.0","typescript":"^5.6.2"},"peerDependencies":{"react":">=17.0.0","react-dom":">=17.0.0"},"gitHead":"77c9216a4865e55d76afc582370d7f1f2432f1bc","_id":"react-extract-colors@1.6.0","_nodeVersion":"22.16.0","_npmVersion":"11.8.0","dist":{"integrity":"sha512-6ReQd9AYGhuusYFhZ1bX2YKM5rnSzn8RjLfCrHoNsK1FuddceoGexEtwLXDNyMm/tG4XGO3JDuA3VG29dyb1qw==","shasum":"907bb9a632a9968d62c90537462e12e21b03fa16","tarball":"https://registry.npmjs.org/react-extract-colors/-/react-extract-colors-1.6.0.tgz","fileCount":9,"unpackedSize":19755,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQC3KT1LPOIeuSRikUJjt3Kcn+e13cx06AsQ5Ha5MoDqYgIhAO6VohB3a4fqcKxgzJsIT8JEBTQWd8LvU3/VJpKnd6gK"}]},"_npmUser":{"name":"jesus-aguilar","email":"aguilaraliagajesus@gmail.com"},"directories":{},"maintainers":[{"name":"jesus-aguilar","email":"aguilaraliagajesus@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/react-extract-colors_1.6.0_1769986734674_0.13924733679029466"},"_hasShrinkwrap":false}},"time":{"created":"2024-01-12T05:18:11.383Z","modified":"2026-02-01T22:58:54.948Z","1.0.0":"2024-01-12T05:18:11.522Z","1.0.1":"2024-01-12T05:45:16.034Z","1.0.2":"2024-01-12T19:59:11.979Z","1.0.3":"2024-01-17T05:51:51.650Z","1.5.0":"2024-10-12T23:48:51.964Z","1.5.1":"2024-10-13T00:18:47.627Z","1.6.0":"2026-02-01T22:58:54.831Z"},"bugs":{"url":"https://github.com/JesusAguilarAliaga/react-extract-colors/issues"},"author":{"name":"Jesús Aguilar"},"license":"MIT","homepage":"https://react-extract-colors.netlify.app","keywords":["extract colors","image","dominant colors","react","reactjs","react-component","react colors"],"repository":{"type":"git","url":"git+https://github.com/JesusAguilarAliaga/react-extract-colors.git"},"description":"A react component to extract dominant colors from an image","maintainers":[{"name":"jesus-aguilar","email":"aguilaraliagajesus@gmail.com"}],"readme":"<h2 align=\"center\">React Extract Colors</h2>\n\n<div align=\"center\">\n   <p align=\"center\">A react hook to extract dominant colors from an image 🎨<br>\n    </p>\n   <p align=\"center\">\n      <a href=\"https://github.com/JesusAguilarAliaga/react-extract-colors\"><b>Github</b></a> •\n      <a href=\"https://react-extract-colors.netlify.app/\"><b>Examples(Documentation)</b></a>\n   </p>\n   <img src=\"https://i.imgur.com/MfezyZT.jpg\">\n   <br>\n</div>\n\n<h3 align=\"center\">\n   Installation 🚀\n</h3>\n\n<p align=\"center\">Get started with these simple installation steps.</p>\n\n###### Using npm\n\n```bash\nnpm install react-extract-colors\n```\n\n###### Using yarn\n\n```bash\nyarn add react-extract-colors\n```\n\n###### Using pnpm\n\n```bash\npnpm add react-extract-colors\n```\n\nOnce the package is installed, you can import the library using `import` approach:\n\n```js\nimport { useExtractColors } from \"react-extract-colors\";\n```\n\n<h3 align=\"center\">\n   Usage 👨‍💻\n</h3>\n\n- mainly supported image formats: (`png, jpg, jpeg, svg, gif and more...`)\n\nWhen you have an image and you want to extract the dominant color, you can use the hook. The hook returns an object containing various properties.\n\nIf you only need the dominant color, you can use the `dominantColor` property.\n\nYou can also get the darker and lighter variants to create a grandient color.\n\n```js\nimport { useExtractColors } from \"react-extract-colors\";\n\nconst image = \"https://picsum.photos/id/237/200/300\";\n\nconst { colors, dominantColor, darkerColor, lighterColor, loading, error } =\n  useExtractColors(image);\n```\n\n##### Properties 📊\n\n| Property        | Description                                 |\n| :-------------- | :------------------------------------------ |\n| `colors`        | An array containing the top dominant colors |\n| `dominantColor` | The dominant color of the image             |\n| `darkerColor`   | A darker variant of the dominant color      |\n| `lighterColor`  | A lighter variant of the dominant color     |\n| `loading`       | Indicates whether the image is loading      |\n| `error`         | Indicates whether the image has an error    |\n\n<h3 align=\"center\">\n   Example 🌟\n</h3>\n\nExplore a basic example to understand its usage, you can utilize it in various ways.\n\n```js\n// import the hook\nimport { useExtractColors } from \"react-extract-colors\";\n\nconst image = \"https://picsum.photos/id/237/200/300\";\n\nconst App = () => {\n  // Use the hook to extract the dominant color\n  const { dominantColor, darkerColor, lighterColor } = useExtractColors(image);\n\n  return (\n    // set a linear gradient with colors extracted\n    <div\n      style={{\n        backgroundColor: `linear-gradient(45deg, ${dominantColor}, ${darkerColor}, ${lighterColor})`,\n      }}\n    >\n      <h1>Extract Color</h1>\n      <img src={image} alt=\"random image\" width=\"200\" height=\"300\" />\n    </div>\n  );\n};\n\nexport default App;\n```\n\n<h4 align=\"center\">\n   Example with settings ⚙️\n</h4>\n\nYou can also pass settings to the hook, to customize the extraction process.\n\n> **Note:** passing settings to the hook is an optional step.\n\n```js\n// import the hook\nimport { useExtractColors } from \"react-extract-colors\";\n\nconst image = \"https://picsum.photos/id/237/200/300\";\n\nconst App = () => {\n  // Use the hook to extract the dominant color\n  const { colors } = useExtractColors(image, {\n    maxColors: 3,\n    format: \"hex\",\n    maxSize: 200,\n    orderBy: \"vibrance\",\n  });\n\n  const [color1, color2, color3] = colors;\n\n  return (\n    // set the background color to the dominant color\n    <div style={{ border: `1px solid ${color1}` }}>\n      <h1 style={{ color: color3 }}>Extract Color</h1>\n      <img src={image} alt=\"random image\" width=\"200\" height=\"300\" />\n    </div>\n  );\n};\n\nexport default App;\n```\n\n<h3 align=\"center\">\n   Settings ⚙️\n</h3>\n\n#### maxColors:\n\nThe maxColors parameter determines the number of colors to be included in the `colors` array. When you provide an image to the hook, it extracts and counts the colors, returning the most dominant ones based on the specified limit.\n\n> **Note:** While you can retrieve more colors than the recommended limit, use this feature judiciously as its effectiveness varies with each image.\n\n#### format:\n\nYou can specify the color format using one of the following options: `rgba`, `rgb`, `hex`, `hsl`, or `hsv`.\n\n#### maxSize:\n\nThe maxSize is the size at which the image will be processed to extract colors. The smaller the size, the faster the processing may be, but it affects color accuracy to some extent. If you need more precision, you can set a higher value at the expense of sacrificing some speed.\n\n#### colorSimilarityThreshold:\n\nThe `colorSimilarityThreshold` parameter defines the minimum similarity between colors to be considered identical. If you want to avoid retrieving colors that look very similar, you can adjust this value. A threshold of `0` will return all detected colors without filtering for similarity.\n\n#### sortBy:\n\nThe `sortBy` parameter controls the sorting of the returned colors. You can select from the following options:\n\n- **`vibrance`**: Sorts colors by brightness, giving priority to the most vibrant ones.\n- **`dominance`**: Sorts colors based on how frequently they appear in the image.\n\n| Parameter                  | Type     | Description                                                                         | Options (recommended)          |\n| :------------------------- | :------- | :---------------------------------------------------------------------------------- | :----------------------------- |\n| `maxColors`                | `number` | Number of colors to get in the `colors` array **default: 3**                        | 0-100                          |\n| `format`                   | `string` | Format to get the colors **default: rgba**                                          | `rgba` `rgb` `hex` `hsl` `hsv` |\n| `maxSize`                  | `number` | Size to extract the colors **default: 18**                                          | 0-500                          |\n| `colorSimilarityThreshold` | `number` | Minimum similarity threshold for colors to be considered identical. **default: 50** | 0-500                          |\n| `sortBy`                   | `string` | Determines the sorting method for the returned colors **default: dominance**        | `vibrance` `dominance`         |\n\n<h3 align=\"center\">\n   Credits  🙌\n</h3>\n\nThe React Extract Colors hook was created by [Jesús Aguilar](https://github.com/JesusAguilarAliaga)\n\n<h3 align=\"center\">\n   License 📝\n</h3>\n\nLicensed under the [MIT License](LICENSE.md) - see the [LICENSE.md](LICENSE.md) file for details.\n","readmeFilename":"README.md"}