Mankind

Updated: September 11, 2026

Mankind is a UK online retailer of men’s grooming, toiletries and beauty products, stocking more than 100 brands ranging from mass names like Aveeno and Braun to prestige lines such as Aesop, Clinique for Men and Elemis. The catalogue is organized by need into skincare, haircare, shave and beard care, bodycare, fragrance and dental, alongside a brand directory and rotating outlet and student discount sections, on a custom Astro-based build rather than a templated cart platform.

Website Design

A white ground with utility-built styling. The homepage sits on a plain white background with near-black body text and a mid gray, coded #333333 in the shared stylesheet, used for footer icons. The markup runs on Tailwind CSS utility classes, giving spacing and type scale a standard, tool-generated rhythm rather than a bespoke one.

One branded accent color. Outside that grayscale base, the only named color in the shared CSS is a tan gold, #c69c6d, applied to the site-wide offer banner and deepening to #b38a5c on hover, the single point of color across an otherwise neutral interface.

Banner-led merchandising. The homepage opens on a full-width promotional banner, currently launching the brand Heath with its own photography, above a horizontal strip of brand tiles linking straight to each brand’s shop.

Rendered rather than templated. Response headers and inline markup (x-astro-rewrite, per-component data-astro-cid attributes) point to a custom Astro-built front end rather than a Shopify or Magento theme.

Shopping Experience

A deep, filterable catalogue. The Mens Essentials listing runs to 257 items across nine pages, roughly 24 to a page. A left sidebar filters by brand, price, department and key ingredients, with sort by popularity, price, name or discount.

Ratings on the grid, not just the product page. Each product card carries its image, name, price, a “Save up to X%” badge where relevant, a star rating with review count, and a Quick Look button for an inline preview.

Brand hub pages. Selecting a brand from the directory opens a listing with a short description above the grid; the Aesop page, for example, frames the range as “simple yet effective products” in “stylish, simplistic packaging.”

Brand Storytelling

No single house voice. Rather than a founder story on the homepage, Mankind gives its top banner slot to partner brand launches, currently Heath, and leaves narrative copy to each brand’s own hub page, so positioning language shifts with whichever brand is being viewed.

Editorial framing in the newsletter pitch. The signup copy positions the retailer beyond a straight catalogue, inviting shoppers to hear about “latest arrivals…seasonal trends and exclusive editorial” rather than only discounts.

Notable Features

Layered spend discounts. A homepage banner offers tiered codes, spend 40 pounds for 10 percent off with SPEND10 or spend 60 pounds for 20 percent off with SPEND20, alongside separate always-on student and 22 percent key-worker discounts.

A long payment method list. The basket footer displays “Pay Securely With” above a dozen logos, from Visa and PayPal to Klarna, Clearpay and Laybuy, more buy-now-pay-later options than most single-brand stores carry.

Reviews surfaced early. Star ratings and review counts sit on the listing grid itself, so shoppers can compare products for social proof before opening a single product page.