---
title: "Type Orbit"
canonical_url: "https://framerhub.io/components/type-orbit"
last_updated: "2026-06-15T14:46:32.059Z"
---

## 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.

![Type Orbit Preview](/framerhub/img/components/control/type-orbit.jpg)

## 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!
