Pensando…
HTML + CSSLoaders
AI thinking text loader
A pulsing sparkle and a label with a light sweeping across it, like an assistant thinking.
Settings
16px
1x
Code
<div class="uv-lat" role="status"><span class="st" aria-hidden="true"><svg viewBox="0 0 24 24"><path d="M12 2l2.2 6.3L20.5 10l-6.3 2.2L12 18.5l-2.2-6.3L3.5 10l6.3-1.7z"/></svg><i></i><i></i></span><span class="tx">Thinking…</span></div>Prompt for AI
Paste it into ChatGPT, Claude or Cursor and it will adapt the block to your project with these settings, even if you don’t use React.
More in Loaders
See all LoadersWhere to use it
Chat assistants have made the thinking state familiar: a small sparkle that breathes and a label with a soft shimmer running through it. This loader recreates that pattern inline, so it fits inside a chat bubble, below a prompt box or in a button while a request is processed. Two tiny dots twinkle around the star.
The label is editable, so it can say Thinking, Writing or Searching. The gradient runs between your two colors on top of a muted base, which keeps the text readable in both light and dark themes.