Create Dialog Image
CreateDialogImage
- background_image
- IMAGE
Ever generated a beautiful visual-novel-style background and thought "this needs a speech bubble situation"? That's this node. CreateDialogImage (from the dasilva333/ComfyUI_MarkdownImage pack) renders a comic/visual-novel style dialog box - rounded corners, border, an optional name-label pill ("Dr. Aeda") - and composites it onto a background image you feed in. It's the V1 implementation, which means it renders through imgkit/wkhtmltoimage like the pack's other original node, and it carries the same dependency caveat: that's a system binary, not a pip package, and the code expects it at a hardcoded Windows path.
The pipeline it slots into is the boring-but-useful end of a workflow: generate a scene → decode to an image → stick the dialogue box on it → save or animate. You're not doing anything clever with the diffusion graph here; you're adding text like a caption layer, and this node is purpose-built for the "name tag + message" look that comic and game scripts use.
How it works
The node renders the label and dialog box as styled HTML, converts your dialog_content Markdown, and screenshots it as a transparent PNG via wkhtmltoimage (the transparent option does the work, so the box floats over whatever's behind it). That transparent box is then pasted onto your background_image with PIL, using its alpha channel. Positioning is relative to the background's dimensions: dialog_position puts the box on the top or bottom edge, dialog_alignment handles left/center/right. With dialog_optimize on, it trims the empty space below the text so a bottom-positioned box hugs the dialogue instead of leaving a dead gap.
The inputs that matter
There are nineteen inputs, all required, but the handful you'll actually touch:
background_image- the scene you're overlaying onto. It's a requiredIMAGEinput, so this node cannot run standalone in the graph; wire a VAE-decoded image in first. That trips people up because the dialog box looks self-contained.dialog_content- the words, multiline, Markdown-aware.label_content/label_enabled- the name pill ("Dr. Aeda"). Turnlabel_enabledoff for a plain box.dialog_bkg_color- note the default isrgba(255, 105, 180, 0.5): RGBA with alpha. That's how you get a translucent box. If you want solid, use a plain color.dialog_position(top/bottom) anddialog_alignment(left/center/right) - where the box sits on the background.image_width/image_height- not the output size but the footprint of the dialog box itself (defaults 840×210). Your background should be larger than this; that's what makes positioning meaningful.
The rest - font family, sizes, colors, border width, label position (left/right) and label width - are the styling knobs. dialog_optimize is a boolean that's worth leaving on.
Output is a single IMAGE: the background with the dialog composited in. Straight into SaveImage, or into a VHS node if this is a frame of something bigger.
Installing
ComfyUI Manager: search ComfyUI_MarkdownImage. Manual route:
cd ComfyUI/custom_nodes
git clone https://github.com/dasilva333/ComfyUI_MarkdownImage
Restart, and you're 90% done - the pack has no models to download. The remaining 10% is wkhtmltopdf (download from https://wkhtmltopdf.org/downloads.html), because dialog_generator.py hardcodes C:\Program Files\wkhtmltopdf\bin\wkhtmltoimage.exe. On a default Windows install it just works; on Linux/Mac you must edit that path in the pack's source. If that sounds like a hassle and you have Chrome installed, the V2 sibling (CreateDialogImageV2) does the same job via Selenium with no wkhtmltopdf.
Troubleshooting
imgkiterror on first run - the hardcodedwkhtmltoimagepath again. Editdialog_generator.py.- Box renders but the scene doesn't show behind it - you fed an opaque
dialog_bkg_color; go back to anrgba(...)value for translucency. - Box sits in a weird place or goes off-canvas - your
image_width/image_heightis larger than the background, or you're compositing onto a background with different proportions than the dialog canvas assumed. Keep the dialog footprint comfortably smaller than the scene.
It's a niche tool in a niche pack, so don't expect a community troubleshooting thread to exist for it - but the failure modes are all ordinary dependency/path issues, which are fixable in minutes.
Inputs (19)
| Name | Type | Default | Description |
|---|---|---|---|
| label_content | STRING | Dr. Aeda | — |
| label_enabled | COMBO | true | 2 options: true, false |
| label_position | COMBO | right | 2 options: left, right |
| label_font_size | INT | 288–64 | — |
| label_font_color | STRING | #C71585 | — |
| label_width | INT | 18050–4096 | — |
| dialog_content | STRING | The quick brown fox jumped over the lazy dogs. Lorem ipsum dolor sit amet, consectetur adipiscing elit. | — |
| dialog_bkg_color | STRING | rgba(255, 105, 180, 0.5) | — |
| dialog_font_color | STRING | white | — |
| dialog_font_size | INT | 268–64 | — |
| dialog_border_color | STRING | white | — |
| dialog_border_width | INT | 61–20 | — |
| dialog_position | COMBO | bottom | 2 options: top, bottom |
| dialog_alignment | COMBO | center | 3 options: left, center, right |
| dialog_optimize | COMBO | true | 2 options: true, false |
| font_family | STRING | Segoe UI Emoji | — |
| image_width | INT | 84016–4096 | — |
| image_height | INT | 21016–4096 | — |
| background_image | IMAGE | — |
Outputs (1)
| Name | Type | Description |
|---|---|---|
| IMAGE | IMAGE | — |