Lassippers - Juice Bar HTML5 Template

Lassippers is a fresh, animation-rich HTML5 template built for juice bars, lassi shops, smoothie counters, cold-pressed juice brands and healthy cafes. It ships three completely distinct homepage designs - an immersive market-photography look, a classic cream look, and a full berry-and-mango color scheme with its own logo and squared button style - all driven by one small set of CSS variables, so re-theming the whole template is a five-minute job.

The design pairs bold Anton display headlines with the friendly Bricolage Grotesque and DM Sans families, hand-drawn squiggle underlines, sticker-style badges with hard offset shadows, a spinning brand stamp, a citrus-wheel custom cursor and a signature capsule button with a sliding double-arrow hover. Every section is animated with GSAP scroll reveals, and users who prefer reduced motion get an instant, animation-free experience automatically.

Three Homepages

• Home 01 Market: full-bleed background slider with a self-hosted video slide, floating product card, mini video reel in the hero, feature sticker cards, brand story, vertical video reels section, taste tiles, product carousel, orange promo countdown, two-up testimonials, bento gallery with lightbox and editorial blog rows.
• Home 02 Classic: full-screen slider, stats bar, marquee ticker, about with checklist, menu categories, dashed-leader price list, how-it-works steps, video banner, shop grid, offer countdown, testimonials slider, blog cards, Instagram wall and CTA.
• Home 03 Berry: two-row header with live search, complete berry-and-mango re-theme, image-stack about section, tabbed two-column menu board, full-bleed video banner, Mango Week promo with tilted marquee stripe and countdown, twin auto-scrolling testimonial marquees and an editorial blog list.

Inner Pages

About, Menu, Shop, Shop Details (gallery thumbnails, tabs, reviews), Cart, Checkout, Blog, Blog Details (with sidebar) and Contact with an embedded map - twelve pages in total, all sharing the same header, mini-cart dropdown, multi-level navigation and footer.

Credits

Bootstrap 5.3.3, jQuery 3.7.1, Swiper 11, GSAP 3 with ScrollTrigger, Fancybox, Font Awesome Free, Google Fonts (Anton, Bricolage Grotesque, DM Sans).

Note

All images are used for preview purposes only and are NOT included in the download package - they are replaced with neutral placeholders. The demo videos, logo files and background patterns are included. Fonts and icon fonts load locally; the only external requests are Google Fonts and the optional YouTube and Google Maps embeds.

Features

• 12 HTML pages, 3 unique homepage designs
• CSS-variable design tokens with a complete per-page re-theme example
• GSAP + ScrollTrigger animations, marquees, counters, parallax
• prefers-reduced-motion support for accessibility
• Swiper sliders and product carousel
• Fancybox image lightbox on gallery and Instagram sections
• Self-hosted vertical video reels and ambient hero video (muted autoplay)
• YouTube video modal
• Live offer countdown
• Mini-cart dropdown in the header
• Working PHP contact form handler
• Font Awesome Free icons loaded locally
• Fully responsive with a desktop-first breakpoint system
• W3C valid, zero console errors
• Well-commented code with a numbered CSS table of contents and JS index
• Documentation included

Requirements

• Any modern browser - Chrome, Firefox, Safari or Edge
• A code editor to customise the HTML, CSS and JavaScript
• Any web server or hosting to publish the pages (they are static HTML)
• PHP on the server for the working contact form (sendmail.php)

Instructions

1. Unzip the download and open the lassippers folder.
2. Open index.html (Home 01 Market), index-2.html (Home 02 Classic) or index-3.html (Home 03 Berry) in a browser to preview the three homepages.
3. Edit the content directly in the HTML files. Brand colours and fonts are CSS variables in the :root block at the top of assets/css/style.css.
4. Set your own address in the $email line at the top of sendmail.php so contact-form messages reach you.
5. Upload the files to your hosting. Full details are in the included Documentation folder.