Bitpan — Multipurpose eCommerce React Next.js & HTML Template

Bitpan is an ecommerce template for skincare, fashion and modest-wear shops, in two versions in one download: a Next.js 16 app with React 19 and Tailwind CSS v4, and the same pages as plain HTML5 with Tailwind CSS, Alpine.js and Vite. One codebase carries three complete storefronts, each with its own heroes, sections and product range. Start from whichever is closest to your shop and keep the other two as reference.

In the Next.js version everything responds. Add to cart carries the colour, size and quantity you picked into the bag, the cart page and checkout. The heart saves a product to a wishlist, the filters narrow the list, and the search keeps its query in the URL. Nothing is a button waiting for a backend you have not written yet.

AI ready

  • DESIGN.md in the Next.js version holds the design language as values and rules, so an AI coding agent builds new pages in the same style
  • AGENTS.md in both versions: the conventions and the demo data in template/, how the pages, partials, scripts and data fit together in html/
  • Three agent skills in the Next.js version: build-page for a new page or section, restyle for fonts, corners, motion and colours, review-design to check a change against DESIGN.md
  • Two versions, one download

    template/ is the Next.js version. html/ is the same pages as plain HTML5 with Tailwind CSS 4, Alpine.js 3 and Vite 7: 23 pages captured from the Next.js build, so the markup, copy and look match. The finished site in html/dist/ opens from a folder and needs no server, and editing it needs Node.js 20.19 or newer. A product, a collection, a post and an order are each one sample page, and every card and link that leads to one of them opens the sample. The package holds a guide to each version, documentation/index.html and documentation/html.html. The live preview shows the Next.js version.

    Routes

  • Three home pages: skincare, fashion and hijab, each with its own hero and section arrangement
  • Collection pages in two layouts, with a filter drawer, a sort dropdown and pagination
  • Product pages in three layouts: sticky gallery, stacked gallery, carousel gallery
  • Search, with a shareable URL
  • Wishlist
  • Cart as a page and as a slide-over from the header
  • Checkout, order confirmation, order history and a single-order page
  • Account settings with address and email preferences
  • Journal index and article pages
  • About, Contact, sign-in, register and forgot-password
  • A designed 404 and error page, in the template’s own type rather than the framework default
  • What is built in

  • One cart from product to confirmation, with Quantity and Remove in the drawer, on the cart page and at checkout
  • Checkout with inline errors, and express delivery that changes the total
  • Category, brand, colour and sort in the URL, with a Clear button and an empty state
  • A heart on every product card, share on products and posts, and a write-a-review dialog
  • A phone action bar that keeps the price and Add to cart in reach on product pages
  • A size guide dialog on the fashion and hijab storefronts
  • Colour and size swatches, operable by keyboard and announced to screen readers
  • An image lightbox on every product gallery
  • A full SEO surface: sitemap, robots, per-page canonical URLs, Open Graph, and Organization, Product and BreadcrumbList structured data
  • A social card drawn at build time for every product, article and collection
  • npm run check, which builds, type-checks, lints and scans every built page for dead links
  • Stack

  • Next.js 16.3 with the App Router and Turbopack
  • React 19.2
  • Tailwind CSS v4.1, configured in CSS rather than a config file
  • TypeScript 5.9
  • Headless UI, Heroicons, Hugeicons, Embla Carousel
  • DM Sans and Playfair Display, self-hosted at build time
  • HTML version: HTML5, Tailwind CSS 4, Alpine.js 3, Vite 7, Handlebars partials
  • All 148 pages of the Next.js version are built at deploy time. Exactly one image is preloaded per route, source images are sized to how they actually render, and the data layer never reaches the browser bundle.

    What is not included

  • No backend. Products, collections, posts and orders are literal values in one file, and the cart and wishlist live in the browser’s memory, so a reload starts the demo over. There is no database, no API key and no service to sign up for
  • In the HTML version, saved choices (the bag, hearts, orders), filtering and sorting of lists and search results are as captured, because they need a server of your own. The guide lists each difference
  • Six blog images load from images.unsplash.com rather than shipping in the package. The HTML version links the same photographs
  • The demo photography is for the demo. Replace it with your own before launch; the licence file says which images are which
  • The HTML version ships no sitemap or robots file, and the guide says how to add them
  • Dark mode is switched off deliberately, and the documentation says how to turn it back on
  • Explore more high-quality resources in our Graphics & Illustrations library, and pair them with curated Graphic Templates and Web & Site Templates for your digital creations.

    📋 Asset Specifications & Compatibility

    Item Title
    Bitpan – Multipurpose eCommerce NextJs Template

    Element ID
    PM5PV4F

    Formats / Software
    Adobe Photoshop / Illustrator / PNG

    License Type
    Commercial & Personal Use

    Bitpan - Multipurpose eCommerce NextJs Template Preview

    Original creative preview & visual showcase

    ⚡ High-Speed Direct Cloud Download

    Original untouched resource package hosted on 5TB unlimited Google Drive:

    ☁️ Download Package (Google Drive)
    🔒 Direct SSL Encrypted Link • Fast Unthrottled Speed • Original Clean Archive