Promo PillFree

Translucent offer marker with a low-frequency glow pulse and optional dismiss.

Add to your project

Checking access...

Claude*

Codex*

Lovable

Base44

Figma Make

Replit*

Cursor*

* Compatible with most projects that use the default React/Next.js framework.

React

Tailwind CSSFramer Motion

Prop	Type	Description
`label`	`string`	Pill copy
`icon`	`ReactNode`	Optional leading mark (node or emoji string)
`tone`	`'neutral' \| 'accent' \| 'success'`	Color mood
`href`	`string`	Optional link — renders as an anchor
`pulse`	`boolean`	Soft luminous pulse behind the pill
`dismissible`	`boolean`	Show a quiet dismiss control
`onDismiss`	`() => void`	Called after the dismiss animation
`className`	`string`	Styles for the outer shell

Minimal liquid button with a curved dark fill that rises on hover, focus, and press.

Primary and secondary actions as one unit — depth on hover, underline reveal on the quiet CTA.