Skip to content
Laptop and phone showing the redesigned CVS.com homepage: shop navigation, a back-to-school promo banner, and a personalized ExtraBucks message

CVS Shop Website Redesign

CVS.com had years of inconsistency from acquisitions. I led the type system, the icon system, the component library, and the overall design direction. The approach was composable primitives rather than page-specific components, so teams could assemble what they needed.

Client
CVS
Role
Associate Design Director
Agency
Razorfish
Year
2023
Brand visual language showing CVS design elements and UI patterns

Typography & Icons

I designed a type system with a rational scale and a grid-based icon and illustration system using CVS brand red. Each icon was constructed on a consistent grid, so a 16px icon and a 48px icon read as the same family. No one-off sizing decisions. The type scale and icon grid became the foundation everything else was built on.

The Problem

CVS sits at an unusual intersection: pharmacy and general retailer. That means the platform serves a wider range of intent than most e-commerce sites. Over time, the shop grew through acquisitions rather than deliberate system thinking, producing fractured type scales, inconsistent icons, and components built independently rather than from shared parts. Because CVS.com is a live platform with real customer volume, fixing it required discipline: I couldn’t redesign from scratch. I had to build shared parts that made every downstream page more consistent without breaking what was live.

Icon and illustration system, geometric shapes built for the CVS brand
Icon construction, grid-based build process for consistent sizing

The Work

Instead of designing a “homepage hero” or a “category card,” I built the type scale, icon grid, and spacing system so any team could assemble what they needed. Starting with the typographic framework meant every downstream component inherited consistency rather than having to engineer it in later. The icon system followed the same principle: one grid, one palette, no case-by-case adjustment.

CVS.com homepage, desktop and mobile responsive layout

Components & Templates

The component library covered homepage modules, product pages, and category navigation. Each piece was built to work across desktop and mobile from the start, preventing the usual pattern of designing desktop first and adapting after the fact.

Shop navigation, category browsing on desktop and mobile Brand page template, Skin Care / Neutrogena on mobile and desktop
UI components including headlines, product cards, and product tabs
UI components including pagination, branding elements, and category navigation

What I Learned

The biggest lesson was restraint. On a live platform, the instinct is to redesign everything. Not breaking what shipped forced better thinking: build the smallest possible shared parts, and let consistency propagate through adoption rather than mandates. The teams that picked up the system fastest were the ones who felt the pain of the old fragmentation most. It removed decisions they were tired of making.


Like what you see?

Get in touch