We'll be adding to these FAQs all the time, so please do ask anything we've not covered!
Currently React components are supported.
We will be adding support for Vue and other code frameworks soon.
What do I need to provide for Interplay to run my components?
Interplay needs a UMD build that exports your components as individual exports, and it needs JSON config that describes your components. This config includes what components are available, their props and sample configurations to use as presets when designing.
The Interplay CLI is a tool that can usually help create both of these, but you can provide your own UMD build or generate your own config and deploy them to Interplay.
Do I need to write my components in a special way to use them in Interplay?
No. We import components as they are and run them using their code frameworks as normal.
There may be some limitations on which component properties we can usefully expose or automatically parse for designers to use, but in general your components should work in Interplay as they do in your application.
Can I use design components and code components side-by-side in my designs?
Yes! You can import your code components to Interplay and work with them in Figma. You can use them alongside your design components as usual.
I don't have any components yet, can I still use Interplay?
We are currently best suited to teams that have or are creating a component library.
But you are of course very welcome to try out Interplay with the open source library we provide by default on the free account. This is a theme-able library so you can experiment with the token values.
You can also work with design tokens to create design components in Figma and push them to Interplay alongside any code components in your composition.
Can I curate how designers see my code components in Figma?
Yes! Interplay uses JSON configuration that describes and presents your components. This configuration is usually generated by parsing your code as the source of truth so it automatically stays up to date.
You can modify this configuration to control how your components are presented in your design tools and clarify how they should be used.
For more details, please see