Dynamically Create Gradients

Dynamically create linear & radial gradients. Includes an optional third stop element for 3D perspective, with darker color for exterior shading.
Create Gradient
Stop 1 Color
% offset
opacity
Stop 2 Color
% offset
opacity
(3D):Stop 3 Color
% offset
opacity
:Radial
% cx
% cy
% r
% fx
% fy
:Linear
% x1
% y1
% x2
% y2
Spread Method: pad repeat reflect

SVG Source:
Javascript: