logo

Restaurant Reservation Form

A reserve-a-table online form allows your guests to make online reservations at your restaurant, cafe, or bar. Gather all the information you need: reservation date and time, number of guests, type of event, name, and contact information. You can easily customize the form and embed it on your website or share a link.

Preview
Theme:
Use this template

Fields and controls

  • All form elements are placed into a Grid container with fd-blur-background CSS class. Change the container styling in the CSS editor.
  • The Email field accepts only valid email addresses. Change the pattern in the field properties.
  • The Phone is a masked input field that accepts only 11-digit numbers. Change the mask in the field properties.
  • Change the message that will be displayed after the form is submitted in the form settings.
  • The form timeout is set to 60 seconds, then the form can be submitted again. You can change it in the form settings.

Styling

  • The width of the form grid is set to 8 columns.
  • A background image is defined in fd-form class.
  • A background for a grid container with a fd-blur-background CSS class is blurred.
  • h1, h4 elements' text and field titles sizes are responsive to the screen width and defined with the min() CSS function.
  • h1, h4 elements and field titles are colored in white.
  • A pseudo-element is added before and after h4, h1 elements to display horizontal lines.