Closest Official Color page Enhancements
Source: Dev.to
Visit the Closest Official Color page
Overview
This tool finds the closest official color to any given color and offers a variety of visual transformations and complementary information.
Features
- Color previews: Shows the selected color as black, white, or gray.
- Desaturation: Displays a desaturated version of the color.
- Additive color mixes: Visualizes the result of adding red, green, blue, or any combination of these primary colors.
- Contrasting colors: Provides contrasting colors, including the negative (inverse) color.
Color Conversion Function
The core functionality is powered by the xs_color_convert function from the xs_style.js library.
xs_color_convert(fromColor, toColorType)
Supported toColorType values
| Type | Description |
|---|---|
hex | Hexadecimal representation |
rgb | RGB array |
hsv | HSV values |
hsl | HSL values |
hue | Hue component |
lum | Luminance |
dst | Desaturated color |
gry | Gray version |
gy~ | Grayish version |
wh~ | Whiteish version |
bk~ | Blackish version |
100, 110, 111, … | 3‑digit binary code indicating which primary colors to add (e.g., 100 = red, 110 = yellow, 111 = white) |
These options enable the tool to generate the various visual representations and complementary colors described above.