Nodes/lf-nodes/View SVGs
ComfyUI Node

View SVGs

See the vectors you've been generating blind

By lucafoscili·Created 2 years ago·Updated 6 days ago· 35
View SVGs
  • ui_widget
  • svg
  • svg_list
svg

Here's a ComfyUI problem nobody talks about: SVG is text, and ComfyUI's preview system renders images. So the moment an LLM or a code node generates SVG, you're stuck reading raw markup in a text widget and guessing whether the logo you asked for is actually a blob. LF_ViewSVGs fixes exactly that - it renders the SVG in a gallery widget right on the node, so you can actually look at the vectors before you decide what to do with them.

It's the preview side of the pair that includes LF_SaveSVG, from the lf-nodes suite. Save writes files and shows them in a masonry gallery; View shows them in the same gallery without touching disk. Pick based on whether you're archiving or just looking.

How it works

Feed it a string containing one or more <svg>...</svg> blocks and it extracts each block with a simple non-greedy regex, then hands them to the frontend, which renders each one into a masonry-style gallery via the pack's webcomponent widget. The render happens client-side - the node's Python side is just splitting strings and passing them along. That's the whole mechanism, and it's worth knowing because it sets expectations: this is a viewer, not a converter. It will not rasterize your SVG to a PNG tensor, and it doesn't validate the SVG either. Malformed markup renders as whatever the browser does with malformed markup.

The inputs that matter

  • svg (STRING) - one or more <svg>...</svg> blocks concatenated together. Multiple blocks in one string each become their own gallery entry. It tolerates bytes and dicts with a value key, same as the rest of the pack's string handling.
  • ui_widget (optional LF_MASONRY) - the gallery itself; you usually leave this alone.

Outputs are svg (STRING) and svg_list (STRING list) - both pass-throughs, so the node is a great way to insert a visual checkpoint into a chain that keeps piping the SVG onward, like into LF_SaveSVG or a rasterizer.

Install

It ships with lf-nodes:

  • ComfyUI Manager: search "LF Nodes", install, restart.
  • Manual: cd ComfyUI/custom_nodes && git clone https://github.com/lucafoscili/lf-nodes.git, restart.

No models, no extra downloads, no GPU involvement - this node is pure string-splitting and browser rendering.

Common issues

  • "Nothing shows up." The regex only catches <svg>...</svg> blocks. If your upstream wraps the SVG in a full HTML document or comment, or splits the tag across lines oddly, it can miss. The pack's own split_svgs helper documents this as a known limitation of the regex approach.
  • It's an output node, so it always runs and will execute everything upstream every time. Fine for a viewer - that's the point - but don't hang an expensive generation off it and then wonder why the graph never sleeps.
  • You want a PNG, not a look. Wrong node. View doesn't rasterize; pair it with something that converts SVG to an image tensor if that's your actual goal.
  • Old install? If you're still on the archived comfyui-lf repo from before late 2025, reinstall from the current lucafoscili/lf-nodes - the old repo stopped getting the good stuff.
Category✨ LF Nodes/Image

Inputs (2)

NameTypeDefaultDescription
svgSTRINGA string containing one or more <svg>...</svg> blocks concatenated together.
ui_widgetoptLF_MASONRY[object Object]

Outputs (2)

NameTypeDescription
svgSTRINGPass-through SVG string.
svg_listSTRINGList of pass-through SVG strings.