Shadcn.io is not affiliated with official shadcn/ui
Checkout Installments
A buy now pay later installment checkout block for React and Next.js with plan selector, four equal payment amounts with dates, monthly preview, interest rate display, and APR notice built with shadcn/ui and Tailwind CSS
Offer flexible installment plans with this buy now pay later checkout block for React and Next.js. Features selectable installment terms at 3, 6, and 12 months, a clear breakdown of four equal payment amounts with scheduled dates, monthly cost preview, interest rate and APR display, and a total cost comparison. Built with TypeScript, shadcn/ui Button and Badge components, Lucide icons, and Tailwind CSS. Ideal for high-value product checkouts, BNPL integrations, and e-commerce financing options.
Related Components
Split Payment
Split across multiple methods
Crypto Checkout
Cryptocurrency payment checkout
Invoice Request
B2B pay-by-invoice checkout
Pickup & Delivery
Pickup vs delivery selection
Order Summary
Complete order summary view
Express Checkout
One-click express checkout
FAQ
Was this page helpful?
Sign in to leave feedback.
Hotel Reservation
A hotel reservation checkout block for React and Next.js with hotel name, room type, check-in and check-out dates, guest count, nightly rate, extras selection, and cancellation policy notice built with shadcn/ui and Tailwind CSS
International
An international checkout block for React and Next.js with country selector, currency display, international shipping options, customs duty estimate, and adaptive address format using shadcn/ui Select, Input, Label, Button, RadioGroup, and Tailwind CSS