---
title: "Text Zoom Distort — Framer component · Best of Framer"
description: "$5.00 · Framer component · by Artem Kostenko · Text. Text Zoom Distort is a seamless horizontal text strip built for expressive headline motion in Framer."
canonical: "https://framer.elliotli.dev/component/text-zoom-distort"
---

[Home](/)/[Components](/components)/[Text](/components/category/text)/Text Zoom Distort

# Text Zoom Distort

Zooming strip; weight reacts to cursor.

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

![Text Zoom Distort preview image 1](https://framer.elliotli.dev/og/component/text-zoom-distort/f1e2cabc27a2b9dd/1600x1200.jpg)

## Summary

Text Zoom Distort is a seamless horizontal text strip built for expressive headline motion in Framer.

## Description

Text Zoom Distort is a seamless horizontal text strip built for expressive headline motion in Framer. It repeats short or long copy edge-to-edge and reacts to pointer proximity by scaling nearby glyphs and interpolating weight between Min Weight and Max Weight.

For best results, use a variable font and set Font variant to Variable or Variable Italic so weight animation runs on the wght axis. Static fonts are supported, but transitions may appear less continuous.

Controls include text, color, font, min/max weight, zoom size, influence radius, smoothing, speed, direction, and vertical lock. Lock Vertical keeps line height visually stable while letters scale, preventing layout jump in dense hero sections.

The component is designed as a single focused interaction primitive: drop it into a hero, set your copy and typography, and tune the motion profile for brand tone—from subtle editorial emphasis to bold kinetic type.

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

-   All · #6032

## Details

- **Author**: Artem Kostenko
- **Price**: $5.00
- **Published**: 2026-06-05
- **Updated**: 2026-06-05
- **Added**: 2026-06-02
- **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