Nodes/ComfyUI-WatermarkColorUI/Watermark Color UI
ComfyUI Node

Watermark Color UI

Watermark Color UI makes recolorable stamps not miserable

By shuaixn·Created 3 months ago·Updated 2 months ago· 0
Watermark Color UI
  • image
  • watermark
  • watermark_mask
  • image
tint_color#ffffff
tint_strength100
preserve_luminancefalse
x_percent90.0
y_percent90.0
scale20.0
opacity90
rotation0
blend_modenormal

If you've ever tried to plop a transparent PNG logo onto a generated image in plain ComfyUI, you know the pain: you wire up two Load Image nodes, reach for a composite node, and then guess at pixel offsets until the watermark sits somewhere that isn't the dead center or the exact edge. This node is the fix for that one job. It's a WYSIWYG watermark editor - you drag the stamp around on a live preview, resize it with a handle, rotate it, and recolor it, and the node writes the final composite for you.

It's also refreshingly un-AI about it. This is a deterministic pixel operation in the spirit of the post-processing layer: no model, no API, no key, no new dependencies. The only inputs are your base image and the watermark image. That's the whole point - watermarking is one of those jobs you should never burn a diffusion pass on, and this node doesn't.

How it works

Under the hood it's a ColorWatermarkUI class (registered as WatermarkColorUI), a plain torch compositing routine wrapped in a custom front-end. Feed it your base image and your watermark (ideally a transparent PNG), and it builds an RGBA layer, tints it, scales and rotates it with bicubic sampling, and alpha-composites it onto the base. All five blend_mode options - normal, multiply, screen, overlay, soft_light - are computed on the watermark RGB and then blended by alpha, which is the correct order for getting the mode to actually look like Photoshop instead of a wash.

The one thing to understand about the mask: ComfyUI's Load Image hands you transparent-PNG alpha as an inverted mask (transparent = 1, opaque = 0), and this node knows it - it flips it back to real alpha for you. But it can only do that if you actually wire the mask in.

The inputs that matter

  • watermark_mask - the one that saves you. Connect the MASK output from the watermark's Load Image. Skip it and the node treats the watermark as flat RGB, so you get a solid rectangle instead of your shaped logo. This is the #1 way people mess this up.
  • tint_color, tint_strength, preserve_luminance - the recolor trio. tint_strength 100 slaps the selected color on flat; 0 keeps the original RGB. Flip preserve_luminance on to keep the original brightness as shading, so a black-on-white stamp keeps its depth when you tint it.
  • opacity - overall alpha multiplier. blend_mode - the compositing mode above.
  • x_percent, y_percent, scale, rotation - position, size, and angle. You'll almost never type these by hand; the interactive editor writes them for you.

The output is a single image socket carrying the composited result, which you wire straight into Save Image. The node is marked as an output node so it renders its live preview - the image still flows onward.

The editor is the actual feature

Here's the part that makes this worth installing over a hand-rolled composite graph. Inside the node you can drag the watermark to position it, use the bottom-right square handle to scale it, and the top-right round handle to rotate it. There's a color swatch picker, a Pick button that samples a color from the preview itself, and guide lines that snap the stamp to the image center and snap rotation to 0/90/180. The S / M / L buttons switch preview heights, and the UI is bilingual (it follows your ComfyUI locale setting). One honest detail: the author replaced the browser-native EyeDropper with in-preview sampling because the native API froze in some browsers - the workaround is built in, so you don't need to care.

Install

ComfyUI Manager (search "Watermark Color UI") or the manual route:

cd ComfyUI/custom_nodes
git clone https://github.com/shuaixn/ComfyUI-WatermarkColorUI

Then restart ComfyUI and hard-refresh the browser (Ctrl+Shift+R / Cmd+Shift+R). That last step matters because this pack ships a web/ directory - the interactive editor is browser JavaScript, and stale cached assets are the most common reason the fancy UI doesn't show up. There's no requirements.txt and no models to download; it only uses torch, Pillow, numpy, and ComfyUI's built-in folder_paths, all already present.

Common issues

  • Rectangular block instead of a shaped watermark - you forgot watermark_mask. Wire the MASK output from the watermark's Load Image.
  • Preview looks stale after you add a Resize upstream - the node can't see the resize until you run it. Click the native run button above the node so it executes the upstream chain and refreshes with the real pixels.
  • No interactive controls after install - hard refresh, and confirm the restart actually loaded the web/ directory.
  • tint_color looks like a scary hex string - it is a #RRGGBB string, but the widget gives you a color picker, so you rarely need to touch the text.

Is it overkill for stamping one logo once? Yeah, maybe. But if you batch watermark client work or portfolio pieces, the drag-and-snap editor turns a fiddly chore into something you can do in seconds.

Categoryimage/post

Inputs (12)

NameTypeDefaultDescription
imageIMAGE
watermarkIMAGE
tint_colorSTRING#ffffffWatermark color as #RRGGBB. The visual widget includes a color picker and eyedropper.
tint_strengthFLOAT1000–1000 keeps original watermark RGB; 100 applies the selected color.
preserve_luminanceBOOLEANfalseUse the original watermark brightness as shading when applying color.
x_percentFLOAT90.0-100–200Watermark center X as percent of image width.
y_percentFLOAT90.0-100–200Watermark center Y as percent of image height.
scaleFLOAT20.00.1–200Watermark width as percent of image width.
opacityFLOAT900–100Watermark alpha multiplier.
rotationFLOAT0-360–360Watermark rotation in degrees.
blend_modeCOMBOnormalColor blending mode used when compositing the watermark.
watermark_maskoptMASKOptional. Connect the MASK output from the watermark Load Image node to preserve transparent PNG alpha.

Outputs (1)

NameTypeDescription
imageIMAGE