Cactaceae – free Adobe Xd UI kit
Last Updated on July 9, 2026 by Editorial Team
A nice UI kit with clean design, created in Adobe Xd by Ana Lourenço.
Cactaceae is built around the idea of a plant and lifestyle shop, and that shows in every card you see: cactus product photography in warm greens set against a bright white interface, all floating on a teal-turquoise background that gives the whole kit its identity.
The palette is deliberately narrow. White panels, dark teal-to-mint accents, and soft grey text keep the interface calm so the product photography can carry the color.
That restraint is worth noting if you are hunting for a UI kit that already has a strong, cohesive color story baked in rather than a blank canvas you have to dress yourself.
Structurally, this is an ecommerce UI kit through and through. You get a filters panel with category, brand, price range slider, and color swatch selectors, a nested categories dropdown, a shopping cart module with quantity steppers and gift options, and content blocks for related articles and latest news.
Together these pieces sketch out a full plant store experience: browse, filter, read a blog post about keeping your cactus alive, add to cart, checkout.
That makes it a genuinely practical starting point for anyone prototyping a home and garden ecommerce site, a niche plant or succulent shop, or any small-batch retail concept where product photography needs to feel front and center.
Where the Components Do the Most Work
The filter sidebar is the most reusable piece here. Its accordion-style rows for category, brand, sort order, price slider, color radio buttons, and shipping or pricing options map directly onto any faceted search pattern.
Even outside a plant shop, this panel adapts well to fashion, home goods, or marketplace projects that need a left-rail filtering system.
The category dropdown next to it, with its nested list and a highlighted active state plus a small “new” tag, is a clean pattern to study for showing hierarchy without overwhelming the user.
The card components for related articles and product tiles use a consistent formula: image, title, price or rating, small heart icon for favoriting.
Because the ratio and spacing stay identical across cards, swapping in your own photography is straightforward. Drop a new image into the same frame, update the title and price text, and the card keeps its proportions intact.
The same logic applies to the news and blog teaser blocks; the headline, snippet, and thumbnail sizes are already tuned, so editorial content slots in without extra layout work.
If you plan to reskin this kit for a different niche, start by replacing the cactus photography with images that share a similar crop and lighting mood, since the layout leans on close, textured product shots to feel complete.
From there, adjust the accent color used for buttons like “Explore now” and “Apply filter” if teal does not suit your brand, but keep the white card backgrounds since they are doing the heavy lifting in making the interface feel airy against a saturated backdrop.
The shopping cart section is worth a closer look too. It lists items with checkboxes for gift wrapping, a save-for-later link, and an erase option, alongside quantity inputs and line totals.
That level of detail makes it a solid reference for anyone designing a real cart drawer or checkout step, since those small utility links are exactly the kind of thing that gets overlooked in quick mockups.
Pair this kit with a simple icon set for cart, heart, and chevron glyphs if you need to extend it beyond what is shown, and consider a secondary photography style guide so any additional product shots you add match the tone of the originals.
