Home
Templates
Beauty & Personal Care
Organic & Natural Beauty Brand
Refill - Sustainable Apothecary Landing Page Template
Refill is a modular card grid landing page built for sustainable apothecary and zero-waste beauty brands. It opens with a Before/After Slider, flows through macro product photography, a slow-motion video section, and ingredient origin cards. Every product card includes an "Add to Ritual" call to action, a sticky cart bar, and a refill subscription path, all wrapped in a warm, atelier-inspired visual identity.
by Rocket studio
Refill is a single-page landing page template designed for sustainable, refillable beauty brands. It combines a dramatic Before/After Slider header, a modular card grid with flip animations, and a full-width video section. The layout moves at a deliberate pace, guiding visitors from curiosity to commitment through quiet, intentional design rooted in the zero-waste beauty ethos.
This template is built for founders and sellers who lead with purpose as much as product. It suits brands where the packaging is part of the story and the customer expects transparency.
Most beauty landing pages were designed to move volume, not to build trust. They rush toward checkout with loud banners and countdown timers that feel out of place for a brand built on slowness and intention.
You get a fully structured, section-led landing page that tells the complete brand story from clutter to calm. Every component is purposeful and prompt-ready for a sustainable beauty storefront.




Theme
Atelier Studio
Creative direction
Immersive Visual
Color system
Soft Mist
Style
Card Grid (Modular)
Direction
Marketplace/Multi
Page Sections
Before/after Slider Header
Modular Product Card Grid with Hover Flip
Full-width Slow-motion Video
Ingredient Origin Cards
Sticky Cart and Impact Bar
Timed Free Sample Kit Modal
Can I use this template for a wholesale or spa-facing audience?
Does the product card grid support multiple product types?
How does the refill subscription path work within the page?
What is the timed modal and when does it appear?
Can I edit the color palette and typography to fit my brand?
This landing page template delivers a set of visual and functional components designed specifically for the refillable beauty market. Each feature earns its place by serving both the brand story and the buyer journey.
The page opens with an overhead comparison: a cluttered plastic-filled counter on the left, a single amber glass bottle on a linen cloth on the right. Visitors drag the divider and watch the visual noise dissolve into calm. A hand-set serif headline, "Less packaging. More ritual.", fades in beneath the slider.
Product cards display macro photography close enough to show seed flecks in a scrub or air bubbles in an oil. Each card flips on hover to reveal the return-and-refill lifecycle icon. The primary call to action, "Add to Ritual" in aged brass, lets visitors build a cart without leaving the grid.
A slow-motion video of amber bottles being hand-filled, capped, and sealed with wax plays full-width between the product grid and the ingredient section. The pacing is deliberate and immersive, reinforcing the handcrafted nature of the product line.
Each botanical ingredient is pinned to a named farm through dedicated origin cards. This section adds transparency and depth, giving ingredient-conscious shoppers the sourcing detail they look for before committing to a purchase.
A sticky bottom bar follows the visitor through the scroll. It tallies cart items in real time and displays a running count of plastic bottles avoided, making the environmental impact of each purchase feel immediate and personal.
After thirty seconds on the page, a gentle modal appears offering a free sample kit in exchange for covering return shipping. The form collects only name, email, and skin concern, reducing friction while proving the product before asking for full payment.
| Section | Purpose |
|---|---|
| Before/After Slider | Opens with a dramatic clutter-to-calm visual comparison |
| Serif Headline Block | Fades in brand promise beneath the slider |
| Product Card Grid | Displays refillable products with hover flip animations |
| Full-Width Video | Showcases the hand-filling process in slow motion |
| Ingredient Origin Cards | Pins each botanical to a named farm source |
| Sticky Cart Bar | Tallies items and tracks plastic bottles avoided |
| Subscription Quiz Path | Routes visitors to a skin-type refill subscription quiz |
| Sample Kit Modal | Offers a free trial kit after thirty seconds on page |
The visual identity follows an Atelier Studio theme built around the Soft Mist color system. The palette feels like a ceramicist's workshop at golden hour: chalky, muted, and warm, with generous whitespace acting as breathing room between elements.
The modular card grid adapts cleanly to smaller screens without losing the visual rhythm that makes the template distinctive. The layout prioritizes readability and touch-friendly interaction at every breakpoint.
This landing page is structured to build trust gradually and convert visitors through proof and intention rather than pressure. Every section earns the next click.
This template is a strong fit for organic and natural beauty brands operating in the sustainable skincare space. It is equally suited to direct-to-consumer launches and wholesale-facing storefronts where brand credibility is part of the pitch.