Visual workflows
Soft mesh, grain or light: choose the right gradient background
Choose soft mesh when broad color transitions should support the layout, grain when surface texture is part of the expression, and a light-led image when a bright focal point should carry the composition. These are starting points, not fixed rules. The useful distinction is what the image does before you recolor it, not whether its current palette matches your brand.
Gabriel Tognon
Designer, Developer & Template Creator
· 5 min read
Key Takeaways
Compare color distribution, surface texture and light direction independently. Keep the layout constant when evaluating candidates. The examples show one public preview per collection, not a promise that every image has the same composition or that a preview reveals full-resolution detail.
Separate color, surface and light
Two backgrounds can both be blue and still behave very differently. One may spread color evenly across the frame. Another may have a bright diagonal streak, dark corners and visible grain. Recoloring changes the palette, but it does not automatically remove that streak or turn the underlying texture into a smooth surface.
Start with three questions: where does the eye go first, how visible is the surface at normal viewing size, and how much of the composition must remain in frame? Answer those before adjusting hue. A source that already fits the intended role usually needs fewer compensating effects than one chosen only for an attractive thumbnail.
Soft mesh: let color flow do the work

Soft Mesh 01, unmodified public catalogue preview, 500 × 280 pixels. Reviewed on 16 October 2026. No recolor, added texture or animation was applied for this comparison.
In this example, blue occupies most of the image while yellow enters from the left. The curved transition supplies movement without a recognizable object. The large color regions are the main event. That makes it a useful candidate when you want a visual atmosphere around a product screenshot, editorial title or simple brand mark.
Soft does not mean featureless. The yellow region still attracts attention, and the lower curve creates a directional edge. If your layout needs an even field, choose another image within the collection rather than assuming that lowering saturation will erase its structure. Judge the specific asset, not just the collection name.
Grainy glow: make the surface part of the expression

Luminous Grain 01, unmodified public catalogue preview, 500 × 280 pixels. Same review date and no additional ColorForge treatment. This small preview is for comparing composition, not inspecting the full-resolution grain.
Here, a pale diagonal glow cuts across blue, cyan and darker regions. Unlike the broad color spread of Soft Mesh 01, that path gives the image a stronger directional cue. A campaign graphic or poster can use the streak as part of its composition, with a short title placed away from the brightest area.
Surface texture is a separate decision from the glow. Inspect the intended output at its real viewing size before adding more grain. If the source already has the texture you want, another layer may simply make it busier. If it looks smooth after reduction, compare the original and the delivered version before deciding the source needs a stronger effect.
Light-led: build around the focal point

Light Studies 01, unmodified public catalogue preview, 500 × 280 pixels. Only the already-public preview is embedded here, not the protected member original. No effects were added for this article.
Light Studies 01 has a concentrated red and pale glow near the lower left, with curved trails crossing a mostly dark frame. The bright point creates a stronger sense of an event or destination than a broadly distributed color field. It can support a dramatic opening or a launch visual when the layout gives that focal point room.
The tradeoff is dependence on placement. If a crop removes the glow, the remaining image can feel like a different composition. If a button sits on top of it, the button and light compete. Treat the bright point as a deliberate element in the layout, not as interchangeable decoration that can be cropped anywhere.
Compare candidates before adding effects
Use one real placement and keep its text, typography, spacing and image frame unchanged while swapping the three candidates. First compare the unmodified images. Note which one makes the intended element dominant without needing extra decoration. This is a suggested evaluation method, not a claim that the three previews above are screenshots of a finished layout.
Then test the weaker case: longer copy, a narrow crop or a smaller card. Do not declare one collection universally better from this single image in each. Your shortlist may change when a particular curve, glow or light point moves out of frame. Check text separately, since a calm-looking gradient is not automatically a reliable reading surface.
Use ColorForge after choosing the structure
Once the source works, use ColorForge to explore its palette or an additional treatment. Start with recoloring alone, then compare any grain, dither or motion separately. Keeping changes isolated makes it easier to tell whether the improvement came from the source, palette or effect.
Browse Soft Mesh, Luminous Grain and Light Studies for other compositions. For the next decision, use the hero-background selection guide to test placement, or read why grain changes after resizing when a textured source looks different in a smaller output.
Conclusion
Pick the source for the role it needs to play, then adapt its color. Broad transitions, textured glows and concentrated light can all work well, but each asks something different of the surrounding layout. Begin with the structure that needs the fewest compromises.
Related articles
Start with the whole library.
Choose yearly access or lifetime access, then browse, customize and export from one account.