color-catcher

Color catcher is npm package for browser which extracts the colors that occur most number of times in an image. As input paramters it accepts:

imageURL - path to the loaded image n - number representing first n most frequent colors from the image blurFactor - how much you want to blur the image. The more image is blurred the less precise function is. (optional)

Additionaly it provides functions to get different color palettes based on provided color:

• getComplementaryPalette
• getMonochormaticPalette
• getTriadicPalette
• getTetradicPalette

npm install color-catcher

import { getMostFrequentColors } from "color-catcher";
const imageSrc = require('./assets');

 const colors = await getMostFrequentColors({
      imageURL: url,
      n: 1,
      blurFactor: 0,
    })

[
 {
     rgb: { r:number, g:number, b:number };
     hex: string;
     count: number;
     precentage: string;
 }
]

const { palette } = getComplementaryPalette({ r:12, g:15, b:255})

const { palette } = getMonochormaticPalette({ r:12, g:15, b:255})

const { palette } = getTriadicPalette({ r:12, g:15, b:255})

const { palette } = getTetradicPalette({ r:12, g:15, b:255})

 [
      {
        rgb: { r:number, g:number, b:number };
        hex: string;
    }
 ]