Levis // CMS & Design System

As Levi’s digital ecosystem expanded across app and web, the existing CMS and content workflows became a constraint. Teams relied heavily on bespoke builds, content updates were slow to ship, and consistency across experiences was difficult to maintain.

This project focused on rethinking the CMS and design system as shared infrastructure, enabling teams to move faster, reduce duplication, and deliver cohesive experiences at scale. The goal was not just to modernize tooling, but to establish a foundation that could support ongoing evolution across channels.

Project

Reduce Friction and Duplication
Replace bespoke page builds with a modular system that allowed teams to reuse components, ship faster, and spend less time rebuilding similar experiences.

Enable Consistency Across Channels
Establish shared design and content patterns that supported alignment between the app and site while allowing each surface to evolve appropriately.

Empower Teams Without Sacrificing Quality
Create clear guardrails and governance within the CMS so marketing and product teams could move quickly without eroding brand integrity or performance.

Project Objectives

The goal was to create and maintain a design system that felt familied. We wanted to create a system across all platforms that was fluid and honored the platform that we were designing for. We maintained colors and fonts across all platforms and created modules, interactions and pages that were specific to the platform and audience.

We worked closely with engineering to document and update existing or new patterns/elements and pages. We had a comprehensive system that not only accounted for elements but also cms modules, examples, motion, etc.

Here are some examples of those different use cases across the different platforms.

Design System

Desktop

  • Mobile Web

  • App

  • In Store Devices

    • Tailor Shop Terminal

    • Store Associate Ipad

    • POS System

Platforms

The Basics

Here is a selection of some of the Levis styleguide basics

Brand & Experience Principles

Our design system was created based on a set of Experience and Brand principles.

They are the foundation of the system—proof of the relationship between the Levi’s brand and the approach to design and should be used to guide its continued evolution.

Voice & Tone

Clear, confident writing should be consistent across products, collections and initiatives, and should include a little elbow room for writers to bring the culture at large to bear.

This foundation allowed teams to ship faster, reduce rework, and spend more time solving customer problems instead of rebuilding similar patterns across platforms.

CMS & Module Design

We made the transition from hard coded pages to a CMS. This allowed us flexibility to make changes more easily as well as create a suite of modules that served the marketing as well as commerce.

The CMS and design system became the connective tissue that allowed learnings from the app and Next Gen site to be adopted consistently and sustainably across the broader ecosystem.