UI elements

Card

Screens containing card.

  1. BookMyShow: Live Events home

    Live Events tab with a photo category rail (Comedy, Music, Adventure, Workshops, Performances), a 'Things To Do In Your City' event card with price and Book Now, and an 'India's Top Events' carousel.

    BookMyShow Live Events home

    View the screen

  2. Cleartrip: Flight results

    Loaded Bengaluru to New Delhi inventory with adjacent dates, prices, Sort, Filter, and itinerary cards.

    Cleartrip Flight results

    View the screen

  3. Cleartrip: Hotel room choices

    Available room type with imagery, amenities, breakfast plan, cancellation terms, price, and Continue.

    Cleartrip Hotel room choices

    View the screen

  4. Cleartrip: Final flight trip review

    Final review sheet summarizing the Bengaluru to New Delhi itinerary and one traveller before Confirm and proceed.

    Cleartrip Final flight trip review

    View the screen

  5. Cleartrip: Hotel results

    Loaded hotel inventory for the active destination, dates, and occupancy, with Filters and Sort.

    Premium screenshot

    View the screen

  6. Cleartrip: Review flight and fare

    Selected itinerary and Saver fare review with route, schedule, baggage, fee terms, and Continue.

    Premium screenshot

    View the screen

  7. Cleartrip: Choose a flight fare

    Fare-choice sheet comparing Saver and Value Max benefits and prices.

    Premium screenshot

    View the screen

  8. Cleartrip: Flight payment methods

    Pay and book boundary showing final fare and card, UPI, net banking, EMI, and wallet options.

    Premium screenshot

    View the screen

  9. Cleartrip: Review hotel itinerary

    Selected property, stay dates, room and guest count, room plan, cancellation policy, total, and Continue.

    Premium screenshot

    View the screen

  10. District: Going-out home feed with vertical rail and spotlight

    Guest home: city/locality header, a search field, a horizontally scrolling vertical rail (Dining, Movies, Events, Stores, Activities, Play, Comedy) and an 'In the spotlight' content card for a now-showing film.

    Premium screenshot

    View the screen

  11. District: Movies vertical home with now-showing spotlight

    Movies tab selected in the vertical rail: 'In the Spotlight' hero card for a now-showing film with genre tags and a 'Book tickets' CTA, followed by a "This Week's Releases" poster rail.

    Premium screenshot

    View the screen

  12. District: Event ticket selection with date, time and cart

    'Choose date and time' with a horizontal date chip row (19–31 Aug) and a time chip, a 'Redeem your pass by paying on District' banner, a 'Choose tickets' section with a named Cover Ticket at ₹100 and a quantity stepper set to 1, and a bottom bar showing ₹100 next to an enabled Checkout button.

    Premium screenshot

    View the screen

  13. District: Family dining collection listing

    Dark-theme Dining collection listing titled 'Family dining' with a back arrow, a horizontal filter-pill row (Filters, 'Date, time & guests', a percentage-off pill), an 'All restaurants' section and stacked venue cards showing photo, rating badge, name, cuisine, distance, price-for-two, a 'Book benefits' tag and a bookable-slot availability row.

    Premium screenshot

    View the screen

  14. District: Family dining collection — loaded availability results with per-venue slot pills

    Back-titled 'Family dining' collection with 'Filters (1)', '21 Aug, 12:30 PM • 4 guests' and '30% OFF & above' chips over an 'All restaurants' list; venue cards (Atlantis 4.2★ • North Indian • ₹2500 for two • Flat 20% OFF; Roxie 4.7★ • Flat 10% OFF) each carry a 'Slots for tomorrow' row of bookable time pills (12:00 / 12:15 / 12:30 / 12:45 PM) with per-slot discount labels.

    Premium screenshot

    View the screen

  15. Domino’s: Guest home with order modes

    Guest home: preset Koramangala 4th Block location with a Detect Location banner, order-mode row (Delivery 20 MIN, Takeaway, Dine-in, Deliver on train), merchandised pizza cards with prices and Add controls, and Menu/Offers navigation. In dine-in mode the same surface re-binds its header to 'Dine-in at HSR LAYOUTS, ~100 meters' with a CHANGE control.

    Premium screenshot

    View the screen

  16. Domino’s: Pizza menu listing with filters

    Domino's Menu: veg/non-veg and sort filters, category tabs (Paneer Maxxx, Chicken Maxxx, Big Big Pizza, Meals), and product cards showing a pizza name, description, price and an inline Add control.

    Premium screenshot

    View the screen

  17. Domino’s: All Restaurants directory for dine-in

    City-first dine-in store directory: an 'All Restaurants' header, a city field resolved to BANGALORE, a Search Restaurant box, an 'All Restaurants' count line, and outlet cards each showing the restaurant name, full street address, opening hours and a SELECT button. Before a city is chosen the same screen shows an empty state, 'We could not find a restaurant near your location! Please select your city and try again.'

    Premium screenshot

    View the screen

  18. Domino’s: Dine-in checkout

    Dine-in presentation of the cart activity: 1 item in Cart with the ordered pizza and a quantity stepper, a Frequently Bought Together rail, a 'Dine-in at HSR LAYOUTS' store row with CHANGE where the address or pickup block would be, a Cash/UPI payment row and a live PLACE ORDER button showing You Pay Rs.576.

    Premium screenshot

    View the screen

  19. EaseMyTrip: Train results

    Loaded train options from New Delhi to Mumbai Central with departure and arrival times, duration, seat availability, and filters.

    Premium screenshot

    View the screen

  20. EaseMyTrip: EaseMyTrip home

    Travel-product home with prominent Flights, Hotels and Trains choices, additional service shortcuts, and bottom navigation.

    Premium screenshot

    View the screen

  21. EaseMyTrip: Hotel search results

    Hotel results showing property cards with ratings, amenities, pricing, and controls for price, filters, and sorting.

    Premium screenshot

    View the screen

  22. EaseMyTrip: Hotel payment

    Hotel payment step with wallet option, blank card-payment fields, secure-payment notice, and final payment action.

    Premium screenshot

    View the screen

  23. EaseMyTrip: Hotel property details

    Property detail view with photos, identity, rating, location, booking terms, stay dates, hotel information, price, and room-selection action.

    Premium screenshot

    View the screen

  24. EaseMyTrip: Outstation cab results

    Bengaluru-to-Mysuru cab options with vehicle type, capacity, luggage, distance, price, discounts, safety standards, and Filter and Sort.

    Premium screenshot

    View the screen

  25. EaseMyTrip: Choose a hotel destination

    Destination chooser with a search field, a nearby-property option, and popular domestic and international destinations.

    Premium screenshot

    View the screen

  26. EaseMyTrip: Choose a hotel room and rate

    Room and rate selection comparing available room types, meal plans, booking terms, amenities, and per-night prices.

    Premium screenshot

    View the screen

  27. EaseMyTrip: Review hotel guest and contact details

    Loaded hotel review with stay and room details, empty contact and primary-guest fields, total price, and Continue Booking.

    Premium screenshot

    View the screen

  28. EaseMyTrip: Train booking review and IRCTC ID

    Review of the selected New Delhi to Mumbai Central train with an empty IRCTC User ID field, boarding station, fare total, and payment action.

    Premium screenshot

    View the screen

  29. EaseMyTrip: Cab transfer review and traveller details

    Transfer Review with trip and vehicle summary, traveller name fields, pickup and drop addresses, promo code, amount, and Continue Booking.

    Premium screenshot

    View the screen

  30. MakeMyTrip: Cabs Review Your Ride

    The pre-payment cab review: trip address and schedule with Edit, the selected vehicle with rating, fuel type and seats, free-cancellation terms, a detailed Inclusions & Exclusions list of per-minute and per-kilometre overage rates and which tolls, parking and state taxes are included or excluded, a Policies link, a Coupon & Offers block, and the Part Pay / Full Pay / PAY NOW bar. The wording of the inclusions block and the two payment amounts differ by cab product: the hourly-rental and airport captures exclude tolls, parking and state tax, while the intercity Outstation capture states that tolls, state tax and driver allowance are included and quotes a per-kilometre rate beyond an included distance.

    Premium screenshot

    View the screen

  31. MakeMyTrip: Destination activities listing

    Dated activity results for a destination: a header with the destination, the date range and Edit, filter controls (All Filters, Price, Categories), a 'SELECT YOUR EXPERIENCE' category rail (MMT Experience Pass, Attraction Tickets, Tours), an in-destination search field, and activity cards with duration, inclusions, a savings badge and a struck-through original price.

    Premium screenshot

    View the screen

  32. MakeMyTrip: Hotels Select Room

    Room and rate-plan chooser: date/guest header with Modify, Free Cancellation and Breakfast Included filters, a room card with size, view, bed and bathroom attributes, and competing rate plans with prices, a Selected marker and CONTINUE.

    Premium screenshot

    View the screen

  33. MakeMyTrip: Hotels UPI payment — select a UPI app or share a payment link

    UPI instrument surface: Total Due, a Select UPI App list of installed apps with a redirect warning and SHOW ALL, and a Share Payment Link alternative explaining that UPI ID/VPA entry is discontinued per NPCI guidelines, with a 10-minute link validity note.

    Premium screenshot

    View the screen

  34. MakeMyTrip: Experience Pass Review Booking

    Pre-payment review of the pass booking: product name and tier, traveller count, TOTAL COST inclusive of taxes, an activation-window note, a Cancellation Policy block explaining the full refund before first activity booking and non-refundability after, an Add Traveller Details block with a passport-match warning, and the total with CONTINUE.

    Premium screenshot

    View the screen

  35. MakeMyTrip: Single-activity detail

    One activity's page: photo hero with a share control, name and destination, tabbed sections (About, Highlights, Activity Options, Traveller Videos), an About Activity block with duration and suitability, a description, and a sticky 'Starting From' price with CONTINUE.

    Premium screenshot

    View the screen

  36. MakeMyTrip: Cabs priced options listing

    Partner-aggregated cab classes for the searched trip: a trip header with an Edit control, the Ride Guarantee strip, the distance/duration basis of the rates, and priced vehicle-class cards with seat counts, fuel type and an inline coupon and roof-carrier add-on.

    Premium screenshot

    View the screen

  37. MakeMyTrip: Hotels Review Booking

    Pre-payment stay summary: property name and locality, check-in and check-out with night count, guests and rooms, the selected room and meal plan, a non-refundable notice, an Inclusions & Cancellation Policy link, a recommended Addons block, and the total with CONTINUE.

    Premium screenshot

    View the screen

  38. MakeMyTrip: Select Preferences — traveller count

    Traveller-count chooser for the selected pass: the pass name and date in the header, Adult and Child rows with age bands, per-traveller prices and increment/decrement steppers, an age-band advisory note, and a running total with CONTINUE.

    Premium screenshot

    View the screen

  39. MakeMyTrip: Experience Pass detail

    The multi-activity pass product page: branded hero, pass name and destination, a starting per-adult price, an activation validity line, tabbed sections (MMT Pass, Choices (25), Pass Options, Pass Details), an About block describing the savings, and a sticky starting price with CONTINUE.

    Premium screenshot

    View the screen

  40. MakeMyTrip: Hotels payment landing — choose a payment method

    Payment-method landing with a session countdown: Total Due, a saved-payment login prompt, a Trip Secure+ add-on that reprices the total, a Gift Cards expander, and the payment options list (UPI Options, Credit & Debit Cards, EMI with a No Cost EMI badge).

    Premium screenshot

    View the screen

  41. MakeMyTrip: Hotel results listing

    Priced property results for the searched city and dates: a sticky search header with Maps / Sort / All Filters / OneCircle controls, a Rush Deals carousel, and rated property cards with nightly price and free-cancellation flags.

    Premium screenshot

    View the screen

  42. SNITCH: Shopping bag with price details

    BAG screen with one line item (Burgundy Solid Twill Shirt, M, quantity 1, Rs 1219), MOVE TO WISHLIST and delete controls, a locked coupons and gift cards row, a PRICE DETAILS breakdown of bag total, coupon discount and grand total, a YOU MAY ALSO LIKE carousel, and the SELECT ADDRESS TO CONTINUE call to action.

    Premium screenshot

    View the screen

  43. BookMyShow: Live event booking - select venue

    First step of the live-event booking wizard for a multi-city event: a four-stage breadcrumb (Venue, Date & Time, Ticket, Review & Proceed to Pay) above a 'Select Venue' list of collapsible city groups. Bengaluru is expanded and shows one selectable venue card - MLR Convention Centre, Whitefield - with its starting date, distance, a Fast Filling label and a Know more link; Kolkata is collapsed below.

    Premium screenshot

    View the screen

  44. BookMyShow: Venue detail

    A venue's own page reached by opening a non-film Venues result from search: back chevron, the venue name as the header title (Skyye: Bengaluru), a share icon, a full-width venue photo, the venue's complete public street address, a red View On Maps link, then an 'Explore All Events' block headed '1 Events' with Filters and Sort By chips above a dated event poster card (Club Nocturno, Sat, 22 Aug) whose title row is partly cut off at the bottom edge.

    Premium screenshot

    View the screen

  45. District: Restaurant page with offers, table booking and bill payment

    Photo strip with a 'View gallery' entry, restaurant name with cuisine, price-for-two and locality metadata, quick chips, an Offers/'Offers for today' section with a discount card, and a two-button bottom bar: 'Book a table' and 'Pay bill'.

    Premium screenshot

    View the screen

  46. Domino’s: Takeaway outlet picker near you

    Pickup store chooser: a 'Restaurant(s) Near Your Location' list under the current locality, each outlet card showing the restaurant name, full street address, opening hours, walking/driving distance, a View on Map link and a SELECT button, with some outlets badged NEW DRIVE-N-PICK.

    Premium screenshot

    View the screen

  47. Domino’s: Takeaway pickup checkout

    Pickup checkout on the cart activity: the ordered pizza with a quantity stepper, a Frequently Bought Together rail, a 'Takeaway | Restaurant' outlet block with CHANGE instead of a delivery address, a bill with no delivery fee, and a live PLACE ORDER button with Cash/UPI preselected.

    Premium screenshot

    View the screen

  48. Domino’s: Deliver on Train PNR entry

    Deliver on Train header over a PIZZA ON YOUR SEAT explainer ('We will deliver your favourite Pizza right on your train seat while you travel'), an 'Enter PNR to get started' card with an empty PNR field, the hint 'Valid PNR Number is Mandatory', an 'I agree to the IRCTC Ordering Terms & Conditions' checkbox and a green SUBMIT button, an IRCTC ORDER HISTORY row, and an IRCTC T&C block listing catered-station and 2-hour lead rules, 12:00-23:00 delivery hours and the 2-hour cancellation window, with READ MORE.

    Premium screenshot

    View the screen

More examples with Premium

Premium unlocks the remaining screenshots.