← Back to Portfolio
Portfolio Project

Wine Pairing Web App

An interactive restaurant-style wine pairing tool. Select a dish, view the recommended wine, pairing notes, flavour profile and service suggestion.

HTML CSS JavaScript UX Logic
Selected Pairing No dish selected

Choose a dish to see the pairing.

🍽️ Dishes
0

Menu items available.

🍷 Wines
0

Pairing recommendations.

⭐ Match Score
--

Based on flavour balance.

🧭 Category
None

Selected dish category.

Step 1

Select a dish

Choose a dish from the menu to generate the recommended wine pairing.

Menu

Dish details

No category

No dish selected

Select a dish to view description, flavour profile and pairing logic.

Body --
Acidity --
Richness --
Intensity --
Recommendation

Wine pairing

No wine selected

Select a dish first

The recommended wine and pairing explanation will appear here.

Serving Temperature --

Suggested service condition.

Glassware --

Recommended glass style.

Pairing Style --

Contrast or complement.

Service Note --

Short note for restaurant service.

Explanation

Why it works

Select a dish to see the pairing logic.

Full Menu

Pairing list

Dish Category Wine Style