---
title: "Web Haptics — Free Framer component · Best of Framer"
description: "Free Framer component · by David McBacon · Buttons. Make your Framer site feel as good as it looks Web Haptics brings tactile feedback to your Framer projects on mobile."
canonical: "https://framer.elliotli.dev/component/web-haptics"
---

[Home](/)/[Components](/components)/[Buttons](/components/category/buttons)/Web Haptics

# Web Haptics

Haptic feedback for mobile websites

[View on Framer](https://framer.com/marketplace/components/web-haptics/?via=elliot-li)

![Web Haptics preview image 1](https://framer.elliotli.dev/og/component/web-haptics/17fd45e2e07cf41f/1600x1200.jpg)

## Summary

Make your Framer site feel as good as it looks Web Haptics brings tactile feedback to your Framer projects on mobile.

## Description

## Make your Framer site feel as good as it looks

Web Haptics brings tactile feedback to your Framer projects on mobile. Free to use, invisible on canvas, and dead simple to set up. Works on iOS and Android, triggered on tap.

### Setup

Drop it into any layer. Tap that layer on mobile. Feel it.

### Preset mode

12 built-in haptic presets for common interactions. Success and Error for feedback moments. Light, Medium, Heavy for intensity. Buzz, Rigid, Nudge for character. Pick one and you're done.

### Custom mode

Build your own vibration pattern step by step. Set duration, intensity, and delay for each step using the no-code controls. Or switch to Code mode and paste any pattern directly from [haptics.lochie.me](http://haptics.lochie.me).

### Note

Haptic feedback is triggered by tap only. It cannot be triggered on any other interaction. Desktop browsers do not support haptics, but enabling "Play Sound" in the component settings lets you test feedback during design.

### Watch the video

## Rank history [How rankings work →](/terms#rankings)

-   All · #3071

## Details

- **Author**: David McBacon
- **Published**: 2026-03-24
- **Updated**: 2026-03-24
- **Added**: 2026-03-12
- **Categories**: Buttons

## More like this

-   [Eye Glow Button](/component/eye-glow-button) — Frame Native · Free — Cursor-following eyes, soft glow
-   [Dash Stretch Button](/component/dash-stretch-button) — Pentaclay · Free — Animated Hover Button With a Dash
-   [Nova Theme Toggle](/component/nova-theme-toggle) — Shouvik Biswas · $12 — Three-Mode Theme Toggle
-   [Nabby: Copy Button](/component/nabby-copy-button) — Francesco Gallo · Free — Plug in your button, copy anything