Nodes/ComfyUI_SVG-Suite/SVG Batch Color Effects
ComfyUI Node

SVG Batch Color Effects

One-click color effects for your whole SVG, from invert to sepia

By MushroomFleet·Created about a year ago·Updated 5 months ago· 9
SVG Batch Color Effects
    • STRING
    ◄svg_string—►
    â—„transformationinvertâ–º
    â—„custom_mapping#FF0000:#0000FF,#00FF00:#FFFF00â–º

    If your SVG has forty shades and you want to flip it to grayscale or give it a sepia mood, editing each fill by hand is misery. SVG Batch Color Effects is the "select all, apply filter" button you're missing. It scans every color in your SVG, transforms them all with a single preset, and hands you a new SVG - no per-color mapping, no opening the file in a vector editor.

    How it works

    The node starts by extracting every unique fill color in the SVG (same routine as SVG Color Extractor), then builds a color-to-color map and swaps them throughout. The key detail: it only transforms standard 7-character hex colors like #FF0000. Anything else - rgb() values, named colors, hex with alpha - is left alone. That's a real limitation to know about, because svg-suite's conversion nodes output clean hex, but hand-made SVGs often don't.

    Pick a transformation:

    • invert - each color becomes 255 - channel, so blacks flip to white and red to cyan.
    • grayscale - luminance-weighted: 0.299R + 0.587G + 0.114B. This is the perceptually correct formula, not a naive average, so the result looks right instead of muddy.
    • sepia - the classic photo-sepia matrix, clamped to 255.
    • custom - your own mapping string, e.g. #FF0000:#0000FF,#00FF00:#FFFF00, in the same format SVG Color Replacer uses.

    The output is a list - that matters

    Here's the subtle part: this node's output is an SVG list, not a single string. The custom_mapping field and the preset are designed to produce one transformed SVG per... well, in practice you get one result for your chosen transformation. But because the output type is a list, downstream nodes that expect a single STRING can trip up - you may need to unwrap the list or use a node that accepts lists. Worth knowing before you wire it directly into a save node and wonder why nothing happens.

    Install

    It's part of svg-suite, so:

    cd ComfyUI/custom_nodes
    git clone https://github.com/MushroomFleet/svg-suite
    pip install -r requirements.txt
    

    Restart ComfyUI, or find it under "svg-suite" in ComfyUI Manager. This node has no special dependencies beyond what the pack already needs.

    Where people get burned

    The non-hex gotcha above is the big one - you'll feed it a perfectly nice SVG, get back an unchanged-looking result, and think the node is broken. Check the console: the node prints a message and returns the original SVG on error, so it fails silently.

    Second, don't reach for this when you need selective recoloring (turn only the red parts blue). That's SVG Color Replacer's job with an explicit mapping. This node is a blunt instrument - every color, one effect. Used that way, it's genuinely pleasant. For a 30-color icon set you want as dark mode variants, invert and grayscale are each one click away.

    Category💎TOSVG/Advanced

    Inputs (3)

    NameTypeDefaultDescription
    svg_stringSTRING—
    transformationCOMBOinvert4 options: invert, grayscale, sepia, custom
    custom_mappingoptSTRING#FF0000:#0000FF,#00FF00:#FFFF00—

    Outputs (1)

    NameTypeDescription
    STRINGSTRING—