Shopix - eCommerce Template

Overview

Shopix is a premium eCommerce template from Shadcn Studio with 30+ storefront pages, from three hero layouts and category listings to product detail, cart and payment. The layout focuses on product discovery and checkout, and it can be extended with Shadcn Studio's components, blocks and other templates.

Shopix is built on Next.js 16 with shadcn/ui and Tailwind CSS v4 and comes with matching Figma files built on variables, Auto Layout and an atomic structure. It is meant as a frontend foundation that teams can connect to Shopify, Medusa, Commerce Layer or another backend.

Features

• 30+ eCommerce pages: Home, 3 hero layouts, category listing, product detail, cart, payment and more
• Headless-friendly: Intended as a storefront frontend for Shopify, Medusa, Commerce Layer or a custom backend
• Figma design system: Components built with Figma variables, Auto Layout and atoms-to-templates structure
• Theming: Light, dark and custom themes via variable modes and next-themes
• Forms and validation: React Hook Form with Zod
• Interactive blocks: Based on Shadcn Studio's interactive components and blocks
• Dev handoff: Clean layer naming and annotated specs for Figma Dev Mode

Tech stack

• Next.js 16 (App Router)
• shadcn/ui, Tailwind CSS v4
• TypeScript
• Motion
• React Hook Form, Zod
• next-themes, Sonner, Lucide React