---
title: "ASCII Hero — Free Framer component · Best of Framer"
description: "Free Framer component · by Anux · Backgrounds. ASCII Hero — Features 12 shapes — Knot, Torus, Sphere, Earth, Mars, Box, Icosahedron, Capsule, Stripes, Framer Logo, Waves, Blob Real Earth —…"
canonical: "https://framer.elliotli.dev/component/ascii-hero"
---

[Home](/)/[Components](/components)/[Backgrounds](/components/category/backgrounds)/ASCII Hero

# ASCII Hero

Interactive 3D ASCII characters

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

![ASCII Hero preview image 1](https://framer.elliotli.dev/og/component/ascii-hero/d3e3a6aed51c736e/1600x1200.jpg)

## Summary

ASCII Hero — Features 12 shapes — Knot, Torus, Sphere, Earth, Mars, Box, Icosahedron, Capsule, Stripes, Framer Logo, Waves, Blob Real Earth — actual NASA-derived continents with…

## Description

Interactive 3D hero backgrounds rendered as live ASCII characters. Twelve shapes, custom glyphs, light & dark themes. Built in Framer with three.js.

## **ASCII Hero — Features**

-   **12 shapes** — Knot, Torus, Sphere, Earth, Mars, Box, Icosahedron, Capsule, Stripes, Framer Logo, Waves, Blob
    
-   **Real Earth** — actual NASA-derived continents with separate Land / Sea colors
    
-   **Sphere textures** — Plain, Rings, or Halftone
    
-   **Custom character set** — any glyphs, dark → bright
    
-   **Cursor steering** + auto-spin with speed control
    
-   **Theme-aware colors** — bind to color styles, flips with light/dark mode
    
-   **Position & zoom** — place the shape anywhere, even off-canvas
    
-   **Performance-minded** — pauses offscreen, static frame on canvas, respects reduced motion
    

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

-   All · #1942

## Details

- **Author**: Anux
- **Published**: 2026-07-17
- **Updated**: 2026-07-21
- **Added**: 2026-07-17
- **Categories**: Backgrounds

## More like this

-   [Pixel Flicker](/component/pixel-flicker) — Design Foundry · $10 — premium animated pixel background
-   [Fractal Glass Wave](/component/fractal-glass-wave) — Hienn Ng · $3 — Dynamic Fractal Glass Background
-   [Particle Flow Pro](/component/particle-flow-pro) — Interface Studio · $10 — Bring Your Background to Life
-   [Silk Gradient](/component/silk-gradient) — Kaisa A · Free — Silk Gradient Background