Figma Plugin Hub
Back to Plugins
Twenty3 Template Tagging

Twenty3 Template Tagging

Software to format and export templates for the Twenty3 Toolbox

design to codedeveloper handoffsvgdata

Plugin Preview

Twenty3 Template Tagging preview

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

Plugin Details

Version27
CreatedApril 7, 2024
Last UpdatedMarch 28, 2025
CategorySoftware development
CreatorEmily Wheatcroft
Stats5 installs, 1 likes
PricingFree
Install Plugin

Technical Details

  • API:1.0.0
  • UI:dist/ui.html
  • main:dist/code.js
  • Document Access:dynamic-page
  • Network Access:

    Plugin needs to access sport data

  • Editor Types:
    figma
  • Allowed Domains:
    • http://localhost:2323
    • http://localhost:3000Dev
    • https://proxy-api-develop.twenty3.io
    • https://sockjs-eu.pusher.com
    • https://toolbox-api-core-v3-assets.s3-accelerate.amazonaws.com
    • wss://ws-eu.pusher.com

More Like This

Discover other plugins in the Software development category.

Polyglots

Polyglots

Polyglots: are people who know and are able to use several languages.

devup

devup

devup design system

xg export

xg export

tailwindcss

View All Software development Plugins