nextui.dev
Home
Docs
Saved
Pricing
Components37
  • Forms & inputs7
  • Cards13
  • Buttons, badges & avatars8
  • Feedback & display6
  • Effects3
Agents17
  • Chat inputNew
  • Task checklistNew
  • ReasoningNew
  • Tool callNew
  • Tool approvalNew
  • SourcesNew
  • Agent timelineNew
  • Artifact panelNew
  • Streaming messageNew
  • Conversation shellNew
  • Voice agentNew
  • Voice orbNew
  • Thinking ring
  • Thinking waveNew
  • Thinking sparkle
  • Thinking bot
  • Prompt deckNew
Blocks20
  • Agent chatNew
  • Pill heroNew
  • Grid hero
  • Moodboard generatorNew
  • Waitlist heroNew
  • Intro bannerNew
  • Creative home heroNew
  • Chat heroNew
  • App shelfNew
  • Usage card
  • Design resultsNew
  • Pricing tiers
  • Dashboard home
  • The shiftNew
  • Launch perksNew
  • Testimonials
  • Quote
  • Team
  • Leads tableNew
  • Sign in
Pages10
  • ASCII workspace$49
  • CRM overviewNew
  • Marketing dashboardNew
  • Developer portfolio$49
  • Particle landing$49
  • Particle story$49
  • Statement converter$49
  • AI photo studio$49
  • Group card launch$49
  • Month-end storyNew
Themes9
  • Default
  • Ember
  • Ocean
  • Forest
  • Grape
  • Rose
  • Amber
  • Clay
  • Brutal
Upgrade
nextui.dev

nextui components, blocks and themes you install with one command.

Product

  • Components
  • Blocks
  • Themes
  • Pricing

Resources

  • Docs
  • Roadmap
  • GitHub

Legal

  • License
  • Privacy
  • Terms
  • Refunds

nextUI

[ 200 OK ] · nextUI

© 2026 NEXTUI • All rights reserved.

Upgrade
ComponentsAI & agentsThinking wave
Copy promptCopy prompt

Customize

Status text with the shimmer sweep

JSX · copied with Copy prompt

<AgentWave />

Thinking waveNew

Thinking indicator: a breathing wave orb and a shimmering label.

Installation

Set your access key from API keys as NEXTUI_TOKEN in .env.local and add the @nextui namespace below to components.json once. Then every item installs by name. Each install counts as a copy on a free account.

$pnpm dlx shadcn@latest add @nextui/thinking-wave
1{
2 "registries": {
3 "@nextui": {
4 "url": "https://nextui.dev/r/{name}.json",
5 "headers": { "Authorization": "Bearer ${NEXTUI_TOKEN}" }
6 }
7 }
8}

Usage

1import { AgentWave } from "@/components/nextui/thinking-wave";
2
3export function Example() {
4 return <AgentWave label="Searching your docs..." className="justify-start" />;
5}

API reference

Edit props live in the preview above, or see all 2 props
PropTypeDefaultDescription
labelstring"Agent thinking..."Status text with the shimmer sweep
classNamestring–Extra class on the root

Related

All components

Chat inputNew

Task checklistNew

ReasoningNew

Sign in to see the code

Preview it freely. A free account copies code and prompts a few times a day.

Sign in