Cover image for Taste of Punjab - A CSS Love Letter to Comfort Food

Komal Kaur Dhillon

Frontend Challenge Perfect Landing Submission 🍲🥧

Taste of Punjab

A landing page built entirely with hand-crafted CSS art — no images, no icon libraries - celebrating Punjabi comfort food, family, and hospitality.

Submission for: Perfect Landing: Comfort Food

Live Demo & Repo

Live: https://taste-of-punjab-cyan.vercel.app/
Repo: https://github.com/Komal290106/Taste_Of_Punjab

Taste of Punjab

Where every meal feels like home - a handcrafted digital celebration of Punjabi hospitality, family traditions, and the warmth of a shared table.

The Experience

Taste of Punjab is not a restaurant website. It is a warm, immersive digital experience that invites you into a Punjabi home. Every illustration is drawn with pure CSS, every interaction is designed to feel like a personal welcome, and every word is written to make you feel like family.

From the golden wheat fields and the mud-house charpai in the hero scene, to the handcrafted dish cards and the story of a meal's journey from farm to family, the entire page is a love letter to Punjabi culture, food, and togetherness.

Inspiration

This project was created as part of the DEV Frontend Challenge, with the goal of celebrating culture through code.

The inspiration comes from:

  • The warmth of Punjabi homes where…

What it is

From the chulha and charpai in the hero scene to the eight hand-illustrated dish cards and a six-step "farm to family" story timeline, every visual is pure CSS. The goal was to make a visitor feel like they'd stepped into a Punjabi home rather than browsed a restaurant menu.

Features

  • Interactive, filterable dish menu with recipe modals
  • Six-step story timeline (Farm → Harvest → Grinding → Cooking → Serving → Family)
  • Reservation modal with validation and a warm confirmation screen
  • Fully responsive, keyboard-accessible, reduced-motion aware
  • Lighthouse: 97 Performance / 100 Accessibility / 100 Best Practices / 100 SEO

Tech stack

HTML5, CSS3, vanilla JavaScript (ES6), Vite - no frameworks, no external image assets.


Thanks for checking it out - would love any feedback! 🙏