Discover the best card websites created by professional designers. Get inspired and start planning your perfect card web design today!

Rishabh Rai

A clean and elegant hover flip card effect built entirely using Webflow interactions. Each card flips on hover to reveal more content on the back side — perfect for portfolios, team sections, or feature highlights. No custom code used, just pure Webflow magic!

Hover Flip Cards Animation

Alex Dixon

Streamline the process of finding your next student house ‑ all from one convenient app. Search for your next home with friends, easily book property viewings, and chat with landlords directly.

Housr - App & Tech Company Website

Francesco Castronuovo

Ever wanted to toss cards across the screen like a digital magician? 🎩✨

In this tutorial, I’ll show you how to build draggable cards in Webflow using GSAP Draggable — without writing a single line of custom UI code.

We’ll walk through:

✅ A static version with Polaroid-style photo cards
✅ A CMS-powered version with project info
✅ All the Webflow structure and attributes you need
✅ A breakdown of the script (don’t worry — it’s fully commented)
✅ How to make it responsive and fun on all devices
✅ And of course… a reset button so you can play again 😎

👉 Watch on YouTube: https://youtu.be/5TlZLy65Ouk

📂 Helpful Resources:

- Lidia’s Portfolio: https://www.lidiasantoyan.com/
- GSAP Draggable: https://gsap.com/docs/v3/Plugins/Draggable/
- GSAP Easing: https://gsap.com/docs/v3/Eases/

GSAP Draggable Cards

Tahir M.

Fugu

A clean and interactive swatch card built with hover-triggered animations in Webflow. Ideal for eCommerce product previews or portfolio UI showcases. Fully responsive, smooth transitions, and 100% cloneable for your next creative project.

Hover Swatch Card Animation – Made in Webflow

A modern, interactive card with a sleek shiny hover effect, built using Webflow and custom CSS. The glossy animation gives a premium feel—ideal for portfolios, product showcases, or feature sections. Fully responsive and customizable for different use cases.

Shiny Hover Card Effect

Stevie's Workspace

Custom designed and built site for OneWorld Health with up to date statistics and volunteer trip listings from their facilities around the globe using Wized.

OneWorld Health

Robin Granqvist

This is a quite cool project card component part of my new portfolio template called Foley.

Check it out on the marketplace :)

https://webflow.com/templates/html/foley-website-template

Foley Card Component

Shakuro

Shakuro Team's Workspace

Lume is a visionary payment system blending cryptocurrencies and fiat money. With low-cost transactions, lightning-fast processing, and card support, it merges the best of banking apps and crypto wallets.  

We crafted this concept on Webflow to showcase Lume’s features with clarity and style. Key benefits—convenience, speed, and investment potential—are highlighted through sleek design, performance comparisons, and a launch timeline to spark excitement. Stunning 3D animations, created with Spline, elevate the experience.

If you use or remix this project, kindly include a credit to shakuro.com in your project or documentation.

Lume — Crypto Wallet Marketing Website

Alex Hartan

Galvaweb SRL

Free Webflow microsite for the awesome Webflow community!

Responsive on desktop, tablet, and mobile—yours to clone, tweak, and make your own.

Use it to showcase your work, play around, or kickstart your next idea.

If it’s helpful, feel free to like & follow 🙏
More experiments and resources coming soon.

P.S. It feels great to carve out time to explore Webflow again.

Hover Magic

Memberstack

The Info Grid FAQ section template organizes frequently asked questions into a clean, multi-column grid layout. It’s designed to help visitors find answers quickly while keeping your page visually balanced and easy to navigate.

AeroKit UI Faq01 Info Grid

The Grid Card feature section template presents content through a neatly structured card grid, offering a visually engaging way to highlight services, features, or details. Each card is crafted for clarity, with room for icons, headings, and concise descriptions.

AeroKit UI Feature08 Grid Card

The feature section template is designed with a bright and minimal layout that puts your offering strengths front and center. Featuring a clean structure and ample white space, it ensures your key selling points are communicated clearly and confidently.

AeroKit UI Feature06 Light

The Blocks feature section template is built around modular content blocks that let you break down your offerings into easily digestible chunks. Each block provides space for icons, titles, and supporting text, making it ideal for structured showcasing feature sets.

AeroKit UI Feature04 Blocks

The Symmetric feature section template uses a balanced, grid-style layout to present your offerings with clarity and precision. This symmetrical design creates a sense of structure, making it easier for users to scan and adopt key information effortlessly.

AeroKit UI Feature03 Symmetric

SPACESODA

SPACESODA HQ

A folder-style card inspired by the look of a folder tab. Built on Webflow using the S2 Framework.

Folder-style Travel Booking Card

Franco Ierace

Franco's Workspace

Welcome to my personal portfolio. 

Check out this sleek, modern portfolio I made in Webflow. It’s all about my design and development style, with a focus on smooth transitions, soft animations, and storytelling. Everything’s smooth and purposeful, with a strong emphasis on interactions and layout.

Franco Ierace | Porfolio

Kevin Kopp

Nice hover animation in CSS only. 

Youtube tutorial : https://www.youtube.com/watch?v=jfqWZbyCf5s

Premium Card Hover Animation

1070795817

1274323923

1316201488

1316201489

1462086697

1567550242

1592612642

1726628865

173927913

1771795565

1863160016

1905118106

2032141491

2037807691

2144870841

2213518682

2216482092

2339906037

2351366352

2355632600

https://s3.amazonaws.com/webflow-dev-assets/66fd83b6cc0c8c6ed0e398e6%2Fcontent.json

2401116685

2486364096

gpt-4o

gpt-4.1

gpt-4o-mini

2546957535

2789269995

2857348505

2903381045

User Accounts will no longer be available on January 29, 2026.

Visit Webflow’s Help Center for migration guidance and more info.

3023147062

3026881092

3106924665

3112069432

3120801339

3151661775

3243842104

3258716925

3266482432

3289310561

3313039722

3315729993

3387258362

3410497685

3590523401

3591394191

3672367630

3737116140

3801251705

3844506029

3913199261

3934148661

3941255684

4092855684

4103643638

4144203485

4206156914

451433404

489463363

504462606

536101258

622649767

622649768

657188092

665836192

737109165

747504970

772001133

817414265

846847440

882147072

911514507

938734410

1045828939

1049811722

105340574

1087856901

1120744071

1131151533

1157563538

1197475705

1229056119

1234765101

1236803103

1250328847

1259889605

1292405251

1297066426

130043074

1306352991

1312703771

1322655470

1336067073

1350250754

1380813821

1380896143

1406455659

1418395020

1433303746

143629253

1449062533

1455163268

1455742168

1458975701

146940023

1475952185

1483622682

1490715908

1499868407

1501922903

1509255256

1530015515

1534768148

1545754914

1557989767

1568482678

1575119218

1662541974

1665126082

1675015083

1680201874

1680586027

1701648875

1710623805

173185438

1733571395

1752293186

1753134293

1762715110

1764382991

1803820771

1813965765

1826978162

183596474

1836756734

1839668475

1856326096

1857805694

1861549476

187681422

1894524989

1905757080

1928608458

1931880952

1937559780

1944913766

1951876014

Best Card Websites | Free Examples & Designs

Discover Card websites
built by the Webflow community

Browse, clone, and customize thousands of websites #MadeinWebflow. Looking for templates?

Discover Card websites built by the Webflow community

Browse, clone, and customize thousands of websites #MadeinWebflow. Looking for templates?

Discover Card websites
built by the Webflow community