# Is there a tool that converts Adobe Illustrator's 3D Rotate effect to SVG or CSS transforms?

I'd like to export a graphic as SVG, and it contains text that has a 3D Rotate effect applied to it.

Saving as SVG this expands my text to outlines :(
I'd like it instead to output <text> with actual 3D transformations applied to it, something like this:

<text id="Textu" style="-webkit-transform: matrix3d(0.7784, -0.2518, -0.5749, 0, 0.1727, 0.9665, -0.1894, 0, 0.6034, 0.0481, 0.7959, 0, 0, 0, 0, 1);">
...


This is CSS, I would prefer SVG transformations.

Is there a tool or plugin that can do this? I have the values from the dialog box (X, Y, Z, Perspective), can I translate them to SVG transforms myself?

The text is meant to be dynamically changed with JavaScript.

• I don't know if SVG can do transforms this complex. Based on the docs I'm thinking it can't. What's wrong with a CSS transform? – Zach Saucier Dec 2 '14 at 0:11
• Yeah I have since found out SVG doesn't support 3D transforms. Nothing's wrong with CSS transforms really. I just felt that it's not "native" and might perform less graceful on lower-end smartphones. – Leeroy Dec 3 '14 at 12:42
• I can't get perspective to work on SVG elements, or at least text elements. (Comments may only be edited for you're stupid.) – Leeroy Dec 3 '14 at 13:41
• Can you please provide some of the SVG that you're looking to transform? – Zach Saucier Dec 3 '14 at 15:05