Grid

Airbnb Styled Form

Checkout and booking form pattern inspired by Airbnb with trip summary, cancellation policy, payment schedule toggles, and card management.

Preview

Confirm and pay

Dome Bungalow

CLARO DE LUNA: Exclusive dome among...

Entire bungalow

4.89 (563)·Superhost

Free cancellation for 48 hours.

Get a full refund if you change your mind within 48 hours of booking.

Your trip

Dates

Sep 1 – 6

Guests

1 guest

Add travel insurance for $54.80

Get reimbursed if you need to cancel due to illness, flight delays, weather emergencies, and more.

Choose how to pay

Pay with

Credit or debit card
VISAMCAMEX

Price details

$162.50 x 5 nights$812.50
Total (USD)$812.50

By selecting the button below, I agree to the Host's House Rules, Ground rules for guests, and Airbnb's Rebooking and Refund Policy.

Interactive responsive preview
Drag handles on right and bottom to resize

Overview

Travel and hospitality checkout forms need to balance transparent pricing, trust signals, and progressive disclosure:

  • Listing Summary: Immediate visual confirmation of the accommodation with guest rating and host badges.
  • Trip Editing: In-place edit triggers for dates and party size without navigating away.
  • Payment Flexibility: Transparent toggles between paying in full today versus split payment schedules.
  • Secure Card Drawer: Modal card details collection with validation for number, expiration date, CVV, and billing location.

Reference Design

AirBnB Styled Form

On this page