ComfyUI-Align

A powerful node alignment and color management plugin for ComfyUI, designed to enhance your workflow efficiency

By Moooonet·Created about a year ago·Updated about a month ago· 290

Moooonet/ComfyUI-Align

Nodes—

On cloudLocal install

Stars290

Updatedabout a month ago

Readme

</div>

ComfyUI-Align provides a powerful set of node alignment, stretching, and color configuration tools, addressing the lack of node alignment functionality in ComfyUI

If this plugin has helped preserve your sanity, please consider giving a ⭐ to sustain the caffeine habit.

Update Notes

Version 3.1.1 adds support for Nodes 2.0
Adjusted ColorBar colors to make node titles easier to read
Optimized some code

Environment

ComfyUI: Tested on version 0.26.0; theoretically supports recent and future versions
ComfyUI_Frontend: v1.45.19
Python: Python 3.13.12
System: Tested on Windows 11 and Ubuntu 25.10. Other Linux distros and macOS should work in theory, but are untested. I lack the resources to set up additional testing environments — please test on your own.

Install

From ComfyUI Manager: Search for "ComfyUI-Align" in ComfyUI Manager and install.
Git Clone: Open ComfyUI directory, navigate to custom_nodes folder, and run:
```
git clone https://github.com/Moooonet/ComfyUI-Align.git
```
Restart ComfyUI: After installation, restart ComfyUI to load the new plugin.

Settings and Usage

Shortcut Key: Default is the backquote key <kbd>`</kbd>, for multi-system compatibility, the custom shortcut key is implemented using ComfyUI's native feature. Please search for "Align Panel" in Keybindings to set a custom shortcut key.

Two Operation Modes:
1. Use <kbd>`</kbd> to toggle the visibility of the alignment panel. (Backtick key, located above the Tab key)
1. Enable Hold Mode in Settings (hold the shortcut to show the panel; hover over a button and release the key to execute without clicking; or hold the key and click different buttons to perform multiple operations).

Main Features

1. Node and Group Alignment, Distribution, and Stretching

Alignment:
- Left Align, Right Align, Top Align, Bottom Align:
- Alt Key: Holding <kbd>Alt</kbd> while aligning reverses the target nodes.
Distribution:
- Horizontal Top Align Distribution: Distribute nodes evenly horizontally first, then top-align.
- Vertical Center Align Distribution: Distribute nodes evenly vertically first, then center-align.
- Spacing Setting: Set spacing in the Align options.
Stretching:
- Left Stretch, Right Stretch, Top Stretch, Bottom Stretch:
- Horizontal Bilateral Stretch: The widest node is the target, and other nodes stretch to the left and right of the target node, maintaining their width.
- Vertical Bilateral Stretch: The tallest node is the target, and other nodes stretch to the top and bottom of the target node, maintaining their height.
- Alt Key: Holding <kbd>Alt</kbd> while stretching reverses the target nodes.

2. Node and Group Color Management

ColorBar:
- 9 default colors
- Clear color (clear the color of selected nodes)
- Moon icon (To open ColorPicker)
ColorPicker:
- Color selection area
- Eyedropper tool
- Hue slider
- Alpha slider
- HEX value (click to copy, double-click to edit)
- RGBA value (click to copy, double-click to edit. Hold Ctrl to copy all values)
- Color history
- Color presets
ColorPresets:
- Initially, a color_presets.json file will be generated in the plugin root directory to store custom color presets.
- After setting the color of nodes, click the Save button to save the preset.
- Click the Clear button to clear all saved preset colors.
- Click the Apply button to apply the colors from presets to the corresponding nodes