Nodes/kb-comfyui-nodes/SingleImageDataUrlLoader
ComfyUI Node

SingleImageDataUrlLoader

Paste an image into ComfyUI as a plain string

By smagnetize·Created 3 years ago·Updated 2 years ago· 0
SingleImageDataUrlLoader
    • IMAGE
    data_url

    Somewhere, right now, an image is hiding inside a string. It starts with data:image/png;base64, and then runs into a wall of base64 noise. That's a data URL - an image that never touches disk, shipped as text. SingleImageDataUrlLoader is the decoder ring: paste the string in, and a real ComfyUI IMAGE comes out the other side, ready to plug into anything that eats images.

    It's the entire contents of the smagnetize/kb-comfyui-nodes pack, and it does exactly one job. No model files, no API keys, no hidden downloads. The repo is a single "initial commit" with no README, and the source carries a # fanks chatgpt comment - this is a quick utility someone needed once and published. Judge it on that.

    When you'd actually reach for it

    ComfyUI's built-in LoadImage reads from disk, and it's the right tool most of the time. But images arrive as data URLs more often than you'd think:

    • A browser extension hands you the src of an <img> tag, which is often a data URL.
    • A REST API returns images base64-encoded instead of giving you files.
    • A vision-LLM or HTTP-request node spits out a base64 blob.
    • Someone embeds a reference thumbnail directly in a shared workflow's JSON.

    Rather than round-tripping through a temp file, you paste and go.

    How it works

    The mechanism is five lines, which is kind of the point. It splits your string on the first comma - everything before that is treated as a header and ignored - then base64-decodes the rest into bytes. Those bytes go to OpenCV's imdecode, the BGR result is flipped to RGB, and it's reshaped into the (1, height, width, 3) float tensor ComfyUI uses. That leading 1 is the batch dimension, which is exactly what the "Single" in the name means: one image in, one image out, no batching.

    The inputs and outputs that matter

    There's one of each, so this is easy.

    • data_url (STRING, required) - paste the full data URL here. Default is empty; nothing happens until you fill it.
    • IMAGE (output) - a single image. Wire it into VAEEncode for img2img, a ControlNet apply node, an IPAdapter, or anywhere else an IMAGE socket goes.

    Installing it

    cd ComfyUI/custom_nodes
    git clone https://github.com/smagnetize/kb-comfyui-nodes
    

    Then restart ComfyUI. In ComfyUI Manager, search the pack title "kb-comfyui-nodes" and install from there instead - same result, less typing.

    There's no requirements.txt, so nothing auto-installs. The code needs numpy and torchvision, which ship with every ComfyUI install, plus OpenCV - the one that can actually be missing. If ComfyUI won't start and the traceback ends in ModuleNotFoundError: No module named 'cv2', fix it with:

    pip install opencv-python
    

    No models to download, no port conflicts, no config. It's about as low-friction as a custom node gets.

    Where people get burned

    • You need the comma. The loader does split(",", 1), so a bare base64 blob without the data:..., prefix throws a confusing unpacking error. The header itself is never validated - only what follows that first comma matters - but the comma is mandatory.
    • Transparency gets dropped. imdecode with IMREAD_COLOR forces a 3-channel decode, so an RGBA PNG silently loses its alpha channel. If you need the mask, this isn't your node.
    • There's no error handling. A typo or a truncated string makes OpenCV return None, and the next line crashes on it. The failure is loud and not very helpful - just double-check the whole string made it in.
    • Big strings bloat your workflow. Whatever you paste is stored as a widget value in the saved JSON. A 4K PNG becomes a megabyte of text in your file and can make the frontend sluggish. Great for a reference image, bad for your upscale source.

    The verdict

    If you've ever stared at a wall of base64 and wished it was in your graph - install this, it's the one-node answer. If you mostly load from disk, LoadImage is the better default and this can wait on the shelf. It's not a node that belongs in every workflow; it's the one you're quietly grateful for the day a workflow hands you a data URL and you don't have to fight it.

    CategoryTools

    Inputs (1)

    NameTypeDefaultDescription
    data_urlSTRING

    Outputs (1)

    NameTypeDescription
    IMAGEIMAGE