daformat

daformat / react-swipeable-cards

Public

A react swipeable cards carousel with zero-dependency, discard or send to back of the stack, looping or not.

hello-mat.comdesign-engineeringcomponentswipeable-cards carousel headless react swipe swipeable
10
0
100% credibility
Found May 06, 2026 at 10 stars -- GitGems finds repos before they trend. Get early access to the next one.
Sign Up Free
AI Analysis
TypeScript
AI Summary

A headless React component for building swipeable card carousels like Tinder, supporting manual drags, flings, and button-triggered swipes in any direction with customizable animations.

How It Works

1
🔍 Discover swipe cards

You find a handy tool for creating Tinder-like card swiping in your web app.

2
📦 Add to your app

You include the swipe cards feature into your project so it's ready to use.

3
🃏 Prepare your cards

You gather your content like photos or messages and turn them into a stack of swipeable cards.

4
✨ Display the stack

Your cards appear on screen in a neat stack, peeking underneath to invite swiping.

5
👆 Add swipe buttons

You place easy buttons for swiping left, right, up, or down without dragging.

6
🎨 Style it your way

You customize colors, sizes, and overlaps to make the cards feel just right.

✅ Swipe smoothly

Users drag, fling, or tap to swipe cards away or loop them back, feeling natural and fun.

Sign up to see the full architecture

5 more

Sign Up Free

Star Growth

See how this repo grew from 10 to 10 stars Sign Up Free
Repurpose This Repo

Repurpose is a Pro feature

Generate ready-to-use prompts for X threads, LinkedIn posts, blog posts, YouTube scripts, and more -- with full repo context baked in.

Unlock Repurpose
AI-Generated Review

What is react-swipeable-cards?

React swipeable cards carousel in TypeScript with zero runtime dependencies, mimicking Tinder for drag, fling, or programmatic swipes left, right, up, or down. Cards discard off-screen or loop to the stack back, solving clunky carousel interactions in React apps. Headless setup exposes CSS custom properties for full styling control, perfect for github react components like react swipeable examples.

Why is it gaining traction?

Zero deps and Web Animations API deliver buttery, momentum-based swipes with pivot rotation that feels native under finger—beats bloated react swipeable views replacements. Built-in buttons and hooks enable easy programmatic control, ideal for react github projects or react swipeable card demos. Loops infinitely or shows empty states, standing out as a lean react native react swipeable alternative to react-swipeable-drawer or react swipeable list.

Who should use this?

Frontend devs crafting Tinder-style matching in dating apps, flashcards in edtech, or onboarding flows in SaaS. Suits react github pages deploys or github copilot for react users prototyping react github contribution calendar alternatives with swipe gestures. Skip if you need react native swipeable cards—web-only.

Verdict

Solid docs, live demo, and Vitest coverage make this a quick win for react swipeable experiments, despite 10 stars and 1.0% credibility score. Early but production-ready for non-critical UIs; fork if it fits your react github stars chaser project.

(178 words)

Sign up to read the full AI review Sign Up Free

Similar repos coming soon.