HTML + CSSButtons
Pulsing gradient button
A gradient button whose colored shadow slowly breathes in and out, all the time.
Settings
16px
1x
Code
<button class="uv-pulse">Buy now</button>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 Buttons
Where to use it
A pulsing button keeps gently asking for attention, so give it the action that pays the bills: “Buy now” on a product page, “Book your stay” on a small hotel site or “Claim the offer” during a sale. The gradient and the breathing glow make a CSS pulse animation that is noticeable without blinking.
Use it once per page. If the layout already has a moving background or a carousel, the pulse will compete with them and lose. Close colors in the gradient look more refined; very different ones feel louder and more promotional.