Peppi Health: Telehealth E-commerce Website in Framer

Peppi Health sells prescription peptide therapy in pre-filled, pre-dosed pens. Every order is reviewed by a licensed clinician. They needed a website that feels as simple as the product: clear, trustworthy, and quick to buy from. It also had to connect to CarePortals, the telehealth platform that runs their products, patient intake and orders.

I built the site in Framer: a fully responsive marketing site, a CMS-powered shop, subscription product pages, and custom React code components that connect the storefront to CarePortals' cart and checkout.

Telehealth e-commerce is not a typical store:

Prescriptions come before payment. Customers add a protocol to the cart, then complete a medical intake, and a clinician approves it before anything ships.

Plans, not just products. Each protocol is offered as a 3-month plan (first month free, then 20% off), a 1-month plan, or a one-time purchase.

Trust is the conversion. Sourcing, lab testing and clinician oversight have to be clear on every page.

The site has to talk to the platform. Cart, products and checkout live in CarePortals, not Framer.

Story-led sections: a hero, a press strip, "Why the Peppi pen is better", featured protocols, a 4-step "How our prescriptions work" timeline, sourcing and lab testing, a comparison with DIY vials, and an FAQ.

Reusable components: each section is a Framer component, so the team can rearrange and reuse them across pages.

Products in the CMS: every product is a Framer CMS item, including single peptides and multi-peptide stacks with their ingredient tags.

Category filters: the shop page filters by Recovery, Beauty and Performance.

New products without code: adding a product needs no developer.

One CMS template drives every product page.

Plan selector: shows the 3-month plan (free first month, then 20% off), the 1-month plan and a one-time purchase option.

Gallery: a product image gallery.

Cross-sell: a "Pairs well with" card that adds a complementary stack.

Framer doesn't connect to telehealth platforms out of the box, so I wrote custom React/TypeScript code components:

Cart widget: a slide-out cart connected to CarePortals carts.

Add to cart button: each button is tied to a CarePortals product ID that the client sets from Framer's properties panel.

One-time purchase link: for customers who don't want a subscription.

Product gallery and carousels: used on product and marketing pages.

Custom checkout page: built on CarePortals' Patient API with card payment fields, billing address, date-of-birth formatting and discount codes. A single setting switches the cart between this checkout and CarePortals' hosted checkout.

All of it is configured through Framer property controls, so the client can manage products and settings without editing code.

Stuck carts: I found a problem where carts stayed filled after checkout and wouldn't accept new items. The cart now checks whether its cart is still active, clears completed carts automatically and starts a new one.

Checkout debugging: I traced checkout issues through console and network logs and wrote clear technical reports for the client and the platform team, so problems got fixed quickly.

Every page is tuned for desktop, small screens, tablet and phone. The plan selector and cart work as smoothly on mobile, where most shoppers browse.

For the team: Peppi Health has a fast, on-brand Framer website they can update themselves, with products, pages and policies in the CMS.

For shoppers: the storefront connects to their telehealth platform from "Add to cart" to clinical intake.

For future clients: the work became the foundation for my reusable telehealth commerce kit for Framer.

Framer (CMS, components, responsive breakpoints)

React and TypeScript code components

CarePortals telehealth platform (cart, products, Patient API)

Need a Framer website for a telehealth, healthcare or e-commerce brand? I build Framer sites with CMS setups and custom code integrations. Send me a message on Contra.