Sort Colors By Distance
What It Does
The Sort Colors By Distance node arranges an array of colors by their relationship to a reference color. It can sort based on various color attributes like contrast, hue, lightness, saturation, or overall color distance.
Inputs
| Name | Description | Type | Required |
|---|---|---|---|
| Colors | Array of colors to be sorted | List of Colors | Yes |
| Compare Color | Reference color to sort against | Color | Yes |
| Type | Sorting method (Contrast, Hue, Lightness, Saturation, Distance) | String | No |
| Algorithm | Contrast algorithm to use when sorting by contrast | String | No |
Outputs
| Name | Description | Type |
|---|---|---|
| Value | The sorted array of colors | List of Colors |
| Indices | The original indices of the colors in the sorted array | List of Numbers |

How to Use It
- Drag the Sort Colors By Distance node into your graph.
- Connect an array of colors to the "Colors" input. (Here a Color Wheel node is used generate an array of colors).
- Connect a reference color to the "Compare Color" input (like
#1728E3). - Select a sorting method from the "Type" dropdown (default: Hue). Here lightness is selected.
- The output will be the sorted colors and their original indices.

Tips
- Use different sorting methods to achieve various visual arrangements of color palettes.
- The indices output is useful for tracking how the original array was rearranged.
See Also
- Color Wheel: For generating colors to sort.
- Range: For creating color ranges to sort.
Use Cases
- Color Palette Organization: Arrange colors in a visually logical order.
- Accessible Color Selection: Sort by contrast to find the most readable options.
- Gradient Generation: Sort colors by hue or lightness to create smooth transitions.