> ## Documentation Index
> Fetch the complete documentation index at: https://docs.monad.xyz/llms.txt
> Use this file to discover all available pages before exploring further.

# How to add haptics to a Farcaster Mini App

Haptics are a way to add tactile feedback to your app to enhance user interaction and responsiveness.

This guide walks you through implementing haptics in a Farcaster Mini App for a more intuitive and engaging user experience.

## Implementing haptics in a Farcaster Mini App

If you are using the [Monad Mini App template](https://github.com/monad-developers/monad-miniapp-template/tree/main), you can use `haptics` from the [useFrame](https://github.com/monad-developers/monad-miniapp-template/blob/main/components/farcaster-provider.tsx) hook.

If you are not using the Monad Mini App template, you can inspect the [useFrame](https://github.com/monad-developers/monad-miniapp-template/blob/main/components/farcaster-provider.tsx) hook to check out the implementation details.

Below is an example of how to implement haptics in a Farcaster Mini App:

```tsx theme={null}
...

export default function MyComponent() {
  const { haptics } = useFrame();

  return (
    <div>
      <button onClick={() => haptics.impactOccurred('light')}>Light Impact</button>
    </div>
  );
}
```

## Supported haptics

The following haptics are supported:

| Haptic Type          | Code                                      |
| -------------------- | ----------------------------------------- |
| Light Impact         | `haptics.impactOccurred('light')`         |
| Medium Impact        | `haptics.impactOccurred('medium')`        |
| Heavy Impact         | `haptics.impactOccurred('heavy')`         |
| Soft Impact          | `haptics.impactOccurred('soft')`          |
| Rigid Impact         | `haptics.impactOccurred('rigid')`         |
| Success Notification | `haptics.notificationOccurred('success')` |
| Warning Notification | `haptics.notificationOccurred('warning')` |
| Error Notification   | `haptics.notificationOccurred('error')`   |
| Selection Change     | `haptics.selectionChanged()`              |