color-of
Library for finding the the most representative color of a given search term. Matches to the nearest color of the provided palette. Uses either Google Custom Search Engine API or Microsoft Cognitive Services.
Installation
npm install color-of
Usage
const colorOf = ; // returns a promise // resolves to a (npmjs.com/package/color) object
Options object
The options object must include API information for either Google or Bing. Both services provide a limited number of uses for free. Instructions here.
Required properties:
googleCseId
googleApiKey
const options = googleCseId: 'adb85cb75d71403cba06e1783b28b414' // replace with valid key googleApiKey: 'adb85cb75d71403cba06e1783b28b414' // replace with valid key;
Bing
Required properties:
bingApiKey
const options = bingApiKey: 'adb85cb75d71403cba06e1783b28b414' // replace with valid key;
Color Palette
This library will match search terms to the nearest color in the provided palette. The palette
property expects an array of colors, which can be formatted as css color strings or objects. Really, anything that is accepted as a constructor to the Qix- color package.
Palette Name | Description | Source |
---|---|---|
'material' | Google's material design palette (default brightness) | Link |
'w3c' | The W3C color palette | Link |
'css' | The palette of all valid CSS color strings | Link |
const options = bingApiKey palette: 'rgb(255,0,0)' 'rgb(0,255,0)' 'rgb(0,0,255)' // or 'w3c' // or 'css' // or [ '#ff0000', '00ff00', '0000ff' ] // or [ 'hsl(0,100%,50%)', 'hsl(120,100%,50%)', 'hsl(240,100%,50%)' ] // or [ 'red', 'green', 'blue' ] // or [ { h: 0, s: 100, v: 100 }, { h: 120, s: 100, v: 100 }, { h: 240, s: 100, v: 100 } ] // ..etc;
Number of Search Results
By default, the first 50 image results are used in determining the closest color match. If you would like to match on a smaller number of images, provide this number in the numResults
property
Bing only returns the first 50 image results. Google, on the other hand, will return 10 per API request. This means that a numResults = 50 will chew up 5 Google API requests.
const options = bingApiKey numResults = 30 // max 50 for Bing, no limit for Google;
Building
Testing
Add your own API keys for Google and Bing in test/inputs/secret.js. Follow the example file there.
To run the mocha tests:
npm run test
Getting API Keys
Below are details on how to get free search API keys for either Google or Bing.
Bing
Navigate to azure.microsoft.com/en-us/try/cognitive-services/, switch to the 'Search' tab, and select 'Get API Key' for Bing Search APIs. Login with any of the providers and your keys will be listed at https://azure.microsoft.com/en-us/try/cognitive-services/my-apis/. This will be your bingApiKey
.
1. Create Google Custom Search Engine (CSE)
Navigate to cse.google.com/cse and add a search engine.
When creating, do not specify a URL in the 'Sites to search' section. In the 'Advanced' dropdown, enter 'Thing' as the Schema.org type.
After created, go to the control panel for your search engine and get the search engine ID in the 'Details' section. This is your googleCseId
.
2. Enable image search for your CSE
In the control panel for your CSE, right below your search engine ID, switch 'Image search' to ON.
3. Create API for your CSE
Navigate to console.developers.google.com and create a new project with any name.
In 'Enable APIs and Services', search "custom search API" and enable it for the project.
In the 'Credentials' section, the API key will be your googleApiKey
.