Notebook

(2)

Building Fjällräven’s Multi-Brand Design System with Figma Variables

Figma

Product Design

Design System

Building Fjällräven’s Multi-Brand Design System with Figma Variables

Jun 28, 2025

·

4 min read

When Fjällräven reached out, they had a clear goal. They wanted to create one design system that could support multiple brands without flattening their identities. Their teams were growing, design efforts were being duplicated, and there was no single source of truth. It was time to bring clarity and scale into the picture.

I joined as a design consultant to help them build a modern, flexible system that the design and development teams could own and evolve together.

You can explore the full case study on my website here.

Fjällräven

Why we chose Figma and how Variables became our foundation

We explored a few tools, but Figma quickly stood out. Not just because of how collaborative it is, but because of its newest feature at the time: Figma Variables. Variables let us define core design tokens like color, spacing, typography, and brand modes directly inside the design tool.

Instead of using plugins or waiting for engineers to map tokens later, we built everything directly into our system. Each brand lived in its own mode. Switching styles didn’t require redesigning anything. We just changed variable values.

This gave us token-level control from the beginning. It helped us move fast, stay consistent, and stay in sync with developers from day one.

figma dev mode

Making it work with the development team

A good design system should work in code, not just in Figma. We partnered closely with Fjällräven’s development team to make sure everything mapped clearly from design to implementation. Tokens had consistent naming. Components were built with real behaviors in mind. We even worked on typography and spacing scales together.

This collaboration helped avoid the usual gap between mockups and shipped product. It also made it easier to maintain and scale as new brands or features were added.

Design tools evolve fast, so the system had to adapt

We knew from the start that Figma would keep growing. As new features like nested variables and component properties rolled out, we updated our structure to keep pace.

We avoided rigid setups. Everything was built to be flexible and easy to update. This helped future-proof the system and made sure it stayed relevant as design tools changed.

Figma
figma design system

Turning brand identity into tokens

Each of Fjällräven’s brands had a strong visual identity. But their assets were scattered across tools and formats. Some were in Sketch. Others were in PDFs or internal docs. We worked with the design team to collect everything and turn it into usable tokens inside Figma.

We organized colors, type styles, icons, and spacing into modes using Figma Variables. This made it simple to swap between brands and still stay true to each brand’s design language.

It also gave the team a structured way to explore new ideas without starting from scratch.

Going beyond components by designing full UX flows

We didn’t stop at components. We wanted to give designers a system they could actually build with. So we created full UX flows for things like product pages, carts, and onboarding.

These templates helped designers move quickly and stay consistent. Instead of rebuilding every screen, they could adapt flows that already worked. It saved time and improved quality across the board.

Fjällräven

Final workshop and system handoff in Sweden

We closed the project with a live workshop at Fjällräven HQ. It wasn’t just a handoff. We walked through the full system, adjusted variables together, and co-built components in real time. Both the design and development teams were there, working side by side.

The team left with full ownership of the system. It wasn’t something passed over. It was something built together, with shared understanding and momentum.

For a visual breakdown and more behind-the-scenes, check out the Fjällräven design system project on my portfolio.

Fjällräven

Why multi-brand systems matter more today

Design systems are more than just reusable components. They are product infrastructure. For companies like Fjällräven with multiple brands, a well-structured system creates alignment, speeds up launches, and strengthens the overall brand experience.

They are not alone. The UAE Government, Adobe, and Atlassian have also invested in multi-brand systems to stay scalable and consistent.These systems reduce duplication, speed up onboarding, and let teams focus on what matters most, like designing great products.

For Fjällräven, the system we created gave them more than efficiency. It gave them ownership. And when teams own their system, they move faster, design better, and collaborate with confidence.

Robbbottt

Robbbottt

Rob.

Yo Peeps!

I design thoughtful, scalable user experiences with a strong focus on design systems, UX, and product growth.


Fluent in English, Arabic, and Armenian, I bring a multicultural perspective to every project I work on.

Robbbottt 2025©️ The human robot