How do I get transparent to color gradient SVG code?

Click Apply + copy CSS. Source holds the SVG; the clipboard gets a CSS linear-gradient.

Is the CSS identical to the SVG?

It is a companion snippet (transparent, then the color). Tweak angle in CSS if needed.

Yes. Copy the SVG from Source or export the React tab.

Use SVG Gradient Fill Transparent to Color.

FAQ

Quick answers

How do I get transparent to color gradient SVG code?: Click Apply + copy CSS. Source holds the SVG; the clipboard gets a CSS linear-gradient.
Is the CSS identical to the SVG?: It is a companion snippet (transparent, then the color). Tweak angle in CSS if needed.
Can I paste this into a React component?: Yes. Copy the SVG from Source or export the React tab.
Want only the SVG, no CSS?: Use SVG Gradient Fill Transparent to Color.

Source

Ready

React component

React Native (react-native-svg)

PNG export · 2× for retina

0 B