Twenty3 Template Tagging

About this plugin

Export graphics for the Twenty3 Toolbox.

How to use:

1. Start by installing the Twenty3 Template Tagging plugin from the Resources tab in Figma
2. Select the Frame or Layer that you would like to export
3. Check the preview in the plugin interface
4. Click the export button in the plugin header to save the formatted SVG locally
5. Upload the SVG at https://toolbox.twenty3.sport/graphic-editor using your Toolbox credentials

Technical details:

1. SVG text elements are replaced with foreignObject elements so that text can be populated dynamically and manually in the Toolbox editor
2. Figma's image rect elements are replaced with and image tag containing base64 encoded data

Notes:

1. Font binding takes place in the Toolbox, so if you do not have the fonts downloaded to your device you will not see them in the preview