nearest-color package

Want a palette that matches your logo color? Ever need a tool for faster color palettes search? Why bother writing 30 lines of code when nearest-palette is finally published. Install now on npmjs.com or check out the demo on Vibrant Art.

How can this be used?

I created this package to serve the purpose of quicker searching for color palettes and less code in a project that I'm contributing to

You may want to use this tool for other different purposes of yours

• Pick out a color palettes for your outfits to match your favorite jacket/ expensive hand bag/ fancy shoes...

• Choose a color palette for your online business to capture your customer's attention

• Need a palette of which suits your instagram for more likes and followers

• Look for best theme color for your furniture or a paint color that matches your personality...

• Find a theme to best fit your favorite flower Iris for your remarkable wedding...

nearest-color is a tool for quick color palettes search from a list of color palettes with a given color.

Like so:

nearest-palette calculates the distance from query color to every color in the given palettes to find the closest ones and return the top k closest palettes.

Check it out on Github

Quick start

With your own colors:

Provide a list of color palettes in your code and add this package to search for the closest palettes to a given color in hex.

• install nearest-palette package
  

  npm install nearest-palette
  

// import the package into your project where you want to use it
    import nearestPalette from ("nearest-palette");

// add your own collection of colors

    const colors = [ ["#69d2e7", "#a7dbd8", "#e0e4cc"], 
        ["#fe4365", "#fc9d9a", "#f9cdad", "#c8c8a9", "#83af9b"],
        ["#FF00FF", "#cbe86b", "#f2e9e1", "#1c140d"] ];

// define a number of palettes you want
    const k = 2;

// and a target color
    let target = "#FF00FF";

// call nearestPalette() with target, colors and k as its arguments
    const result = nearestPalette(target, colors, k);

// try console.log() to see the result
    console.log(result);

Expected result to be:

    /*
    [ { distance: 0, palette: [ '#FF00FF', '#cbe86b', '#f2e9e1', '#1c140d' ] },{ distance: 167.94642002734085, palette: [ '#fe4365', '#fc9d9a', '#f9cdad', '#c8c8a9', '#83af9b' ] }]
    */

Use nearest-palette with nice-color-palettes

Install nice-color-palettes to have access to thousands of color palettes and search for the closest ones.

• install nearest-palette and nice-color-palettes npm install nearest-palette; npm install nice-color-palettes;

// import the 2 packages where you want to use them
    import nearestPalette = ("nearest-palette);
    const colors = require("nice-color-palettes");

// define your target color and the number of palettes you want to get
    const target = "#FFFF00";
    const k = 2;

// call nearestPalette with target, colors and k
    const result = nearestPalette(target, colors, k);

// console.log() to see result
    nearestPalette(target, colors, k);

Expected result:

/* [{distance: 53.46026561849464, palette: ["#490a3d", "#bd1550", "#8a9b0f", "#e97f02", "#f8ca00"]}, {distance: 55, palette: ["#040004", "#4b000f", "#413d3d", "#fa023c", "#c8ff00" ]}]
*/

Limitations

Currently only support full hex colors. You can't use all CSS colors like: 'red' or '0xFFF' or transparency '0xf1f1f1f1'

Author

• Gmail

• Github

• LinkedIn