Effect

Glyphs

A ring of glowing symbols circling the object, each one morphing into the next and lighting up under the cursor. Use for magic, arcane and sci-fi UI.

  • glyphs
  • runes
  • magic
  • arcane
  • mystical
  • floating-symbols

Settings and defaults

Intensity
1
Opacity
0.9
Ring Color
#ff00ff
Glyphs Color
#ff00ff
Shades Multiplier
0.5
Glyph Count
30
Ring Radius
1.2
Rotation Speed
0.5
Morph Speed
0.3
Hover Color
#ffeb99
Hover Radius
0.5
Hover Intensity
2

Glyphs puts a flat ring of glowing symbols around an object. The ring turns slowly and each symbol keeps changing shape, dissolving into the next, like an arcane seal or a holographic interface. Move the pointer over it and the symbols under the cursor light up in a highlight colour.

How it works

The ring is divided into cells, one symbol per cell. Each symbol is assembled from a few simple strokes picked at random, bars, circles, diagonals, crosses and spokes, which makes them read as runes or alien script without being any real alphabet. On a regular beat each cell picks a new combination and crossfades into it; every cell runs on its own offset, so they never change all at once. Each cell can take a slightly different tint, and when the pointer comes near, the symbols within a set radius blend toward the hover colour and brighten.

Settings

  • Glyph Count: how many symbols sit around the ring.
  • Rotation Speed: how fast the ring turns; negative reverses it.
  • Morph Speed: how often the symbols change.
  • Glyphs Color and Ring Color.
  • Shades Multiplier: how much the tint varies from symbol to symbol.
  • Hover Color, Hover Radius and Hover Intensity: the cursor highlight.

Use it for

Magic circles and spells, fantasy game UI, sci-fi interfaces, interactive hero sections. The Holographic Glyph Ring cursor carries the same ring on the pointer, and the Glyph Ring material puts it on a surface.

Code and API

Ready-to-paste React Three Fiber code and the 3DRise API are included in paid plans, inside the studio.

See plans

More effects

Works well with