Nodes/Comfyroll Studio/🟨 CR Radial Gradient
ComfyUI Node Runs on cloud

🟨 CR Radial Gradient

A procedural radial gradient with a movable center

By Suzie1Β·Created 3 years agoΒ·Updated 2 years agoΒ· 1,296
🟨 CR Radial Gradient
    • IMAGE
    • show_Help
    β—„width512β–Ί
    β—„height512β–Ί
    β—„start_colorβ–Ύβ–Ί
    β—„end_colorβ–Ύβ–Ί
    β—„gradient_distance1.00β–Ί
    β—„radial_center_x0.50β–Ί
    β—„radial_center_y0.50β–Ί
    β—„start_color_hex#000000β–Ί
    β—„end_color_hex#000000β–Ί

    Another one of Comfyroll's no-model, pure-drawing nodes: CR Radial Gradient generates a two-color gradient radiating out from a point you choose, with control over where that point sits and how far the gradient spreads before it hits the end color. No sampling, no prompt - just a clean, deterministic gradient image.

    What it's for

    Radial gradients are a staple background element - a soft glow behind a subject, a spotlight effect, a vignette-style darkening toward the edges, or just a clean colored backdrop that isn't flat. Rather than trying to coax a diffusion model into producing a perfectly smooth, perfectly centered gradient (which it's genuinely bad at), this node draws one directly. It's the kind of thing you'd composite behind a subject, use as a base layer under CR Page Layout, or feed into something like CR Overlay Text for a title card with a bit of visual depth.

    How it works

    You give it a canvas size, a start color and an end color, and the node draws a gradient that transitions from the start color at the center point outward to the end color, over a distance controlled by gradient_distance. The center point isn't fixed to the middle of the canvas - radial_center_x/radial_center_y let you push it toward any corner or edge, which is what makes this useful for asymmetric compositions rather than just a centered glow.

    Inputs and outputs that matter

    • width / height (default 512, up to 4096) - canvas size.
    • start_color / end_color - each a dropdown of roughly 30 named colors plus "custom." Pick custom and use the matching optional hex field (start_color_hex, end_color_hex) for a specific color instead.
    • gradient_distance (default 1, range 0–2) - how far the gradient travels before fully reaching the end color. Lower values concentrate the start color into a tighter, more intense core; higher values spread it out into a softer, more gradual falloff.
    • radial_center_x / radial_center_y (default 0.5 each, range 0–1) - the gradient's origin point as a fraction of the canvas, where (0.5, 0.5) is dead center. Push either toward 0 or 1 to move the glow toward an edge or corner.

    Output is the gradient IMAGE, plus a help-link output - worth flagging that this particular node's help output is spelled show_Help (capital H) rather than the lowercase show_help every other Comfyroll node uses. It behaves the same way, just a naming quirk if you're wiring by name rather than by dragging the connection.

    How to install it

    Install through ComfyUI Manager (search "Comfyroll Studio"), or manually:

    cd ComfyUI/custom_nodes
    git clone https://github.com/Suzie1/ComfyUI_Comfyroll_CustomNodes.git
    

    Restart ComfyUI. No models, no extra dependencies - this is pure procedural image generation.

    Common issues & troubleshooting

    Colors aren't matching your dropdown selection. If start_color or end_color is set to "custom," the node reads the corresponding _hex field instead - which defaults to black. Check those fields if the gradient looks unexpectedly dark.

    Gradient looks like a hard edge instead of a smooth transition. That's gradient_distance set too low relative to your canvas size - a small distance value on a large canvas means the transition happens over a small area near the center, and the rest of the canvas is flat end-color. Push it up toward 2 for a softer, more gradual spread.

    Glow is centered when you wanted it in a corner. Adjust radial_center_x/radial_center_y away from 0.5 - remember these are normalized 0–1 coordinates relative to the canvas, not pixel positions, so 0.1 is near the left/top edge and 0.9 is near the right/bottom regardless of your actual width and height.

    Pack fails to load entirely. That points at a broken install, not this node - delete the ComfyUI_Comfyroll_CustomNodes folder and re-clone rather than debugging around a partial install.

    Category🧩 Comfyroll Studio/πŸ‘Ύ Graphics/🌈 Pattern

    Inputs (9)

    NameTypeDefaultDescription
    widthINT51264–4096β€”
    heightINT51264–4096β€”
    start_colorCOMBO30 options: custom, white, black, red, green, blue, +24
    end_colorCOMBO30 options: custom, white, black, red, green, blue, +24
    gradient_distanceFLOAT1.000–2β€”
    radial_center_xFLOAT0.500–1β€”
    radial_center_yFLOAT0.500–1β€”
    start_color_hexoptSTRING#000000β€”
    end_color_hexoptSTRING#000000β€”

    Outputs (2)

    NameTypeDescription
    IMAGEIMAGEβ€”
    show_HelpSTRINGβ€”