Stop Rebuilding UI

Shadcn.io is not affiliated with official shadcn/ui

React Product Card Flight

Flight booking card with route display, flight times, layover info, and fare classes for React travel apps

Book flights on your Next.js travel platform with this product card component. Features departure/arrival cities with airport codes, flight duration and stops, airline logo, fare class selector with baggage info, and book button. Built with shadcn/ui Card, Button, Badge, and RadioGroup components using Tailwind CSS. The flight-focused design simplifies booking—perfect for Shopify headless travel agencies, airline sites, or any React app with flight reservations. Clear and efficient.

React Product Card Flight preview

Loading...
Scroll to load preview

Installation

Install
Pro block

FAQ