[![Version](https://img.shields.io/badge/Version-3.1.2-cyan)](README.md) [![Youtube](https://img.shields.io/badge/Video-Tutorial-red)](https://youtu.be/p1niyxwsOes)

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: ```bash 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 `, 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 ` to toggle the visibility of the alignment panel. (Backtick key, located above the Tab key) - 2. 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 Alt 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 Alt 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

---

Unless explicitly authorized, integration, modification, or redistribution in any form is strictly prohibited.