Pulse Button
An animated button with a pulsating effect using Tailwind CSS
Freebuttonanimationpulsetailwind
Installation
Run the following command:
npx oonkoo add pulse-buttonAdditional CSS Setup
This component requires additional CSS. Add the following to your globals.css file:
globals.css
Add the following CSS to your globals.css file:
@keyframes pulse {
0%, 100% {
box-shadow: 0 0 0 0 var(--pulse-color);
}
50% {
box-shadow: 0 0 0 8px var(--pulse-color);
}
}
.animate-pulse {
animation: pulse var(--duration, 1.5s) ease-out infinite;
}Usage
Import the component in your file:
import { PulseButton } from "@/components/oonkoo/pulse-button"