A button label should not need to be copied by hand every time the wording changes. The Copycat UI plugin connects your project strings to Figma text layers, so you can choose the copy you need and refresh it after an edit. This tutorial walks through the workflow shown in the video: connect, apply, and refresh.
Watch the Figma plugin tutorial on YouTubeBefore you start
Have a Copycat UI account, a project with saved strings, and a Figma design containing a text layer you can edit. Open the Copycat UI plugin from the Plugins menu in Figma. In another window, sign in to Copycat UI and select the project whose strings you want to use.
1. Connect your project to Figma
In Copycat UI, open Integrations and click Create connection code. Copy the one-time code, return to the plugin in Figma, and paste it into the connection field. Click Connect. The plugin can now show strings from your project.
2. Select a text layer and apply a string
Select the text inside the element you want to update, such as a button label. Select the text layer itself, rather than its background rectangle. In the plugin, search by string key or text, choose the locale, and click the string you want to apply. This replaces the selected text and binds the layer to that string for future refreshes. In the video, the button eventually uses “Continue to Copycat UI.”
3. Change the wording in Copycat UI
Return to the Strings page in Copycat UI and find the string used by your button. Edit its default copy and click Save string. The tutorial changes “Continue to Copycat UI” to “Continue sign up.” Keeping the same string key lets the existing Figma binding continue to reference the copy after the wording changes.
4. Refresh the text in Figma
Switch back to Figma, select the bound text layer, and click Refresh selection in the plugin. The button now shows the saved wording. Refresh page updates bound text layers across the current page. Updates happen when you refresh; saving a string in Copycat UI does not automatically change the open design.
Check the result in your design
Review the updated copy in context, especially longer labels. Applying a string replaces the whole text layer and may reset formatting applied to individual character ranges. The plugin uses source strings or approved translations and skips unavailable or unapproved content during refresh instead of clearing the existing text. To stop a layer from following a string, choose Unlink; its current text stays in place.