Aurelle — Fine Dining Restaurant Vue.js Website Template

About This Item

Aurelle Vue is a fine dining restaurant template for fine dining restaurants and tasting-menu kitchens. It rebuilds the Aurelle design in Vue 3 with the Composition API. Pinia holds the shared state, and Vue Router serves all 33 pages.

Because the restaurant logic lives in reactive stores, every choice updates the page at once. That includes Reservations and Tasting Menu. Meanwhile, the design stays the same as the Aurelle demo.

Layouts And Home Pages

Aurelle Vue ships with three home page layouts: Fine Dining, Tasting Menu and Chef’s Table & Seafood. Each one is a view built from single-file components, so sections move between pages easily.

Restaurant Views

• Reservations – four steps: the date and the party.
• Tasting Menu – three menus in tabs, each priced for the table: the menu for every guest.
• Chef’s Table – eight weeks of sittings, Thursday to Saturday at seven.
• The Menu – dietary filters where a dish must suit every need ticked.
• Wine List – the cellar by colour, by country and by the glass.
• Private Dining – a three-step enquiry. Rooms that cannot hold the party switch off.

Fine Dining Restaurant Template Features

• Vue 3 single-file components with <script setup>
• Pinia stores for the cart, the theme and the language
• Vue Router with lazy-loaded routes for 33 pages
• Vite build with hot module replacement
• Light and dark mode on one switch, remembered between visits
• Right-to-left layouts for every page
• Responsive from phones to wide screens
• Documentation for setup, structure and changes

Project Setup

Install Node 18 or newer first. Next, run npm install and npm run dev. Finally, npm run build creates a static site for any host.

Looking for this fine dining restaurant template in another stack? Aurelle also comes as HTML5, React, Angular and WordPress. The developer bundle includes every format for 20% less. See more Food & Restaurant Vue templates.

Built with Vue 3, Pinia and Vite.