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! π
Top comments (0)