MARKETPLACE
PLUGINS
TINDER STYLE SWIPE CARD
Tinder Style Swipe Card logo

Tinder Style Swipe Card

Published April 2026
   •    Updated this week

Plugin details

A lightweight, mobile-friendly swipe card plugin for Bubble that lets users swipe elements left or right - just like Tinder. Supports smooth drag animation, card rotation, swipe threshold control, and built-in card reappear animation. Fires native Bubble events on swipe so you can trigger any workflow instantly.
Demo editor: https://bubble.io/page?id=tinder-style-swipe&test_plugin=1776680157263x445666092593971200_current&tab=Design&name=index&type=page

$10

Per month

stars   •   0 ratings
2 installs  
This plugin does not collect or track your personal data.

Platform

Web & Native mobile

Contributor details

Devcipator logo
Devcipator
Joined 2024   •   4 Plugins
View contributor profile

Instructions

1. Add the plugin to your Bubble app 2. Place the SwipeCard element anywhere on your page
3. In the element settings set these properties:

Card ID — the HTML element ID you want to make swipeable (default: swipeCard)
Threshold — how many pixels the user must drag before a swipe is registered (default: 100)
Animation Speed — swipe animation duration in milliseconds (default: 250)
Enable Rotation — check this to tilt the card while dragging
Prevent Scroll — check this to block page scroll during swipe on mobile


4. In your Workflow tab listen for these events:

Swipe Right — triggers when user swipes right
Swipe Left — triggers when user swipes left


5. Use the exposed state Swipe Direction (text) to know which direction was swiped
6. At the end of your swipe workflow call the plugin action Show Card to bring the card back with a smooth pop-in animation

Types

This plugin can be found under the following types:
Element   •   Event   •   Action

Categories

This plugin can be found under the following categories:

Resources

Support contact
Documentation
Tutorial

Rating and reviews

No reviews yet

This plugin has not received any reviews.
Bubble