Read how you can utilize the full potential of Figma's native auto layout feature throughout your design in order to generate fully responsive, Flex code with the help of Anima!
Skip to a Section:
Adding Auto Layout to Your Components
Open Figma and create / edit a component.
Select the entire component. Then add auto layout, in the right sidebar.
Fine-tune layout, padding and spacing as needed.
Test it by resizing the component or container in Figma.
Your component is now responsive!
Exporting Your Fully Responsive Flex Code
Once auto layout has been added and your components are functioning responsively inside Figma, it’s time to export them into code!
Open your components in CodeSandbox:
And watch its responsive, flex behavior:
As you can see, Anima will generate clean, maintainable, responsive code for your components or screens in a matter of seconds. Export the code as a local file and use it as you please!
Get involved in our Anima Community Forum! 😎
New to Anima?