2025-07-28 19:42:10 +02:00
2025-07-23 23:22:40 +02:00
2025-07-28 19:42:10 +02:00
2025-07-28 19:42:10 +02:00
2025-06-28 22:35:15 +00:00
2025-06-29 12:41:37 +00:00
2025-07-23 23:14:49 +02:00
2025-07-01 12:03:13 +02:00
2024-11-24 10:36:39 +08:00

LayerForge Advanced Canvas Editor for ComfyUI 🎨

LayerForge is an advanced canvas node for ComfyUI, providing a Photoshop-like layer-based editing experience directly within your workflow. It extends the concept of a simple canvas with multi-layer support, masking, blend modes, precise transformations, and seamless integration with other nodes.

ComfyUI Downloads GitHub Clones Python 3.10+ JavaScript

Why LayerForge?

  • Full Creative Control: Move beyond simple image inputs. Composite, mask, and blend multiple elements without leaving ComfyUI.
  • Intuitive UI: Familiar controls like drag-and-drop, keyboard shortcuts, and a pannable/zoomable viewport make editing fast and easy.

https://github.com/user-attachments/assets/0f557d87-fd5e-422b-ab7e-dbdd4cab156c

Key Features

  • Persistent & Stateful: Your work is automatically saved to the browser's IndexedDB, preserving your full canvas state (layers, positions, etc.) even after a page reload.
  • Multi-Layer Editing: Add, arrange, and manage multiple image layers with z-ordering.
  • Advanced Masking Tool: A dedicated masking mode with adjustable brush size, strength, and softness. Masks have their own separate undo/redo history.
  • Full Transformation Controls: Precisely move, scale, and rotate layers with mouse or keyboard shortcuts.
  • Blend Modes & Opacity: Apply 12 common blend modes (Overlay, Multiply, etc.) and adjust opacity on a per-layer basis via a context menu.
  • Comprehensive Undo/Redo: Full history support for both layer manipulations and mask drawing.
  • Seamless I/O:
    • Drag & Drop image files to create new layers.
    • Copy & Paste images directly from your system clipboard.
    • Import the last generated image from your workflow with one click.
  • AI-Powered Matting: Optional background removal for any layer using the BiRefNet model.
  • Efficient Memory Management: An automatic garbage collection system cleans up unused image data to keep the browser's storage footprint low.
  • Workflow Integration: Outputs a final composite image and a combined alpha mask, ready for any other ComfyUI node.

🚀 Installation

Install via ComfyUI-Manager

  • Search Comfyui-LayerForge in ComfyUI-Manager and click Install button.

Manual Install

  1. Install ComfyUi.
  2. Clone this repo into custom_modules:
    cd ComfyUI/custom_nodes/
    git clone https://github.com/Azornes/Comfyui-LayerForge.git
    
  3. Start up ComfyUI.

🧪 Workflow Example

For a quick test of LayerForge, you can try the example workflow provided below. It demonstrates a basic compositing setup using the node.

🔗 Download Example Workflow 📥 LayerForge_Example

How to load the workflow: Click on the image above, then drag and drop it into your ComfyUI workflow window in your browser. The workflow should load automatically.


🎮 Controls & Shortcuts

Canvas Control

Action Description
Click + Drag Pan canvas view
Mouse Wheel Zoom view in/out
Shift + Click (background) Start resizing canvas area
Shift + Ctrl + Click Start moving entire canvas
Double Click (background) Deselect all layers

Clipboard & I/O

Action Description
Ctrl + C Copy selected layer(s)
Ctrl + V Paste from clipboard (image or internal layers)
Drag & Drop Image File Add image as a new layer

Layer Interaction

Action Description
Click + Drag Move selected layer(s)
Ctrl + Click Add/Remove layer from selection
Alt + Drag Clone selected layer(s)
Shift + Click Show blend mode & opacity menu
Mouse Wheel Scale layer (snaps to grid)
Ctrl + Mouse Wheel Fine-scale layer
Shift + Mouse Wheel Rotate layer by 5°
Arrow Keys Nudge layer by 1px
Shift + Arrow Keys Nudge layer by 10px
[ or ] Rotate by 1°
Shift + [ or ] Rotate by 10°
Delete Delete selected layer(s)

Transform Handles (on selected layer)

Action Description
Drag Corner/Side Resize layer
Drag Rotation Handle Rotate layer
Hold Shift Keep aspect ratio / Snap rotation to 15°
Hold Ctrl Snap to grid

Mask Mode

Action Description
Click + Drag Paint on the mask
Middle Mouse Button + Drag Pan canvas view
Mouse Wheel Zoom view in/out
Brush Controls Use sliders to control brush Size, Strength, and Softness
Clear Mask Remove the entire mask
Exit Mode Click the "Draw Mask" button again

🧠 Optional: Matting Model (for image cutout)

The "Matting" feature allows you to automatically generate a cutout (alpha mask) for a selected layer. This is an optional feature and requires a model.

  • Model Name: BiRefNet
  • Download from: >
  • Installation Path: Place the model file in ComfyUI/models/BiRefNet/.

🐞 Known Issue:

node_id not auto-filled → black output

In some cases, ComfyUI doesn't auto-fill the node_id when adding a node. As a result, the node may produce a completely black image or not work at all.

Workaround:

  • Search node ID in ComfyUI settings.
  • In NodesMap check "Enable node ID display"
  • Manually enter the correct node_id (match the ID Node "LayerForge" shown above the node, on the right side).

Warning

This is a known issue and not yet fixed. Please follow the steps above if your output is black or broken.


📜 License

This project is licensed under the MIT License. Feel free to use, modify, and distribute.


Based on the original Comfyui-Ycanvas by yichengup. This fork significantly enhances the editing capabilities for practical compositing workflows inside ComfyUI.

Description
ComfyUI's Photoshop-like layered canvas editor to your ComfyUI workflow. This node is perfect for complex compositing, inpainting, and outpainting, featuring multi-layer support, masking, blend modes, and precise transformations. Includes optional AI-powered background removal for streamlined image editing.
Readme MIT 21 MiB
Languages
TypeScript 47%
JavaScript 44.1%
Python 3.6%
CSS 3.4%
HTML 1.9%