🤩 FlyonUI Pro Update - New Dashboard & Application UI Blocks, Templates, Landing Page, FlyonUI MCP 🪄, and more!

Explore
Sort by
Blocks Header BG

Tailwind CSS Checkout Page

Create seamless checkout experiences with Tailwind CSS Checkout blocks. Streamlined forms, secure payment options, and responsive design.

FlyonUI Blocks

Checkout 1

Use this Tailwind CSS checkout block to display a cart with item details, coupon input, and payment options like Credit Card or PayPal, showing subtotal, shipping, and total costs.

Preview in Figma
Open in New Tab

Checkout 2

Third Party
This block uses a third party component. Please refer to respective docs for more information.

Use this Tailwind CSS payment block to let users choose from Visa, Mastercard, or PayPal, add new payment methods, and view order costs with savings, shipping, and promotions.
This block integrates a third-party library. For setup and usage details, please see the Flatpickr.

Preview in Figma
Open in New Tab

Checkout 3

Third Party
This block uses a third party component. Please refer to respective docs for more information.

Use this Tailwind CSS checkout block to show a cart with items like red cap, apply discounts, and collect user details like name and address, with a 'Place Order' button.
This block integrates a third-party library. For setup and usage details, please see the Flatpickr.

Preview in Figma
Open in New Tab