Meng To

Character Wave

Shaders 46

About

A full-frame interactive WebGL scene that arranges character portrait cards into an animated wave you can explore with the pointer or arrow keys.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Character Wave to your project and fits it to your theme.

Code

How Character Wave is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import { CharacterWave } from "@/components/ui/character-wave";

export default function Default() {
  return (
    <div className="w-full h-screen">
      <CharacterWave />
    </div>
  );
}

More by Meng To

View all
  • Gateway Flow

    Gateway Flow

    1.8K
  • Glassmorphism CTA

    Glassmorphism CTA

    820
  • Globe Type Study

    Globe Type Study

    767
  • Particle Drift

    Particle Drift

    706
  • Generative Tree

    Generative Tree

    610
  • Topo Field

    Topo Field

    576
  • Dot Border Button

    Dot Border Button

    509
  • Spark Badge

    Spark Badge

    477

More in Shaders

View all
  • Glass Fold

    Glass Fold

    280
  • Phosphor 30

    Phosphor 30

    293
  • Shader Animation

    Shader Animation

    3.7K
  • Shader Background

    Shader Background

    2K
  • Black Hole

    Black Hole

    27
  • Wave

    Wave

    693
  • Waves shaders Homlu UI

    Waves shaders Homlu UI

    99
  • Shader Lines

    Shader Lines

    2.3K