Skip to content

E-commerce UI Kits

Shop designs for apps and websites: product grids, product pages, carts and checkout. 6 kits, from a free fashion UI kit to COBALT, a Figma kit with a matching Next.js storefront.

Products

Compare at a glance

App or website

Sable and Shop Ecommerce Mobile are app kits for shopping on a phone. Markly and the free Fashion kit are store websites, and Markly also comes as a ready Framer site.

COBALT covers both sides of the work: a Figma design system and a production Next.js template, built from the same tokens so the design and the code stay in step.

What a complete ecommerce UI kit includes

Browsing: a home page with featured products, category pages, search with filters and a product grid. Buying: a product page with sizes, colors and reviews, a cart, address and payment steps, and an order confirmation. After the sale: order history, tracking and an account page.

A kit that stops at the home page and one product page looks finished in a screenshot but leaves the hard part to you. Sable covers 9 complete flows, and COBALT has 73 screens with working cart, search and checkout in its Next.js template.

Figma, Framer or Next.js

Figma kits are for teams that will design the store further and build it themselves or with a developer. Shop, Sable, Markly and the free Fashion kit are Figma files.

Markly also comes as a Framer site, ready to publish for a small brand. COBALT is for teams writing code: the Figma file and the Next.js storefront share the same tokens, so a design change maps straight to the code.

What to check before you buy

Count the checkout steps, not the screens. A store depends on the cart, address, payment and order confirmation, so make sure the kit you pick has all four.

Each product page lists the flows its file includes, with the full gallery of screens.

Questions

Still unsure? Email us and a designer will answer.

Email us