JSI Color

React native library that provides functions for colors, such as distance using
the CIEDE2000 algorithm and getting the color of a pixel in an image.

$3

``sh
yarn add react-native-jsi-color
npx pod-install
`

$3

An example app using the library and showing its usage can be found in the example folder.

$3

Everything is implemented in TypeScript and extensive documentation can be found
in the comments.

#### Getting the color of a pixel

If you need to get the color of a pixel in an image, you can use the
getPixelColor function. It takes the filepath to the image as the first
parameter and the coordinates of the pixel as the second parameter and third
paramter. It returns the color in "rgb(r, g, b)" format.

Make sure that the image is does not contain file:// before its path. If it
does, the function will not be able to find the image, leading to unpredictable
behavior.

Also, if you are trying to implement functionality that if a user taps on an
image (with gesture handler) and it shows the pixel color, you need to watch out
for the resizeMode, since the image might be cropped.

Optionally, you can pass the image view dimensions and the actual image
dimensions. Then, the function will return the color of the pixel in the image,
taking these into account.

`typescript
import { getPixelColor } from 'react-native-jsi-color';

const color = getPixelColor('/path/to/image', x, y);
console.log(color);
`

#### Getting the distance between two colors

This functionality is implemented by the computeColorDistance function. It takes
two colors as parameters and returns the distance between them. The colors are
required to be in the format "rgb(r, g, b)". The distance is returned as a
number. The CIEDE2000 algorithm is used to compute the distance.

`typescript
import { computeColorDistance } from 'react-native-jsi-color';

const distance = computeColorDistance('rgb(255, 0, 0)', 'rgb(0, 0, 255)');
console.log(distance);
`

#### Getting the color name of an rgb

If you need to get the color name of an rgb, you can use the
getClosestColorName function. It takes the color in "rgb(r, g, b)" format and
returns the color name of the closest color (formally, the color with the
smallest distance, using computeColorDistance, to the given color).

By default, the function will look through all named HTML colors and return the
closest color. However, you are also able to pass a list of your own colors as
an optional parameter. This is useful if you have predefined colors that you
want to use. These should be passed as an array of objects containing the name
and the color in "rgb(r, g, b)" format.

Optionally, you can also set the onlyClosest option to false, which will make the function return a list of all colors, sorted by their distance to the given color.

`typescript
import { getClosestColorName } from 'react-native-jsi-color';

const colorName = getClosestColorName('rgb(255, 0, 0)', {
onlyClosest: false,
colors: [
{
name: 'red',
color: 'rgb(255, 0, 0)',
},
{
name: 'green',
color: 'rgb(0, 255, 0)',
},
{
name: 'blue',
color: 'rgb(0, 0, 255)',
},
],
});
console.log(colorName);
``

License

MIT