Framer code component · Interactive

Seating Map for Framer

Freeno account needed to try
Seating Map Framer component preview

What it does

A floor-plan seating chart for events, restaurants and venues. Place round or rectangular tables anywhere, mark seats as available, reserved or sold, and let visitors click seats to pick them. A live summary lists each chosen seat (like T2-3), the guest count and the price total. Looks finished on install with a sample banquet hall.

Customizable properties

  • Sections (up to 6): name, color, price per seat
  • Tables (up to 40): shape, 2-12 seats, X / Y position, section, reserved / sold seats
  • Manual placement or Auto grid
  • Landmarks: stage, bar, entrance
  • Seat size, numbers, max seats, currency
  • Click a table to select all free seats
  • Optional Continue button with your link
  • Light / Dark, colors, fonts, labels

Why this component

  • A real floor plan, not fixed rows: mix round and rectangular tables.
  • Fits phones: the whole map scales down, no sideways scrolling.
  • Four statuses shown with icons as well as color.
  • Keyboard friendly: every seat is a focusable button.
  • Canvas and static export show the finished state.

Need help?

Email hello@brandingupstudio.com — we usually reply within 1 business day. Custom edits are available from $75/hr.