scalero-logo
Cannoli logo

An easier way to go from design to code

We love designing in Figma, and we realized a lot of other email creators do too, so we created Cannoli, a tool focused on speeding up your email workflow while using a tool you already love. By following some simple guidelines while designing, you’ll be able to get production ready responsive code in a few clicks.

How it works

With a few adjustments to your typical design workflow in figma, we are able to convert your file into production ready code, that’s responsive as well as editable.

Follow some simple rules to set up your Figma file for clean output.
Connect your Figma account, then start a project in Cannoli.
Paste in your Figma canvas url with an artboard that you want coded into email.
We’ll code the Figma design as best we can, then you can do last mile prep, like links, Preview and more.
Once you’ve set up some Cannoli files, we’re sure you’ll be able to edit and adapt these to new emails and ideas, to super charge your workflow!
Cannoli screenshot

Kickstart your Cannoli design with our plug in

If you’re having any trouble with MJML and Cannoli hierarchy, be sure to download our Figma plugin which will help you build the perfect Figma files for the perfect Cannoli output.

Even more resources

Whether you want to learn more about MJML, how to set up your own Cannoli design system and more tips, we have you covered, check out our gitbook for in depth tutorials or our youtube channel.

Cannoli bites
Trusted by some of the world's fastest growing brands.
notion
vivino
resy
thefarmersdog
angi
pucknews
lovevery
diaco
goodeggs
thinx
parsleyhealth
ellenshop
peerspace
mightynetworks
teacherspayteachers
helixsleep

Join the newsletter for updates

hello@scalero.io +1 510-394-2442San Francisco, CaliforniaMexico City, MexicoCopenhagen, Denmark