🟨 CR Color Gradient

A gradient is one of those things you reach for constantly and never want to open Photoshop for. This node draws a clean two-color gradient straight into your ComfyUI graph and hands it back as a normal IMAGE - a backdrop to composite over, a base for a poster, a soft background for product shots, or a latent starting point to run img2img against.

It's a Comfyroll Studio node (Suzie1 / RockOfFire) from the Graphics → Pattern set. No model, no diffusion - it's a Pillow drawing routine, so it renders instantly and gives you the exact same result every time.

How it works

You set a canvas size, a start color and an end color, and the node blends from one to the other across the frame. orientation picks the axis - vertical or horizontal. The two shaping controls are where it gets nice: gradient_distance (0–2) stretches or compresses how far the blend travels, so you can push the transition into a corner or spread it edge to edge, and linear_transition (0–1, default 0.5) sets the midpoint - slide it to bias the blend toward the start or end color instead of a dead-even 50/50.

Colors come from a 30-entry dropdown of named presets. Choose custom on either end and the node reads the matching hex field, so exact colors are one field away.

The inputs that matter

• width / height (default 512, up to 4096) - output size.
• start_color / end_color - the two ends of the gradient, from the dropdown; set to custom for a hex value.
• orientation - vertical or horizontal.
• linear_transition (0–1, default 0.5) - where the midpoint sits. The knob you'll actually tune.
• gradient_distance (0–2, default 1) - how far the blend spreads.

Optional start_color_hex and end_color_hex (default #000000) hold the custom colors.

Output is an IMAGE (plus a show_help wiki link you don't wire).

Where you'd actually reach for it

Gradients are the quiet workhorse of clean compositions. A soft vertical fade behind a product or a portrait reads as "studio backdrop." Paired with Comfyroll's Composite Text or Overlay Text, a gradient is an instant title card or thumbnail base. And as an img2img seed, a gradient gives the sampler a gentle luminance ramp to build on instead of pure noise - handy for controlled, low-denoise looks.

How to install it

• ComfyUI Manager: search Comfyroll Studio, install, restart.
• Manual: cd ComfyUI/custom_nodes && git clone https://github.com/Suzie1/ComfyUI_Comfyroll_CustomNodes.git, then restart.

No downloads - Pillow does the drawing.

Common issues

The failure you're most likely to meet is the whole Graphics module not loading. On newer ComfyUI versions Comfyroll can throw Comfyroll Studio: Failed to load Graphics nodes at startup, followed by a run of NameError: name 'CR_...' is not defined, which makes every CR node disappear. It's a known, reported issue. Scroll up to the first traceback - that's the real cause - and update the pack via Manager to pick up the compatibility fixes.

Smaller stuff: a custom color rendering black means the matching hex field is still on its #000000 default. And if a gradient looks like a hard edge instead of a smooth blend, check gradient_distance - pushed low, the transition collapses into a narrow band that reads as a line rather than a fade.