Animated Subscribe Button

Docs

An animated subscribe button useful for showing a micro animation from intial to final result.

Installation

import { AnimatedSubscribeButton } from "@/components/magicui/animated-subscribe-button";

<AnimatedSubscribeButton>
  <span>Follow</span>
  <span>Subscribed</span>
</AnimatedSubscribeButton>

Prop	Type	Default	Description
`subscribeStatus`	`boolean`	`false`	A boolean flag to check the condition for the button. This property can be used to toggle the button's state, such as subscribed or unsubscribed.
`children`	`React.ReactNode`	`-`	The content to be displayed inside the button. Should contain two children - first for unsubscribed state and second for subscribed state.
`className`	`string`	`-`	Optional class name to be applied to the button for custom styling.

Contribute