FavoriteButton.
A smooth animated heart with fill, soft burst, and accessible pressed state.
Tap the heart to favorite
The preview uses the actual shared component, including your current theme, rounding, border and motion preferences.
Props & API reference
Parameters available in the shared component, including value types, requirements and accepted options.
| Parameter | Type | Required | Default | Possible values | Description |
|---|---|---|---|---|---|
pressed | boolean | No | false | true · false | Controlled favorite state; fills the heart when true. |
onPressedChange | (pressed: boolean) => void | No | — | — | Called when user activates the heart. |
label | string | No | Favorite | — | Text/accessible name for the unselected state. |
pressedLabel | string | No | Favorited | — | Visible text for a selected favorite. |
iconOnly | boolean | No | false | true · false | Hide visible text and use an accessible label. |
count | number | No | — | — | Optional count next to the heart. |
size | "sm" | "md" | "lg" | No | md | sm · md · lg | Dimensions of the reaction control. |
disabled | boolean | No | false | true · false | Disable the favorite control. |