Tactile Button
Tactile button that lifts on hover and depresses on click.
Default
Default lift effect - rises on hover
default-example.tsx
1
Press
Press effect - raised at rest, depresses only on click
press-example.tsx
1
Examples
Examples of the tactile button
examples.tsx
1
Installation & source
Install via the shadcn CLI or copy the registry files manually.
bash
npx shadcn@latest add @tt-ui/tactile-button
Props
| Name | Type | Default | Description |
|---|---|---|---|
| children | React.ReactNode | Required | The content of the button |
| effect | "lift" | "press" | "lift" | Hover interaction: lift rises on hover; press stays raised until click depresses it |
| className | string | The class name of the button |