Spotify

How Spotify rethinks Design Systems in the age of AI

AI workflowsDesign Systems

1. Context

Why the company talks about Design Systems

Spotify builds digital experiences across many platforms: mobile, web, TV, wearables and internal tools.

The Design System, called Encore, is part of Spotify's core platform and supports thousands of product teams across the company. Encore provides shared tokens, components and guidelines across all platforms, making it what Spotify considers a "golden technology."

Historically, teams came to the Design System for answers. Documentation, guidance and support lived in spaces controlled by humans, and this model worked well. Until AI became part of daily work.

2. The problem

What becomes difficult at scale

AI is now used by designers, engineers and product managers across Spotify. People start with AI instead of documentation, asking questions to AI agents first, often bypassing Design System teams entirely.

AI produces prototypes, code suggestions and decisions. But these outputs may ignore Design System rules, creating a fundamental problem.

This creates risk

Inconsistent UI
Custom implementations
Reduced adoption
Loss of relevance

If the Design System isn't present in AI workflows, it slowly disappears.

3. Their approach

Principles decisions mindset

The team reframed their role, recognizing that the landscape had fundamentally changed.

Spotify Design System Encore principles and approach: How Spotify reframed their Design System role to work with AI-driven workflows, showing the key shift from serving humans only to also supporting machines, with two parallel work streams for machine-readable documentation and component architecture changes — Spotify Design System Encore: Principles, decisions and mindset for AI-driven workflows

Key shift

The goal shifted from serving humans only. The system must also work for machines.

This realization led to two parallel work streams:

Machine readable

First, the Design System must be machine readable. Documentation, rules and guidelines need to be accessible to AI agents, not just humans.

Component architecture

Second, the component architecture must change. Rigid bundles slow down humans and confuse machines. Both need clarity and flexibility.

The focus moved toward clarity, structure and constraints, not control.

4. What worked

Concrete learnings

MCP server integration

Encore documentation was exposed to AI agents using an MCP server, allowing tools like Cursor to generate code based on Spotify's standards.

Testing framework

A testing framework was built to evaluate AI output quality, comparing generated components against real Encore components.

Visual testing

Visual testing was added to ensure AI-generated UI maintained visual consistency with Encore's design language.

Layered architecture

The component system was redesigned using a layered architecture, separating foundations, styles and behaviors for better clarity.

Headless components

Headless component systems provided interaction logic, while Encore focused on brand feel, accessibility and consistency.

Reduced friction

This approach reduced friction for teams while also reducing context complexity for AI systems.

5. What others can learn

Transferable patterns

Design Systems must exist where AI operates

Otherwise they get bypassed

Constraints matter more than generation

Structure enables consistency

Flexible architectures scale better than rigid bundles

Eighty percent coverage is realistic at scale

Design Systems are infrastructure

They must support humans, machines and product velocity

6. Source

Where this use case comes from

Conference Recording

A design system that enables humans and machines to co-create production-ready UI - at scale

Victoria Tholerus

she/her

Web Engineer at Spotify

Aleksander Djordjevic

he/him

Senior Product Designer at Spotify

This use case is based on a live session by the Spotify Design System team, presented during an Into Design Systems meetup and recorded at Spotify.

The session covered how Spotify adapts its Design System to work with AI driven workflows, including MCP integration, component architecture decisions and challenges at scale.

If you want to learn how other teams apply similar patterns in practice, these kinds of real-world workflows are explored in depth at Into Design Systems.

Get access to the full recording

This session is included as a bonus recording when you purchase access to the AI Design Systems Conference 2026.