Speaking Orb

A particle-sphere avatar for a voice assistant that swells and sends lit rings with every syllable while it talks, flies each spoken word out as particles that land as a live caption, and reacts to level/mic input while idle.

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

"use client";

import * as React from "react";
import SpeakingOrb from "@/components/ui/speaking-orb";

export default function SpeakingOrbThinkingDemo() {
  return (
    <div className="flex w-full items-center justify-center bg-[#07070c] p-10 text-[#f4f1fa]">
      <div className="w-full max-w-[380px]">
        <SpeakingOrb state="thinking" />
      </div>
    </div>
  );
}