Premium Restraint
The static system stays disciplined: dark surfaces, amber accents, sharp spacing, and a typography stack that feels closer to a hotel marquee than a basic bar website.
Loading
Back to work
Elite Tier Case Study
Hospitality / Nightlife / Agra
JB'sTheLounge&Bar.
A complete rebrand and rebuild of a premium Agra nightlife venue's web presence, turning a reference source into a cinematic, amber-lit digital destination.
Delivery in progressTarget launch May 19-20, 2026
Front page capture
Client
JB's The Lounge & Bar
Location
Agra, Uttar Pradesh
Services
Web Design, Development, Partial Branding
Timeline
1 week
Status
Delivery in progress
Launch Window
May 19-20, 2026
Development
Solo developed by Piyush Arya
The brief
Premium nightlife, without template residue.
JB's came in with a strong physical identity, a full menu, and a reference site with a very specific animated structure. The job was not to copy a cocktail tutorial site. It was to reframe the source into a venue-first experience for one of Agra's premium lounge and bar destinations.
The core design tension was nightlife energy versus premium restraint. The answer was to keep the static layer controlled and let the motion layer carry the energy. Reading the site feels composed. Scrolling it feels cinematic.
Design system
Amber on black, built to hold.
The palette came from the physical menu and logo, then became a web system for surface, accent, hover, and hierarchy.
.png&w=750&q=75)
Logo treatment
The supplied wordmark was too dark for the off-black interface, so the logo was rebuilt into cleaner light and amber-ready variants while preserving the original stroke detail.
Page background
#0a0a0a
Primary amber
#c9884a
Hover amber
#e8b87a
Warm surface
#2a1a0a
Creative approach
Restrained when still. Alive when moving.
Nightlife Energy
The movement carries the energy: scroll-scrubbed hero video, split text reveals, parallax flourishes, and pinned transitions that make the site feel cinematic without turning loud.
Menu Clarity
The homepage keeps the offer tight with curated drink lists, while the full menu route holds the complete food, cocktail, brewery, mocktail, and dessert catalogue.
Menu architecture
A two-page menu instead of one overloaded section.
The homepage keeps the cocktail programme curated and cinematic. The dedicated menu route carries the complete offering: signature cocktails, experimental bar, fresh brews, mocktails, food, rice, breads, and desserts.
Top 4 most popular cocktails
Top 4 most loved cocktails
Signature drinks carousel
Full cocktail and food menu route
Fresh brews and experimental bar
Mobile-friendly category browsing
Technical delivery
The details that made it production-ready.
React 19TypeScriptGSAPTailwind v4
Scroll video lag
The hero video was re-muxed with the faststart flag and the animation setup moved from metadata load to canplaythrough, so production scroll-scrubbing waits for enough buffer.
Mobile text overflow
The oversized background heading was hidden on small screens and replaced with a controlled treatment that reads intentional instead of clipped.
Mobile Safari pinning
GSAP ScrollTrigger resize handling was tuned and pinned scrub sections were disabled on mobile, avoiding viewport jank from Safari's dynamic browser chrome.
Outcome
A venue site with its own identity.
Full hospitality website designed and developed in one week
Solo developed by Piyush Arya for Luxie Sites
Amber-on-black brand system adapted from the venue's physical identity
Logo variants recoloured and prepared for dark web surfaces
Two-page menu architecture for both quick impact and complete browsing
Desktop video scrub and mobile experience audited before delivery