Chanoya is a tea shop website template: a calm, ceremonial HTML5 template for tea houses, tea rooms and loose-leaf tea merchants. Warm ivory and blush grounds, sage and olive ink, light serif titles over a dry ink-brush rule, photographs in soft organic frames and a red tea-house seal give it the feel of a quiet tea room. Underneath, it runs real tea house logic: ceremonies with sessions and the seats left in each, loose leaf priced by the tin, a brewing guide with an infusion counter for every tea, a tea finder that ranks teas by flavour notes, the tea house’s live open status and a shop with a bag, coupon, shipping and tax. It ships with light and dark mode, right-to-left support and WebGL layers – mist drifting over tea terraces and a tea bowl cut from paper layers turning in the footer.

Three Home Pages

• Home 01 – Tea House: a hero slider with the title low on the photograph, the way of tea in an organic frame with the seal, the house blends with a weight switch on every tin, popular offers on leader lines, Hanging Scroll – a kakejiku painting unrolls downward as the section travels – the ceremonies with today’s sessions and seats left and guests’ voices. Then come the specialists, a quick ceremony booking and the journal.
• Home 02 – Loose Leaf Merchant: a wide hero band, the popular blends in five columns with type tabs, a brewing guide with its infusion counter beside a tea photograph, Terrace Mist – banks of mist part over the tea terraces as you scroll and the gardens’ figures appear – a film. Then come the price list per 100 g, a tea finder band and the journal.
• Home 03 – Tea Ceremonies: a framed hero slider, four ways to sit with tea, Flavour Wheel – the wheel stays beside the tea cards and turns each tea’s leading note under its red mark as the card passes – today’s sessions live with a booking form. Then come the matcha menu and a gallery strip. Finally, the page ends with the traditional teas and the specialists with a framed quote.

Tea House Pages

• Ceremonies: today’s sessions in time order, live (finished, on now, next, sold out), and four ceremonies – gongfu, matcha, afternoon tea, tasting – each with its next seats and the sessions of its next day.
• Ceremony Details: the week ahead with every session and its seats left. It also has the three teas poured and the steps at the table.
• Book A Ceremony: a four-step wizard – ceremony, a day and a session with seats left, guests (never more than the seats left) and details, confirm – with a live summary and a booking reference. Continue never blocks; only Confirm checks.
• Brewing Guide: choose a tea and your vessel: the water in °C or °F, the grams for your pot, the first steep and what each infusion adds. The infusion counter times the real steep of the infusion you are on. A chart of every tea’s guide.
• Tea Finder: pick flavour notes on the wheel’s eight tiles. Every tea is ranked by how closely it matches, with type and caffeine filters.
• The Shop: loose leaf in 25, 50 and 100 g tins, each with its own price and price per 100 g. Type, price, sort and search, product page with the tea’s brewing guide, bag, coupon, free-shipping meter, tax, checkout with an order number and a wishlist.

Inner Pages

Chanoya includes About, Our Story, Tea Masters, Master Profile, Gallery and Visit Us. It also has FAQ with search, Ceremonies, Ceremony Details, Book A Ceremony and Tea Menu. Then come Tea Finder, Brewing Guide, Tea Origins, Shop, Product, Cart, Checkout and Wishlist. There are also Blog, Blog Details and Contact (working PHP form, the week’s hours and a map). Finally, there are Login, Register, Forgot Password, Coming Soon and 404 – thirty pages in total.

Tea Shop Website Template Features

• 30 HTML pages, 3 unique home page designs
• Light and dark mode on one switch, remembered between visits, with no flash on load
• Right-to-left stylesheets for every page and a flag language picker that turns any page around (Bootstrap RTL included)
• WebGL layers tinted by the theme colours: terrace mist in the night bands and page titles. It also has a paper-cut tea bowl in the footer.
• Real tea house logic: ceremony sessions with seats left, booking, loose leaf by weight, brewing guides with an infusion counter, a flavour-note tea finder, live opening hours, shop totals
• A Bowl Turn preloader, Leaf Settle reveals with ink-brush rules, a tea-house seal pressed into cards on hover and three scroll moments that never pin the page
• Paper tea branches, a brush rule, mist banks and a rice-paper texture drawn for the template
• Swiper sliders, Fancybox popups, counters
• prefers-reduced-motion support for accessibility
• CSS-variable design tokens for both themes
• Working PHP form handler with optional invisible reCAPTCHA v3
• Font Awesome Free loaded locally, plus illustrated tea icons in two inks
• Fully responsive with a desktop-first breakpoint system and wide-screen layouts
• Zero console errors
• Well-commented code with a numbered CSS table of contents and JS index
• Documentation included

This tea shop website template ships with documentation, free lifetime updates and an instant download. Every page also works on phones, tablets and desktops. Chanoya also comes as React, Vue, Angular and WordPress, or in the developer bundle at 20% off. Browse more Restaurant & Cafe HTML5 templates.

Credits

Bootstrap 5.3, jQuery 3.7.1, Swiper 11, GSAP 3 with ScrollTrigger, Fancybox 3.5 and Font Awesome Free. It also uses RTLCSS and Google Fonts (Cormorant Garamond, Spectral).