OfferButton is a responsive, animated pill-style call-to-action button designed for high-impact promotions, flash sales, and limited-time offers. Floating tags, dynamic borders, and smooth micro-interactions create a refined and engaging user experience. The component automatically adapts to your text, typography, padding, and layout settings while maintaining consistent proportions.
Auto-resizing pill button that adjusts to text length
Floating promotional tags for time-sensitive messages
Independent font controls for the button, top tag, and bottom tag
Adjustable padding for full layout flexibility
Hover, press, and border animations with four selectable motion styles
Tag color, text color, and background customization
Optional link support to direct users to any URL
Adjustable text shadow for improved readability or minimal design styles
ContentButton Label, Top Tag Text, Bottom Tag Text, Button Link
TypographyButton Font, Top Tag Font, Bottom Tag Font, Text Size, Text Color
AppearanceButton Color, Tag Background, Tag Text Color, Text Shadow settings
LayoutPadding X, Padding Y
Animation StyleClassic, Dramatic, Playful, Minimal
Flash sales and limited-time offers
Pricing sections and landing page CTAs
Product launches and promotional highlights
Upgrade prompts and feature callouts
If you need help setting up or customizing the component, you can reach out anytime for assistance.
OfferButton is a responsive, animated pill-style call-to-action button designed for high-impact promotions, flash sales, and limited-time offers. Floating tags, dynamic borders, and smooth micro-interactions create a refined and engaging user experience. The component automatically adapts to your text, typography, padding, and layout settings while maintaining consistent proportions.
Auto-resizing pill button that adjusts to text length
Floating promotional tags for time-sensitive messages
Independent font controls for the button, top tag, and bottom tag
Adjustable padding for full layout flexibility
Hover, press, and border animations with four selectable motion styles
Tag color, text color, and background customization
Optional link support to direct users to any URL
Adjustable text shadow for improved readability or minimal design styles
ContentButton Label, Top Tag Text, Bottom Tag Text, Button Link
TypographyButton Font, Top Tag Font, Bottom Tag Font, Text Size, Text Color
AppearanceButton Color, Tag Background, Tag Text Color, Text Shadow settings
LayoutPadding X, Padding Y
Animation StyleClassic, Dramatic, Playful, Minimal
Flash sales and limited-time offers
Pricing sections and landing page CTAs
Product launches and promotional highlights
Upgrade prompts and feature callouts
If you need help setting up or customizing the component, you can reach out anytime for assistance.
