Find Nearest Named CSS Colour
Added in: @sardine/colour@2.1.0
Description
Finds the nearest named CSS colour in a palette to the given named CSS colour.
Signature
function findNearestNamedCSSColour(
colour: NamedCSSColour,
palette: NamedCSSColour[]
): NamedCSSColour;
Parameters
colour
:NamedCSSColour
— The named CSS colour to find the nearest match for (e.g.,"red"
).palette
:NamedCSSColour[]
— An array of named CSS colours to search for the nearest match in.
Returns
NamedCSSColour
— The named CSS colour in the palette that is closest to the given colour. If the palette has fewer than 2 colours, or is undefined/null, the original colour is returned.
Examples
import { findNearestNamedCSSColour } from "@sardine/colour";
findNearestNamedCSSColour("red", ["green", "blue", "orange"]);
// => "orange"
findNearestNamedCSSColour("navy", ["navy"]);
// => "navy" (palette too small)
findNearestNamedCSSColour("gold", undefined);
// => "gold" (palette is undefined)
Error Handling
- If
palette
is not an array or has fewer than 2 colours, the function returns the input colour. - If
colour
is not a valid named CSS colour, downstream conversion functions may throw errors (e.g.,convertNamedCSSColourtoRGB
).
Interactive Demo
Try the function yourself with our interactive playground: