Yes. It is a client React component with no Next.js imports, so it works in Vite, Remix or any React 18+ app with Tailwind v4 and shadcn's CSS variables.
Product catalog
01 — Overview
A four-step checkout with a live 3D credit card, a 3D Secure code step and a confetti confirmation. Drop it into any React or shadcn project.
Volt Checkout takes a shopper from cart to confirmation in four animated steps: cart, delivery, payment and review. The 3D card is built with three.js. It fills in as you type, tilts toward the pointer and flips over for the CVC. Promo codes, shipping options and a counting order total are built in. A 6-digit verification dialog comes before payment, and the order-confirmed screen bursts into 3D confetti. It is fully typed and follows your shadcn theme in light and dark mode. With reduced motion turned on, nothing animates. Connect onPlaceOrder to your backend and it is ready to ship.
02 — Details
03 — FAQ
Our team will help you get the right configuration.
Yes. It is a client React component with no Next.js imports, so it works in Vite, Remix or any React 18+ app with Tailwind v4 and shadcn's CSS variables.
It is the checkout interface. Connect onPlaceOrder to your payment provider; for real cards, use your provider's secure card fields. The full card number and CVC are never passed to your code.
Five files in components/volt-checkout, plus gsap, three and lucide-react, and three accent colour variables in your globals.css.
Yes. Items, addresses, shipping options, payment methods, promo codes, tax rate and currency are all props.
04 — Reviews
Custom build