Handover between design and development is notoriously prone to errors, manual rework, and "pixel-pushing" friction. In this session from Magnolia DevDays 2025, Rihana Ries (Head of UX at Noice) demonstrates how they bridged this gap by building a bespoke Figma-to-Magnolia plugin.

Key Takeaways:

• Structured Intent: How the Figma API exposes semantic data (tokens, auto-layout, constraints) rather than just static pixels.

• Direct Pipeline: Transforming Figma variables into CSS tokens and components into Magnolia light modules (HTML, FTL, YAML) via Git.

• Multi-brand Scalability: Handling complex token hierarchies and cascading breakpoints for responsive design.

• Designer-to-Author Continuity: Automatically converting Figma component properties into Magnolia dialog fields.

Watch a (live!) demo of a card component moving from a Figma update to a live, authorable Magnolia component in just minutes.