UI element

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. BookMyShow: Live event detail

    Web-rendered event page with hero photo, genre chips, an 'interested' social counter, date range, start time, age limit, language and venue rows, a popular-artists strip and a Book Now bar with the starting price.

    BookMyShow Live event detail

    View the screen

  3. BookMyShow: Event ticket types

    Step 2 of the wizard listing the gendered and couple inventory (Female Entry, Female Cover, Male Entry, Couple Entry, Male Cover, Couple Cover) with prices and an Add control per row.

    BookMyShow Event ticket types

    View the screen

  4. BookMyShow: Live events category directory (See All)

    A 'See All' directory scoped to HSR Layout, Bengaluru that groups the whole live-event catalogue into sections — Comedy Shows, Music Shows, Plays, Sports — each a horizontal rail of artwork tiles carrying a sub-genre name and an event count: STAND UP 210+ EVENTS, ROAST 7 EVENTS, IMPROV 6 EVENTS, CONCERTS 125+ EVENTS, MUSIC FESTIVALS 55+ EVENTS, CLUB GIGS 95+ EVENTS, STORY TELLING 9 EVENTS, THEATRE 65+ EVENTS, PUPPETRY 2 EVENTS. A back chevron and a search icon sit in the header.

    BookMyShow Live events category directory (See All)

    View the screen

  5. BookMyShow: Live event category listing

    A per-category event listing headed 'Comedy Shows / HSR Layout, Bengaluru | 221 Events' with a full-width promotional hero banner, then a refinement bar of three controls — Filters, Sort By, Browse By Venues — above a two-column grid of event cards. Each card shows artwork, an optional PROMOTED badge, a date such as 'Sun, 23 Aug' or 'Fri, 21 Aug onwards', the event title, the venue line and the sub-genre 'Stand up Comedy'. A back chevron and search icon sit in the header. When the Date filter is applied the same header reads '101 Events' and the control reads 'Filters (1)'.

    Premium screenshot

    View the screen

  6. BookMyShow: Typed search results across content types

    As-you-type results for the query "Toxic": a clearable query chip, result-type tabs (All, Movies, STREAM, Events, Plays), a "Showing 8 results" count, and typed rows spanning a film (Toxic: A Fairy Tale for Grown-ups - in upcoming movies, Kannada, Telugu and 4 more), two comedy shows with venue and distance labels, a venues row, an artist row and an actor row, plus a View All Results button.

    Premium screenshot

    View the screen

  7. Cleartrip: Flight results

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

    Premium screenshot

    View the screen

  8. Cleartrip: Hotel room choices

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

    Premium screenshot

    View the screen

  9. Cleartrip: Final flight trip review

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

    Premium screenshot

    View the screen

  10. Cleartrip: Hotel results

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

    Premium screenshot

    View the screen

  11. Cleartrip: Review flight and fare

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

    Premium screenshot

    View the screen

  12. Cleartrip: Choose a flight fare

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

    Premium screenshot

    View the screen

  13. 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

  14. Cleartrip: Review hotel itinerary

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

    Premium screenshot

    View the screen

  15. 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

  16. District: Showtimes and cinema listing with date picker

    Film title in the header, a date strip, Filters and 'Sort by' controls, then cinema cards each listing a venue name with distance and a grid of clickable show times.

    Premium screenshot

    View the screen

  17. District: Events landing with this-week picks and featured grid

    Events tab active: "What's happening this week" heading with a circular category rail (nightlife, social mixers, music, food and drinks and similar) and a 'Featured events' grid of poster cards.

    Premium screenshot

    View the screen

  18. 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

  19. 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

  20. 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

  21. 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

  22. Domino’s: Cart and order review

    Cart: the added pizza with a quantity stepper, a free-delivery unlock banner, a Frequently Bought Together upsell rail, Apply Coupon, DELIVER NOW versus ADVANCE ORDER scheduling, and the ADD/SELECT ADDRESS call to action.

    Premium screenshot

    View the screen

  23. 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

  24. 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

  25. 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

  26. EaseMyTrip: EaseMyTrip home

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

    Premium screenshot

    View the screen

  27. EaseMyTrip: Train search

    Train ticket search for New Delhi to Mumbai Central with departure date and travel class choices, plus access to train-status utilities.

    Premium screenshot

    View the screen

  28. 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

  29. 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

  30. 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

  31. 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

  32. 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

  33. 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

  34. 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

  35. 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

  36. 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

  37. 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

  38. 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

  39. 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

  40. 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

  41. 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

  42. MakeMyTrip: Hotel property detail

    One property's page: photo hero with a photo count, name, review rating, locality, a property overview blurb, the stay dates and occupancy, the nightly fare with taxes, a wishlist heart and a SELECT ROOM call to action.

    Premium screenshot

    View the screen

  43. 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

  44. 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

  45. 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

  46. 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

  47. 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

  48. 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

  49. BookMyShow: Movies home

    BookMyShow home tab headed 'It All Starts Here!' with a category icon rail, a promoted hero banner, a Toxic movie banner and a Recommended Movies poster rail above the bottom navigation (Movies, Live Events, Search, HSBC Lounge).

    Premium screenshot

    View the screen

  50. BookMyShow: Event date and time

    Step 1 of the booking wizard (Date & Time / Ticket / Review) showing the venue line and Select Date chips for the available nights.

    Premium screenshot

    View the screen

  51. BookMyShow: Now showing movies

    City-scoped 'Now Showing' catalog reached from the home Movies rail: a promotional hero card, a 'Coming Soon' section pointing at upcoming movies, and a grid of film poster cards with a browse-by-cinema entry point.

    Premium screenshot

    View the screen

  52. 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

  53. 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

  54. 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

  55. 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

  56. 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

  57. 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.