Free React Travel & Hotel Components
Travel is bought on imagination and booked on logistics, and these components handle both halves: an amenity constellation and room-and-suite cards that sell the stay, a guest book spread that lets past visitors do the persuading, destination tabs and a when-to-go strip for trip planning, an itinerary day flow for tours, a departures list with real dates and prices, and a booking window bar that creates honest urgency from actual availability. For hotels, tour operators, and destinations that want atmosphere with an engine underneath.
8 components · MIT licensed · installable with the shadcn CLI
Amenity Constellation
Hotel amenities as an airy constellation, icon and serif label pairs grouped by pool, spa and dining, one signature amenity carrying the accent. The whitespace does the luxury.
Booking Window Bar
A check-in, check-out and guests summary bar with hairline seams and a serif reserve action, display-only fields from preformatted props, onSearch delegated, zero date-picker weight.
Destination Tabs
Destination tabs for travel sites, serif place names on a hairline rail, evocative intros and quiet fact pairs per place. Accessible React tabs themed with Tailwind tokens.
Guest Book Spread
Hotel guest reviews set like a guest book, one lead quote in large serif italic with stay details, smaller notes alongside. A React testimonial spread styled with Tailwind.
Itinerary Day Flow
A day-by-day itinerary set like a travel journal, serif day headings, a hairline timeline of moments with mono times, and evocative one-line descriptions that smell of the place.
Room & Suite Card
A hotel room card in serif calm, framed view placeholder, quiet amenity icons, the from-rate in tabular figures with per-night whispered, and a single reserved booking accent.
Tour Departures List
Upcoming small-group tour departures as a serif ledger, preformatted date ranges, tabular prices and real-text availability. A React booking list themed with Tailwind.
When to Go Strip
A when-to-go climate strip, twelve month cells with preformatted temperatures, season notes and best-time markers. A React travel almanac styled with Tailwind tokens.
Frequently asked questions
Do the booking components connect to hotel or tour booking engines?
They link out to any engine, SiteMinder, Rezdy, FareHarbor, or your own checkout, via plain URLs and callbacks. The components make the case and surface dates and prices; availability and payment stay in your booking system.
How should the when-to-go strip handle seasonality honestly?
Show the trade-offs, not just the highs: weather, crowds, and price by month. Honest shoulder-season framing ("quieter, cooler, cheaper") converts the flexible traveller who is your best-margin guest anyway.
Which components suit a tour operator versus a hotel?
Tour operators lead with the itinerary day flow and tour departures list; hotels lead with room-and-suite cards, the amenity constellation, and the booking window bar. The guest book spread and destination tabs serve both.