AF - Enhanced HTML Note

AF - Enhanced HTML Note is a note node that renders real HTML instead of a sad block of plain text. ComfyUI ships a Notes node that does the "sticky label" job, but it's unstyled monospace. This one gives you colored sections, lists, tables, code blocks, two-column layouts, and clickable links - all living inside a normal node on your canvas.

The reason you'd reach for it is sharing. ComfyUI's culture runs on "workflow included": you drag a PNG back in and the whole graph reconstructs, but the graph alone doesn't tell anyone what the prompts were, what model you used, or which settings matter. This node is how you attach that documentation to the canvas itself. Positive/negative prompts in green and red sections, model info, VRAM warnings, a link to the checkpoint - it turns "here's my workflow" into "here's my workflow with instructions built in." Nobody else has to guess, including future you.

How it works

This is a front-end-only node. The Python side is one function that takes your HTML string and renders it; it has no outputs and needs no connections - it's pure display, zero compute, zero VRAM. All the real work happens in the browser: the extension hides the input widget, injects your HTML into a node-sized display, and manages editing. You double-click anywhere on the content to open a textarea, hit Escape or click outside to save, and the raw HTML is stored back in the widget value so it persists inside your workflow JSON. Drag the PNG out and the note travels with it.

JavaScript is deliberately disabled - no <script> tags, no onclick, no javascript: links. Links work only when you hold Ctrl and click, which is also how the node avoids hijacking your canvas interactions. Styling comes from a bundled CSS file (web/AF-Enhanced-HTML-Note.css in the repo), so you can edit it to re-theme the sections or add your own classes.

The one input that matters

There's a single input, html_content (a multiline string). It ships with a big default page demonstrating every feature, which is honestly the best way to learn: drag the node in, double-click, and copy the classes.

The classes you'll actually use:

• af-positive (green) and af-negative (red) - prompt sections
• af-neutral (gray), af-info (blue), af-warning (yellow) - notes, technicals, caveats
• Spacers from af-spacer-mini (4px) up to af-spacer-xl (48px), plus af-column-half-left / af-column-half-right inside a .row for two columns

Everything else is plain HTML: <strong>, <code>, <pre>, <table>, inline style= attributes. If a class isn't to your taste, inline styles always win.

Installing it

Via ComfyUI Manager, search for "AF - Enhanced HTML Note" and install. Or manually:

cd ComfyUI/custom_nodes
git clone https://github.com/alFrame/ComfyUI-AF-Enhanced-HTML-Note.git

Then restart ComfyUI and refresh the browser tab. There are no Python dependencies, no model downloads, no API keys, nothing to download. It's one of those rare custom nodes that can't break your environment - no pip conflicts, which in this ecosystem is worth something.

Where people get burned

The README's known limitation is real: middle-mouse-button panning doesn't work while your cursor is over the node. The HTML layer intercepts the event before the canvas sees it, and the author documents that browser security makes it unfixable. Workaround: hold Space to pan, or start your pan from outside the node.

A few more gotchas, all straight from the README:

• Clicking content doesn't select the node - grab the title bar or edges instead.
• Links don't respond - you forgot the Ctrl key. That's by design.
• Content "won't save" - it only commits when you exit edit mode (Escape or click out), and you still have to save the workflow afterward. Closing the tab mid-edit loses the changes.
• Styling not applying - class names must match exactly (af-positive, not a typo), or the section class is missing from your CSS. After editing the CSS, hard-refresh with Ctrl+F5.

Honest framing: it does one job and does it well, and it's the only node in this pack. If you only ever share workflows with yourself, the built-in Notes node is fine. If you share them with other people - or want your own canvas to read like a manual instead of a cipher - this is the polite version.