I was given an Adobe .xd file for a website, which needs to be created in WordPress. Part of the design are linear-gradients (as borders of images for example). My problem is, that I can't seem to find an option for "extracting" the corresponding css from these elements.
An example:
Now, I want the CSS that describes this bottom border, which is a linear-gradient with an angle. I can get the hexcodes for the colors, but not the angle, nor do I know if there are stops and where.
The options I see are:
- Extract the CSS from Adobe XD somehow. Is this possible?
- Convert the
linearGradient
tag from the exported SVG file to css. How can this be done?
The linear gradient tag from the SVG of the exported bottom border is the following:
<linearGradient id="linear-gradient" x1="1.089" y1="-3.5" x2="-0.775" y2="2.611" gradientUnits="objectBoundingBox">
<stop offset="0" stop-color="#ac2284"/>
<stop offset="1" stop-color="#003bff"/>
</linearGradient>