---
title: "Email Promotion — Framer component · Best of Framer"
description: "$7.00 · Framer component · by Aidan Looker · Text. What is Email Promotion?"
canonical: "https://framer.elliotli.dev/component/email-promotion"
---

[Home](/)/[Components](/components)/[Text](/components/category/text)/Email Promotion

# Email Promotion

Animated customisable Gmail inbox.

[View on Framer](https://framer.com/marketplace/components/email-promotion/?via=elliot-li)

![Email Promotion preview image 1](https://framer.elliotli.dev/og/component/email-promotion/2a3d965401c45515/1600x1200.jpg)

## Summary

What is Email Promotion?

## Description

## What is Email Promotion?

Email Promotion animates emails arriving into an inbox one by one. Use it to showcase how your brand's promotional emails, newsletters, or transactional messages look in a real inbox — giving visitors instant context for your email marketing, notification system, or communication platform. Ideal for landing pages, case studies, product demos, and pitch decks.

[![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-8vjwbcr2-RQLDut7AgLOovQEwgaJNpNG4n3n3B6)](https://teampixelau.lemonsqueezy.com/checkout/buy/3b016e8d-2ba4-4944-8431-e2c592334df1)

## Core Features

-   Email UI with search bar, toolbar, and category tabs (Primary, Promotions, Social)
    
-   Staggered email arrival animation with configurable speed and optional looping
    
-   Light and Dark theme with full color override system across every UI element
    
-   Per-email customisation: sender name, subject line, preview text, timestamp, starred and unread states
    
-   Five independent font controls for sender, subject, preview, tabs, and base text
    
-   Visibility toggles for search bar, toolbar, and tab bar — use the full Gmail frame or just the inbox rows
    
-   Pauses animation when off-screen for optimal performance
    

## Controls inside Framer

### Content

-   Emails (array of up to 20 items, each with sender, subject, preview, time, starred, and unread toggles)
    

### Appearance

-   Theme (Light / Dark)
    
-   Border Radius
    

### Animation

-   Speed (Slow / Medium / Fast)
    
-   Loop (On / Off)
    

### Visibility

-   Search Bar (Show / Hide)
    
-   Toolbar (Show / Hide)
    
-   Tab Bar (Show / Hide)
    

### Layout

-   Sender Width (80–250px)
    

### Colors

-   Background
    
-   Text
    
-   Text Muted
    
-   Row Borders
    
-   Star
    
-   Accent (active tab)
    

### Typography

-   Base Font
    
-   Sender Font
    
-   Subject Font
    
-   Preview Font
    
-   Tab Font
    

## Best use cases

-   Ecommerce and DTC landing pages showcasing promotional email campaigns, sale announcements, and loyalty programs
    
-   SaaS and email marketing platforms demonstrating deliverability, inbox placement, or template previews
    
-   Agency portfolios and case studies presenting email marketing work with a realistic inbox context
    
-   Product demo sections illustrating notification systems, onboarding sequences, or transactional emails
    

Drop it onto your canvas, swap in your brand name and messaging, and let the animated inbox sell the experience for you.

## Questions or custom requests?

We design and build custom Framer components. Get in touch at [**contact@teampixel.com.au**](mailto:contact@teampixel.com.au).

## Rank history [How rankings work →](/terms#rankings)

-   All · #9525

## Details

- **Author**: Aidan Looker
- **Price**: $7.00
- **Published**: 2026-04-22
- **Updated**: 2026-06-13
- **Added**: 2026-04-12
- **Categories**: Text

## More like this

-   [Text Reveal Effect](/component/text-reveal-effect) — Lera · $4 — Text reveal effect over "ghost" layer.
-   [Soft Heading](/component/soft-heading) — Kaisa A · Free — Animated Soft Heading in 2 colors
-   [Curved Text Marquee](/component/curved-text-marquee) — Ahmet Loca · Free — Animated Bend
-   [Type Write Effect](/component/type-write-effect) — Russet Supply · Free — Animated Text & Interactive Typing