0.3.4 • Public • Published


    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.


    npm install color-of


    const colorOf = require('color-of');
    colorOf('banana', options) // returns a promise
    .then(color => console.log(color.hex())) // resolves to a ( 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


    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 = {
      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 = {
      numResults = 30 // max 50 for Bing, no limit for Google



    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.


    Navigate to, 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 This will be your bingApiKey.


    1. Create Google Custom Search Engine (CSE)

    Navigate to 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 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 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.


    npm i color-of

    DownloadsWeekly Downloads






    Last publish


    • avatar