---
title: "Pro Typewriter Text — Free Framer component · Best of Framer"
description: "Free Framer component · by mehul · Text. Screenshots, details, and remix links on Best of Framer."
canonical: "https://framer.elliotli.dev/component/pro-typewriter-text"
---

[Home](/)/[Components](/components)/[Text](/components/category/text)/Pro Typewriter Text

# Pro Typewriter Text

Premium typewriter animation

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

![Pro Typewriter Text preview image 1](https://framer.elliotli.dev/og/component/pro-typewriter-text/601786ef194da417/1600x1200.jpg)

## Summary

Premium typewriter animation

## Description

Typewriter Text brings a clean, premium typewriter animation to Framer - perfect for hero headlines, taglines, and short paragraphs.

## Version 1 - Core Features

**30 Jan 2026**

-   Character or Word typing
    
-   Paragraph mode with line breaks
    
-   Delete or Fade loop styles
    
-   Smart Pause for punctuation
    
-   Bar / Block / Underscore caret
    
-   Optional caret glow
    
-   Highlight + Scramble effects
    
-   Stable height + max line clamp
    
-   Gradient text support
    
-   Framer Font control
    

## Version 2 - New Updates ✨

**23 April 2026**

1.  Gradient typing trail effect
    
2.  Gradient resets to solid after typing
    
3.  Improved caret alignment
    
4.  SVG rendering for Canvas + Preview consistency
    
5.  Better font rendering
    
6.  Improved multi-line spacing
    
7.  Cleaner loop transitions
    

## Version 2.1 - Refinements ✨

**31 Aug 2026**

1.  New gradient completion modes: **Solid / Full Gradient / Keep Trail / Fade Trail**
    
2.  Smoother gradient transitions between lines
    
3.  Improved caret sizing + X/Y alignment controls
    
4.  New Custom Caret option
    
5.  New delete modes: **Chars / Words / Line / Instant**
    
6.  Better Word mode + blank-line support
    
7.  New Line Smart Pause
    
8.  Improved Stable Height
    
9.  Reduced Motion + offscreen performance controls
    

## How to use

-   Add your copy in **Text**
    
-   Choose **Chars or Words**
    
-   Adjust typing and pause timing
    
-   Customize Cursor and Gradient
    
-   Optional: enable Highlight, Scramble, or Glow
    

## Best for

-   Hero headlines
    
-   Landing page taglines
    
-   SaaS websites
    
-   Product micro-interactions
    
-   Portfolio and marketing text
    

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

-   All · #608

## Details

- **Author**: mehul
- **Published**: 2026-01-27
- **Updated**: 2026-08-31
- **Added**: 2025-12-31
- **Categories**: Text

## More like this

-   [Hover Stretch Text](/component/hover-stretch-text) — 584.studio · $3 — Responsive & fully customizable
-   [Type Write Effect](/component/type-write-effect) — Russet Supply · Free — Animated Text & Interactive Typing
-   [Odometer Stats](/component/odometer-stats) — Pixlify · Free — Rolling number counters
-   [Clipped Words](/component/clipped-words) — Interface Studio · $5 — Words With a Little Chaos