Simplify Color Matching With Get Similar Color Library

Get Similar Color is a lightweight TypeScript/JavaScript library that quickly finds close color matches. With just your target color and palette array, it returns the most similar shades.

How to use it:

1. Import the Get Similar Color into your project.

# Yarn
$ yarn add get-similar-color
# NPM
$ npm i get-similar-color

// index.ts
import getSimilarColor, {IDefaultColor} from "get-similar-color";

2. Utilize the IDefaultColor interface to structure your color array.

const myColorArray: IDefaultColor[] = [
  { name: "red", hex: "#ff0000" },
  { name: "green", hex: "#00ff00" },
  { name: "blue", rgb: { r: 0, g: 0, b: 255 } },
  // ...
];

3. Specify the desired color and a similarity threshold (0.01 – 1), and let the getSimilarColor function to navigate through the color array you just defined and scout the closest shade for you.

const findColor = getSimilarColor({
  targetColor: "#e30b0b",
  colorArray: mytColorArray,
  similarityThreshold: 0.5,
});

Changelog:

08/09/2024

• Added Add HSL and HSV support