Nodes/ComfyUI-LoadImageCrop/Load Image + Crop
ComfyUI Node

Load Image + Crop

Frame the Crop With Your Mouse, Not a Calculator

By domg73·Created 5 days ago·Updated a day ago· 14
Load Image + Crop
    • IMAGE
    • MASK
    image
    aspect_ratio
    crop_x0.0000
    crop_y0.0000
    crop_w1.0000
    crop_h1.0000

    Every ComfyUI user eventually hits the same wall: you load a reference image for img2img, an inpaint pass, or a face upscale - and you only want a slice of it, at a specific aspect ratio. The stock answer is Load Image, then a crop node where you type pixel coordinates you have to derive from the preview by squinting. LoadImageCrop ("Load Image + Crop") collapses that into one node: it's the official Load Image with a draggable, aspect-ratio-locked crop rectangle drawn directly on the preview. What you frame is exactly what runs.

    It's aimed at a very real gap. Detailers and inpainting all boil down to "crop a region, re-render it, paste it back," and most people still get that crop by hand-typing numbers. This node makes the framing step visual instead.

    What it actually is

    The node loads images exactly like the official Load Image: same file picker, same drag-and-drop, reading from your ComfyUI/input/ folder. The default aspect_ratio is Original, and in that mode it's a straight drop-in replacement - the image passes through uncropped at full W×H, no resize, no interaction. The moment you pick a locked ratio - 1:1, 2:3, 3:2, 3:4, 4:3, 9:16, 16:9, 21:9 - a crop rectangle appears on the preview.

    The rest is frontend magic, and it's well done. The extension wraps the built-in image preview widget and paints over it: the area outside your crop dims, a red border marks the frame, and a live label shows the exact output size as you adjust. Drag inside the box to move it. Hover over the image and scroll the wheel to zoom, anchored on your cursor - ratio never drifts. That anchored wheel-zoom is the detail that makes it feel like a real tool instead of a widget.

    The two outputs that matter

    Wire out IMAGE and MASK, and both come back cropped. IMAGE is your framed pixels; MASK is the transparency/alpha as a mask (ComfyUI's usual 1 - alpha convention), cropped proportionally - so you can feed it straight into inpaint or compositing stages that expect a matched mask. The backend crops in integer pixels, so what you framed is what you get within ±1 px.

    Under the hood the crop is stored as normalized 0..1 floats in hidden crop_x / crop_y / crop_w / crop_h inputs. You'll almost never touch them - but because they're real widgets, the crop saves into the workflow JSON (reopen the workflow, your frame is back) and the node reruns downstream nodes whenever you move the rectangle, exactly like changing any other input. The same four values are how an API script would drive the crop if you ever run ComfyUI headless.

    Install

    No dependencies, no model downloads, no requirements.txt at all - it's just Python plus a frontend extension:

    • ComfyUI Manager: search "LoadImageCrop" (pack: domg73/ComfyUI-LoadImageCrop) and install.
    • Manual:
    cd ComfyUI/custom_nodes
    git clone https://github.com/domg73/ComfyUI-LoadImageCrop
    

    Restart ComfyUI either way, then find it under the image category - or just search "crop".

    The catch(es)

    Clipboard paste is where people get confused. Ctrl+V (with the node focused) pastes a clipboard image or file, natively. The right-click Paste Image menu entry only reads clipboard images - screenshots, not files you copied in the OS file manager. That's a browser limitation identical to stock ComfyUI, not a bug in this node, and it needs Chrome/Edge over http://localhost with clipboard permission granted.

    A few behavioral notes worth knowing:

    • The crop is locked to whichever ratio you chose. Switching source images resets the frame to a centered, max-size fit of that ratio.
    • In classic mode, drags only start inside the crop box (v1.0.3 behavior); clicks elsewhere pass through to the normal preview. The mouse wheel is captured by the crop while your cursor is over the image, so pan/zoom the canvas from outside the preview.
    • Animated images in the Nodes 2.0 view show only the first frame.
    • The author flags one honest maintenance caveat: in ComfyUI 2.0 the overlay tracks the frontend's DOM, so if Comfy changes the preview markup, the node may need a selector update.

    Speaking of 2.0 - that's the pleasant surprise here. Comfy's Vue-based Nodes 2.0 rewrite famously broke third-party nodes left and right (the knowledge base's ecosystem doc tracks that whole saga, with big packs still refusing to port). This pack added full 2.0 support back in v1.0.2 and the overlay works identically in both designs, switching live without a reload. That's ahead of the curve for a brand-new utility node, and it makes the node safe to adopt even if you've flipped the beta toggle.

    Not a glamorous node. The kind you install, use for every reference-image workflow, and forget is custom. If you've been doing crop-by-coordinates, the mouse version feels like cheating.

    Categoryimage

    Inputs (6)

    NameTypeDefaultDescription
    imageCOMBO1 options: example.png
    aspect_ratioCOMBO10 options: Original, Free (Custom), 1:1 (Square), 2:3 (Portrait Photo), 3:2 (Photo), 3:4 (Portrait Standard), +4
    crop_xFLOAT0.00000–1
    crop_yFLOAT0.00000–1
    crop_wFLOAT1.00000–1
    crop_hFLOAT1.00000–1

    Outputs (2)

    NameTypeDescription
    IMAGEIMAGE
    MASKMASK