Free React Restaurant Components
A restaurant website has two jobs, make you hungry and get you booked, and everything else is noise. These components do those jobs in a voice restaurateurs recognise: an editorial menu and tasting menu typeset like a printed card, a wine and cocktail list with proper structure, a specials board, an hours-and-status strip that answers "are they open now", a reservation bar, private dining inquiry, chef story strip, farm provenance index for kitchens that source seriously, press accolades, and an ambience mosaic that sells the room.
12 components · MIT licensed · installable with the shadcn CLI
Ambience Mosaic
A room-first gallery mosaic built entirely from structural placeholder panels, varied warm muted token tones under a shared grain, each with a serif caption. Space, not food, no images.
Chef Story Strip
A provenance strip, the chef's name set in serif, one italic paragraph of kitchen philosophy, and a still small-caps line of the farms that supply the menu. Stillness as the trust signal.
Cocktail List Spread
Cocktail menu React component set as a bifold bar list, serif drink names, italic builds, mono spec lines and prices across a two-column Tailwind spread.
Editorial Menu
A restaurant menu set like a fine editorial page, courses with dotted price leaders, dish notes in quiet ink, and dietary marks in mono. Print-menu craft for the web.
Farm Provenance Index
Farm-to-table suppliers index for React, producers set as a serif sourcing document with place and distance in mono. Tailwind-tokened provenance, no logos.
Hours & Status Strip
Opening hours as a clean mono table with a live open-now lamp, today's row highlighted, next opening surfaced when closed. Print-schedule clarity, zero deps beyond motion.
Press Accolades Band
Restaurant press and awards band for React, accolades as serif text mastheads with mono years and one critic quote. Tailwind tokens, zero logo assets.
Private Dining Inquiry
An events block that sells the back room in serif, capacity and minimum spend as quiet data rows, and a three-field inquiry form with visible labels. Warm, unhurried, no SaaS urgency.
Reservation Bar
A booking strip that makes reserving feel effortless, party-size and time pills, one golden action, and a phone fallback. Designed to sit under a restaurant hero.
Specials Board
Chef's specials as a chalkboard-turned-editorial grid, hairline tiles with course labels, dish stories, prices, and one tonight-only tile carrying the accent.
Tasting Menu
Seasonal tasting menu React block, a centered serif course procession with one per-head price and wine pairing in mono. Tailwind tokens, degustation calm.
Wine List
The wine list set as its own document, regions as serif small-cap sections, vintage and glass/bottle prices in aligned tabular columns, one sommelier's pick carrying the keyline.
Frequently asked questions
How do I keep the menu components up to date?
Menus render from a plain data structure, sections, dishes, prices, notes, so updating is editing one file or one CMS entry, not redesigning a PDF. The tasting menu and specials board are deliberately fast to edit because menus that drift out of date cost covers.
Do the reservation components work with OpenTable or SevenRooms?
The reservation bar and CTA link to any booking platform, OpenTable, SevenRooms, Now Book It, or your phone line. They handle the persuasion and the details (hours, party size hints); the platform handles availability.
Are these only for fine dining?
No, the voice scales. A café uses the hours strip, specials board, and ambience mosaic; a wine bar leans on the cocktail and wine lists; the tasting menu and provenance index are the fine-dining pieces. The Fine Dining Restaurant template shows one composed arrangement.