---
title: "WordDrum — Framer component · Best of Framer"
description: "$10.00 · Framer component · by Hamim Reza · Text. WordDrum stacks a repeating word into rows for Framer, each one cycling through its own squeeze, tilt, and brightness wave, like a wall…"
canonical: "https://framer.elliotli.dev/component/worddrum"
---

[Home](/)/[Components](/components)/[Text](/components/category/text)/WordDrum

# WordDrum

Rotating drum wall of words

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

![WordDrum preview image 1](https://framer.elliotli.dev/og/component/worddrum/887085c96b2b77a2/1600x1200.jpg)

## Summary

WordDrum stacks a repeating word into rows for Framer, each one cycling through its own squeeze, tilt, and brightness wave, like a wall of tiny spinning drums instead of one…

## Description

WordDrum stacks a repeating word into rows for Framer, each one cycling through its own squeeze, tilt, and brightness wave, like a wall of tiny spinning drums instead of one circular spin.

Every other spinning-text component puts words on a single circular path or one rotating cylinder line. WordDrum stacks many rows at once, each phase-offset from its neighbors, so the whole wall ripples instead of moving as one shape.

### **WHAT IT DOES**

Add one or more words, and WordDrum repeats them down as many rows as you choose. Each row cycles through a cosine-based squeeze and tilt, brightening and dimming, so the stack reads as a shimmering drum wall. Hover or press any row and it grows toward an accent color while the rest keeps cycling.

### **KEY FEATURES**

-   Many independently phased rows, not one circular or single-line spin
    
-   Cosine-driven squeeze, tilt, and brightness cycle per row
    
-   Hover or touch any row to grow it toward an accent color
    
-   Adjustable cycle speed, drift amplitude, and hover responsiveness
    
-   Smooth edge fade at top and bottom, blends into the background
    
-   Resolves any color format, hex, rgba, named colors, or shared color styles
    
-   Static-safe rendering settles rows into a clean resting pose
    
-   Runs entirely on MotionValues, no per-frame React re-renders
    
-   Full typography controls
    
-   Zero third-party dependencies beyond Framer Motion
    

### **WHY IT WORKS**

A single spinning circle or cylinder is familiar by now. A wall of words each cycling on its own offset drum reads as a living surface, more texture than typography, and the hover response gives visitors a reason to interact with it.

### **PERFECT FOR**

Hero section backdrops, brand statement walls, agency landing pages, and any Framer site that wants a kinetic typographic backdrop instead of a static headline.

### **WHAT'S INCLUDED**

A single drop-in component. Add your words, set the row count, then tune cycle speed, colors, and hover behavior through property controls.

Drop it in, add your words, and let the wall spin.

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

-   All · #4105

## Details

- **Author**: Hamim Reza
- **Price**: $10.00
- **Published**: 2026-09-16
- **Updated**: 2026-09-16
- **Added**: 2026-09-16
- **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