---
title: "Rotating Text Circle — Framer component · Best of Framer"
description: "$4.00 · Framer component · by Made by Marchal · Text. Rotating circular text with hover effect"
canonical: "https://framer.elliotli.dev/component/rotating-text-circle"
---

[Home](/)/[Components](/components)/[Text](/components/category/text)/Rotating Text Circle

# Rotating Text Circle

Rotating circular text with hover effect

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

![Rotating Text Circle preview image 1](https://framer.elliotli.dev/og/component/rotating-text-circle/b4a193eb6a641c48/1600x1200.jpg)

## Summary

Rotating circular text with hover effect

## Description

## Full Description

Create eye-catching circular text that rotates smoothly around a center point. Perfect for hero sections, badges, logos, and modern design elements that need to stand out.

### Why This Component?

Traditional text is flat and static. This component transforms your words into dynamic, rotating circular designs that immediately grab attention. The smooth 60fps animation and interactive hover effect create a premium, polished feel that elevates any design.

**Perfect for:**

-   Hero sections that wow visitors
    
-   Animated brand badges and seals
    
-   Circular logos and emblems
    
-   Award certificates and achievements
    
-   Portfolio highlights
    
-   Product showcases
    

### What You Can Customize

**Content (What it says):**

-   **5 Word Inputs**: Add up to 5 words that flow around the circle
    
-   **Icon Separator**: Choose from 100+ icons (stars, hearts, dots, arrows, etc.) to separate your words
    

**Typography (How it looks):**

-   **Font Family**: 20 Google Fonts + custom font support
    
-   **Font Size**: Customizable from subtle to bold
    
-   **Font Weight**: Thin (100) to Black (900)
    
-   **Text Color**: Match your brand perfectly
    
-   **Icon Color**: Style icons independently
    

**Animation:**

-   **Rotation Speed**: Control how fast it spins
    
-   **Hover Speed**: Automatically slows down when users hover over it
    
-   **Direction**: Spin clockwise or counter-clockwise
    
-   **Smooth Transitions**: No jumps or stutters - just smooth motion
    

### How It Works

1.  Drop it on your canvas
    
2.  Type your words
    
3.  Pick a font, icon and colors
    
4.  Adjust the speed
    
5.  Done! It just works.
    

![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-iwyc2eae-ZKooN9fOqMPLTUMyDBIxQnAGssKBz3)

**Examples**

![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-ujapdmed-C3bv9gEEp0OwboCyRAQ3c1ciyEHJEw)![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-ujapdmed-amp2iIcafwuxud8IahMd6yMdAGGl0W)![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-ujapdmed-N1o1YBsiJTZug0GibRiTeuaVbs068o)

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

-   All · #8531

## Details

- **Author**: Made by Marchal
- **Price**: $4.00
- **Published**: 2026-02-16
- **Updated**: 2026-02-16
- **Added**: 2026-01-29
- **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