Syed Hasnain

Thinking Shimmer

AI chats 2

About

A quiet live status that keeps the agent current action readable while work continues.

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

Code

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

Usage.tsx

import ThinkingShimmer from '@/components/ui/thinking-shimmer'

export default function Demo() {
  return <ThinkingShimmer label="Reviewing 576 registry components" />
}

Dependencies

More by Syed Hasnain

View all
  • Color Picker

    Color Picker

    92
  • Cost Meter

    Cost Meter

    31
  • Message Scroller

    Message Scroller

    26
  • Quota Banner

    Quota Banner

    21
  • Background Inbox

    Background Inbox

    20
  • Commit

    Commit

    19
  • Image Generation Loader

    Image Generation Loader

    18
  • Attachments

    Attachments

    17

More in AI chats

View all
  • AI Actions

    AI Actions

    322
  • Message Thread

    Message Thread

    40
  • Agent Chat

    Agent Chat

    17
  • AI Task List

    AI Task List

    161
  • Code Block

    Code Block

    11
  • System Message

    System Message

    56
  • Message With Header And Delivery Status

    Message With Header And Delivery Status

    39
  • Suggestions

    Suggestions

    29

Explore more

Part of Pasta UI — browse the full library on 21st.dev.