Biharat — Tailwind CSS Spice Bazaar Template (HTML)

About This Item

Spice merchants, masala brands and tea or coffee roasters can sell by weight and grind with Biharat. This Tailwind CSS spice bazaar template runs on Tailwind CSS 4. It has 20 pages and 2 homepage designs, and the shop numbers calculate from the markup. So filters, basket totals and jar prices behave correctly when you swap in your own products.

Two Homepages for Spice Counters and Market Floors

Home 01, The Counter, opens with a four-slide hero and a scrolling spice marquee. It also has a seven-shelf category rail. A pinned horizontal Grind Room walks through the six stages between field and jar. Popular products filter and sort live, and a dark stats band uses animated counters.

Home 02, The Market Floor, has a three-slide hero, and the looping video keeps slide one. It adds a four-cell promise strip and a Blend Of The Week band with the house garam masala ratio. A six-tile category mosaic and a Shop By Origin grid follow.

A Tailwind CSS Spice Bazaar Template for Masala Merchants

Prices come from a per-gram rate, so jar size and grind chips recompute the total. Product Details also shows a live line with the cost per 100g, and the SKU follows the jar size.

• Spice Shop: filters by shelf, origin, price per 100g and grind, with four sort orders and a grid or list toggle.
• Quick View: opens from any product card, so shoppers can pick grind and quantity before adding to the basket.
• Blend Builder: six sliders must add up to a full jar, then it shows cost per 100g and a heat rating.
• Cart and Checkout: coupon code, a free-delivery threshold line and a live order summary.

Origins Menu and Flag Filters for Spice Bazaar Importers

If you import single-origin spices, these pages matter most to you. The Origins mega menu lists sixteen countries in four regions, each with a flag and its known spice. That suits any Tailwind CSS spice bazaar template that sources widely. A flag strip runs above the topbar. Origin cards on Home 02 and a counted list in the shop sidebar drive the same product filter. The template includes 271 SVG flags, so changing countries is a file rename.

Recipe, Journal and Account Pages

• Our Sourcing, with origin cards and a farm-to-jar route
• Recipe Archive with heat filtering, and Recipe Details with ingredients by weight and numbered steps, a useful pairing for a Tailwind CSS spice bazaar template
• Journal Grid, Journal List and Journal Details
• About and Contact, which includes a working form handler
• Login, Register, Forgot Password, 404 and a Coming Soon page with a countdown

Utility Styling Across the Shop With Tailwind CSS 4

Styling sits in utility classes, so you can read and change a section’s look right in the markup. You set colors, fonts and spacing once in the Tailwind theme, and a change there reaches the Spice Shop, Blend Builder and checkout alike. Hover and focus states sit beside the base styles, so product cards and form fields stay easy to adjust.

Motion uses GSAP with ScrollTrigger, and Swiper powers the sliders. Fonts are Bricolage Grotesque and Montserrat, with Font Awesome Free and a spice icon set. The template also supports prefers-reduced-motion.

The finished pages open as they are. The download also holds the Tailwind source if you want to edit and rebuild the styles. Neutral placeholders replace the preview images, while the download holds the logo files, favicon, country flags and payment badges. Documentation comes with it too.