Learn how to install and use the locize Figma plugin in order to start translating your Figma files in locize the right away.
The locize Figma plugin allows you to send text content to your locize project, directly from within Figma and to fetch translations from locize to test your designs. Bridging the gap between translation and product design with our Figma integration creates an efficient workflow from end-to-end.
You can find the locize Figma plugin in Figma's plugin browser.
Just click the install button on the top right corner of the page.
Ofter the installation, you can access the plugin via the menu of Figma. Next to all your favorite plugins.
To use the locize Figma plugin, you have to connect Figma with locize. If you do not have access to locize yet, you need to be invited to a project by someone with admin role or you need to create a new locize project.
If you have not yet started with filling locize with translations yet, this is a good option to start with.
Having some translated segments in locize, you have the possibility to validate your design with that translations.
Follow this getting started section, if you have not yet started with locize.
You can skip this step, if you already use a locize project.
Like described here, run the locize plugin in figma and copy your project id and api key in the Settings tab.
Like described here, select something in your figma design.
When clicking "Extract from current selection", you'll see it uses the layer names as segment key names for locize and it uses the frame name (or page name) as namespace name for locize.
At the bottom of the Extract box, click the "Yes" button to send those texts to locize.
When clicking "Extract from current selection", you'll see it uses the layer names as segment key names for locize and it uses the frame name (or page name) as namespace name for locize.
At the bottom of the Extract box, click the "Yes" button to send those texts to locize.
You can now translate the texts in all your other languages. Depending on your project settings it might also be the segments are already automatically translated thanks to the automatic translation.
Back to figma, you can now switch to the "Translate" tab, choose another language, and click the "Translate" button, like described here.
You can see the Text components are updated accordingly and your layer names stay unchanged.
Now you can add new languages in locize or change the text in locize and validate it in figma with the "Translate" tab.
If you want to send new texts to locize, just select another frame name and repeat step 3.
If you're using a special font which is not installed locally, the plugin might not work correctly.
In this case you can try to fix this like described here.