ComfyUI Extension: ComfyUI-WorkflowGraphics
Embed images directly in your workflow JSONs
Custom Nodes (0)
README
ComfyUI Workflow Graphics
<img width="1397" height="919" alt="image" src="https://github.com/user-attachments/assets/f117d0a6-833b-4a3a-8d20-fa6ae1d760ea" />Embed images directly in your workflow JSONs, useful for workflow branding, visual guides and much more!
Install
- Clone this repo inside your custom_nodes folder
git clone https://github.com/pixelworldai/ComfyUI-WorkflowGraphics.git
- Restart ComfyUI.
Usage
- Add the node by searching for
Workflow Graphics
. - Open the node’s panel (double‑click the node or use the right‑side properties).
- Paste an image base64:
- Example:
data:image/png;base64,...
- Example:
A great place to convert your PNGs to Base64: https://www.base64-image.de/ - Once converted click "copy image" <img width="1535" height="842" alt="image" src="https://github.com/user-attachments/assets/f313786a-a1a6-4a68-8fda-d5d07a01d053" />
-
Adjust:
Scale (%)
: 0–100 of the image’s natural sizeOpacity
: 0..1Background Color
: any CSS color ortransparent
- Great for adding background colors to transparent PNGsBorder Radius
: radius in pixels - Add rounded edges to image
-
Pin the node (ComfyUI pin) to allow click‑through over the canvas while keeping it visible.
-
Use the context menu item
<img width="423" height="255" alt="image" src="https://github.com/user-attachments/assets/27b146f3-fb78-4b59-84da-a13c06ae8e6d" />Reload Workflow Graphics
to reload node once you paste the base64 string, as it does not appear automatically after pasting, alternatively you can refresh the page.
Notes:
- This is a frontend‑only node; it does not participate in execution.
- The node size auto‑matches the displayed image dimensions.
Support
If you like this node, please support development of this and future projects here: https://ko-fi.com/pixelworldai <3