Anima Code Export Not Matching Design Layout

Developer Topics
1

Hello

I’m facing an issue where the code exported from Anima doesn’t match the layout and design of the original UX files. Elements are misaligned & the spacing between components seems inconsistent, even though everything looks fine in the design preview. :upside_down_face:

I’m using Figma as my design tool, and the issue appears when exporting both static and interactive components to React code. :innocent:

The exported code looks fine in terms of functionality; but the visual layout is off, especially with margins and padding.

I’ve double-checked the Figma file for any inconsistencies, but it seems to be an issue during the export process. :thinking: I have checked Using Anima with Figma auto layout doesn't give responsive design java guide for reference .

Has anyone else experienced this problem? Any suggestions for fixing these layout discrepancies when exporting? :thinking:

Thank you ! :slightly_smiling_face:

2

Hi there,

Did you try using an UI library instead of plain React? Usually the fidelity is much higher when using a library such as MUI or shadcn. If this doesn’t help, feel free to send an email to support@animaapp.com with more details and we’ll look into it :slight_smile: