> ## Documentation Index
> Fetch the complete documentation index at: https://api.fanvue.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.
# SubscribeButton
> A subscription / purchase button pairing an action label with the current price and an optional struck-through previous price.
```tsx theme={null}
import { SubscribeButton } from "@fanvue/ui";
import type {
SubscribeButtonProps,
SubscribeButtonSize,
SubscribeButtonVariant,
} from "@fanvue/ui";
```
## Examples
## Default
```tsx theme={null}
import { SubscribeButton } from "@fanvue/ui";
Join now
```
## Brand
```tsx theme={null}
import { SubscribeButton } from "@fanvue/ui";
Join now
```
## Disabled
```tsx theme={null}
import { SubscribeButton } from "@fanvue/ui";
Join now
```
## Sizes
```tsx theme={null}
import { SubscribeButton } from "@fanvue/ui";
Join now
Join now
Join now
```
## Without Discount
```tsx theme={null}
import { SubscribeButton } from "@fanvue/ui";
Join now
```
## Props
## SubscribeButton
A subscription / purchase button pairing an action label with the current price and an optional struck-through previous price. Built on `Button`, so it inherits the same variants, sizes, `negative` dark-surface treatment, `fullWidth`, loading, and disabled behaviour.
The accessible name defaults to the label plus pricing (e.g. `"Join now, $9.99, was $19.99"`); pass `aria-label` to override.
Current price shown on the trailing side (e.g. `"$9.99/mo"`).
Leading action label.
Previous price rendered struck-through before `SubscribeButtonProps.price`.
When `true`, the button will take the full width of its container.
When `true`, replaces the label with a spinner and disables interaction.
Forces the dark-surface treatment regardless of theme. Only honored on `primary`, `secondary`, `tertiary`, and `outline` variants; ignored on all others. Use when placing the button on a dark background in a light theme (e.g. an inverted hero or modal).
Height of the button in pixels.
Visual style variant. `brand` is the Figma "Upsell" (green) type.
## Exported types
Also exported from `@fanvue/ui`: `SubscribeButtonProps`, `SubscribeButtonSize`, `SubscribeButtonVariant`.
***
**Setup:** [Installation](/docs/ui/installation) · [Theming](/docs/ui/theming)