---
title: "Hover Text Warp — Framer component · Best of Framer"
description: "$5.00 · Framer component · by Aidan Looker · Text. What is Hover Text Warp?"
canonical: "https://framer.elliotli.dev/component/hover-text-warp"
---

[Home](/)/[Components](/components)/[Text](/components/category/text)/Hover Text Warp

# Hover Text Warp

Liquid text warps toward your cursor

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

![Hover Text Warp preview image 1](https://framer.elliotli.dev/og/component/hover-text-warp/224e85bd034eaef2/1600x1200.jpg)

## Summary

What is Hover Text Warp?

## Description

## What is Hover Text Warp?

Hover Text Warp is a fully interactive text component powered by liquid spring physics. Each letter independently warps, scales, and rotates toward the cursor with smooth, organic motion. A chain-reaction system spreads movement between neighbouring letters for a fluid, living feel. Perfect for hero sections, landing pages, portfolio headers, and any layout that needs a premium interactive detail.

[![](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

-   Physics-based spring animation with per-letter warp, scale, rotation, and glow
    
-   Chain-reaction propagation that spreads motion between neighbouring characters
    
-   Proximity-based glow with pulsing highlight and optional drop shadow
    
-   Full extended font control with family, weight, size, line height, and letter spacing
    
-   Touch-optimised with automatic mobile detection and enlarged interaction radius
    

## Controls inside Framer

### Text

-   Text content with multi-line support
    

### Font

-   Font family, weight, size, line height, and letter spacing
    

### Colors

-   Text colour
    
-   Glow colour
    

### Effect

-   Radius — how far the warp influence reaches
    
-   Intensity — strength of the displacement
    
-   Smoothness — higher values produce more fluid, slower motion
    
-   Glow — intensity of the proximity-based light effect
    

### Appearance

-   Shadow toggle
    
-   Background colour
    

## Best use cases

-   Hero sections and above-the-fold headlines that demand attention
    
-   Portfolio and agency landing pages showcasing creative craft
    
-   Product launch pages where interactive polish drives conversions
    
-   Personal sites and experimental layouts that reward cursor exploration
    

## 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 · #11288

## Details

- **Author**: Aidan Looker
- **Price**: $5.00
- **Published**: 2026-02-26
- **Updated**: 2026-06-13
- **Added**: 2026-02-22
- **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