Book a free 30 minute consultation

SVG Gradient Copying Tool

Already have a gradient created by a designer?
Upload it, then apply that exact gradient to new SVG icons or artwork – scaled correctly, with all colour stops preserved.

SVG Gradient Matcher

Copy a designer gradient and apply it to white SVG artwork (with correct scaling).

Upload files to begin.

How it works

  1. Upload a template SVG
    This should be an SVG that already contains the gradient you want to reuse

  2. Extract the gradient
    We’ll detect the gradient that’s actually used and store it as a template

  3. Upload your target SVG
    This is usually a white or flat-colour icon you want to recolour

  4. Apply the gradient
    The gradient is copied across, scaled to fit, and applied to the artwork

  5. Preview and download
    Download a ready-to-use SVG with the matched gradient applied

Options explained

  • Also apply to strokes – applies the gradient to outlines as well as fills

  • Replace all fills – useful if the icon isn’t white and you want everything recoloured

Good to know

  • Works with multi-stop gradients

  • Supports designer SVGs that use userSpaceOnUse

  • The output SVG stays clean and editable