Type Orbit

3D kinetic typography that endlessly rotates on a torus knot.

One-time payment
Lifetime updates
Commercial license
Live Preview

Overview

3D kinetic typography that endlessly rotates on a torus knot.

  • 3D dimensional typography
  • Smooth endless texture loop
  • Interactive auto-rotation
  • Fully customizable colors and fonts

Type Orbit

Create mesmerizing 3D text animations with Type Orbit. This component maps your text onto a complex torus knot geometry, creating an endless loop of kinetic typography that grabs attention.

Features

3D Text Mapping Your text is rendered into a texture and wrapped seamlessly around a 3D torus knot.

Kinetic Motion The text scrolls endlessly along the geometry, creating a hypnotic flow effect.

Interactive 3D Includes auto-rotation that can be adjusted or combined with mouse interactions.

Customizable Styling Full control over text colors, background colors, and typography to match your brand.

Use Cases

Hero Headlines — Create a bold, sculptural statement piece above the fold.

Feature Highlights — Use keywords that orbit around a central point.

Creative Footers — Add depth and movement to the bottom of your page.

How to Use

Installation

  1. Copy the component URL
  2. Open your Framer project
  3. Paste the component (Cmd/Ctrl + V)

Customization

Text & Font Enter your text and select any font. Thicker, bolder fonts (like Arial Black or Inter Black) tend to read better on the 3D geometry.

Colors

  • Text Color: The color of the letters.
  • Torus Color: The "background" color of the torus knot itself.

Animation

  • Scroll Speed: How fast the text moves along the path.
  • Auto Rotate: Enable/disable global rotation.
  • Rotate Speed: How fast the object spins in space.

Quick Tips

Font Choice — Bold, uppercase fonts work best to maintain legibility when wrapped around the 3D shape.

Contrast — Ensure good contrast between Text Color and Torus Color for readability.

Performance — This component uses Three.js. It's optimized, but avoid having too many complex 3D instances on a single mobile page.

License

Single Use License — Use in one client project with full commercial rights. No redistribution. 1 license = 1 client.

Refund Policy

Due to the nature of our digital products, we are unable to offer refunds, but we're here to assist you with any questions or concerns!

Type Orbit - $5

3D kinetic typography that endlessly rotates on a torus knot.

One-Time Payment
Lifetime Access
Unlimited sites

You might also like

Why Choose Framer Hub Components

Loved by Framer teams

Used by Framer professionals who need premium, no-code experiences.

"The Best Framer CMS Filtering Plugin I've Found — Truly a Game-Changer. I've tested a lot of Framer CMS filtering and sorting components — both free and paid — and this is by far the best one I've come across."
Pierre Azalbert
"He really helped me out when I needed assistance adding it to my Framer project. Super fast customer support highly recommend!"
Salman Abdulrazaq Ali
"We had tried a couple of other Framer CMS filter components but they were buggy, hard to use and support was slow or non-existent. FramerCMSFilter is easier to use and has a lot of added functionality."
Mark Williamson

Got questions? We've the answers

Got questions? We've the answers

Everything you need to know about FramerHub.