Grotto Slice
One click to turn Figma emails into drag-and-drop Klaviyo templates.
Plugin Preview
About this plugin
Design your emails in Figma. Send them to Klaviyo in one click. Grotto Slice creates real drag-and-drop editable templates directly to your Klaviyo account.How it works:1. Select your email frame in Figma2. Pick your brand3. Click "Send to Klaviyo"Your design is automatically sliced into optimized sections, compressed for inboxes, and uploaded as a fully editable Klaviyo drag-and-drop template.What makes it different:- Drag-and-drop editable: Templates land in Klaviyo's drag-and-drop editor so your team can edit text, swap images, and rearrange sections without touching code- Smart slicing: Detects natural section boundaries (color changes, content gaps) for pixel-perfect rendering across all email clients- AI-generated alt text: Every section gets accessible alt text automatically, improving deliverability and accessibility- Auto-detect links: Reads your Figma prototype interactions (On Click > Open Link) and maps them to the correct email sections- Auto-detect footer: Keeps your footer intact as a single section, just name a group "Footer" in Figma- Auto-detect preview text: Pulls preview text from a "Preview Text" group in your Figma file- Retina-ready: Images exported at 1200px wide (2x) with optimized JPEG compressionRequirements:- A Grotto Slice account (sign up at slice.grottodigital.com)- A Klaviyo account with API accessSee Our Setup Guide HERE >> Watch Training Videos Here >>Privacy policy
Plugin Details
| Version | 5 |
|---|---|
| Created | March 14, 2026 |
| Last Updated | April 15, 2026 |
| Category | Import & export plugins |
| Creator | Ethan |
| Stats | 6 installs, 7 likes |
| Pricing | Free |
Technical Details
- API:1.0.0
- UI:dist/ui.html
- main:dist/main.js
- Document Access:dynamic-page
- Network Access:
Connect to Grotto Slice backend for authentication and image processing. Google Fonts used for UI typography.
- Editor Types:figma
- Allowed Domains:
- https://fonts.googleapis.com
- https://fonts.gstatic.com
- https://nvowpqdlcusmkbyrtyhr.supabase.co
More Like This
Discover other plugins in the Import & export plugins category.
html.to.design — by ‹div›RIOTS — Import websites to Figma designs (web,html,css)
Convert any website into fully editable Figma designs
Anima - Figma to Code React, HTML, CSS, Tailwind, MUI (DevMode Inspect React / HTML / Vue / CSS)
Anima - AI Powered Design to code
Figma to HTML
Convert Figma design to HTML