Figma Variables
Variable modes as a replacement for component properties
CEST
7:00 PM
BST
6:00 PM
EDT
1:00 PM
PDT
10:00 AM
In this session you will learn how to reduce component complexity by replacing properties with variable modes and how to translate variable modes into CSS for developers.
We’ll also discuss why luminance is king when creating accessible colour scales and how to make compromises when adapting brand guidelines to UI design.
What you will learn
- Advanced usage of variable collections
- Accessible colour scales with APCA and OKLCH
- Optical margin alignment
- Aligning text to baseline grids
Who is this for
Design system designers and developers who want to make the most out of Figma variables to improve the user experience for the product teams, and who wants to learn about perceptual colour models and optical adjustment of typography and spacing on the way.
Presented by:
Victor Nystad
Lead Analyst Digital Design Equinor
Victor is a hybrid designer/developer in the Equinor Design System Core Team, with a background in typography and more than 28 years in the industry, the last 8 of those specialising in design systems. He has four kids (with number five on her way), and loves hiking and analog synthesizers.
The Equinor Design System is used by about 200 internal line-of-business applications and about 700 designers and developers in various product teams across the business.
Figma Variables
Variable modes as a replacement for component properties
MAY 28
7:00 PM
to
8:30 PM
CET
In this session you will learn how to reduce component complexity by replacing properties with variable modes and how to translate variable modes into CSS for developers.
We’ll also discuss why luminance is king when creating accessible colour scales and how to make compromises when adapting brand guidelines to UI design.
What you will learn
- Advanced usage of variable collections
- Accessible colour scales with APCA and OKLCH
- Optical margin alignment
- Aligning text to baseline grids
Who is this for
Design system designers and developers who want to make the most out of Figma variables to improve the user experience for the product teams, and who wants to learn about perceptual colour models and optical adjustment of typography and spacing on the way.
Presented by:
Victor Nystad
Lead Analyst Digital Design Equinor
Victor is a hybrid designer/developer in the Equinor Design System Core Team, with a background in typography and more than 28 years in the industry, the last 8 of those specialising in design systems. He has four kids (with number five on her way), and loves hiking and analog synthesizers.
The Equinor Design System is used by about 200 internal line-of-business applications and about 700 designers and developers in various product teams across the business.
Time:
CEST
7:00 PM
BST
6:00 PM
EDT
1:00 PM
PDT
10:00 AM
Frequently
Asked
Questions
What does Personal Access mean? Can I share my access with others?
With your personal conference ticket you will get exclusive access to the live conference and all of our recordings. The personal access allows for single-session logins per account, preventing simultaneous access from multiple devices.
How can I generate an invoice?
How do I get access to the live stream?
When will the recordings be available?
Frequently Asked Questions
What does Personal Access mean? Can I share my access with others?
With your personal conference ticket you will get exclusive access to the live conference and all of our recordings. The personal access allows for single-session logins per account, preventing simultaneous access from multiple devices.
How can I generate an invoice?
How do I get access to the live stream?
When will the recordings be available?
Figma Variables
Variable modes as a replacement for component properties
CEST
7:00 PM
BST
6:00 PM
EDT
1:00 PM
PDT
10:00 AM
In this session you will learn how to reduce component complexity by replacing properties with variable modes and how to translate variable modes into CSS for developers.
We’ll also discuss why luminance is king when creating accessible colour scales and how to make compromises when adapting brand guidelines to UI design.
What you will learn
- Advanced usage of variable collections
- Accessible colour scales with APCA and OKLCH
- Optical margin alignment
- Aligning text to baseline grids
Who is this for
Design system designers and developers who want to make the most out of Figma variables to improve the user experience for the product teams, and who wants to learn about perceptual colour models and optical adjustment of typography and spacing on the way.
Presented by:
Victor Nystad
Lead Analyst Digital Design Equinor
Victor is a hybrid designer/developer in the Equinor Design System Core Team, with a background in typography and more than 28 years in the industry, the last 8 of those specialising in design systems. He has four kids (with number five on her way), and loves hiking and analog synthesizers.
The Equinor Design System is used by about 200 internal line-of-business applications and about 700 designers and developers in various product teams across the business.
Figma Variables
Variable modes as a replacement for component properties
MAY 28
7:00 PM
to
8:30 PM
CET
In this session you will learn how to reduce component complexity by replacing properties with variable modes and how to translate variable modes into CSS for developers.
We’ll also discuss why luminance is king when creating accessible colour scales and how to make compromises when adapting brand guidelines to UI design.
What you will learn
- Advanced usage of variable collections
- Accessible colour scales with APCA and OKLCH
- Optical margin alignment
- Aligning text to baseline grids
Who is this for
Design system designers and developers who want to make the most out of Figma variables to improve the user experience for the product teams, and who wants to learn about perceptual colour models and optical adjustment of typography and spacing on the way.
Presented by:
Victor Nystad
Lead Analyst Digital Design Equinor
Victor is a hybrid designer/developer in the Equinor Design System Core Team, with a background in typography and more than 28 years in the industry, the last 8 of those specialising in design systems. He has four kids (with number five on her way), and loves hiking and analog synthesizers.
The Equinor Design System is used by about 200 internal line-of-business applications and about 700 designers and developers in various product teams across the business.
Time:
CEST
7:00 PM
BST
6:00 PM
EDT
1:00 PM
PDT
10:00 AM
Frequently Asked Questions
What does Personal Access mean? Can I share my access with others?
With your personal conference ticket you will get exclusive access to the live conference and all of our recordings. The personal access allows for single-session logins per account, preventing simultaneous access from multiple devices.
How can I generate an invoice?
How do I get access to the live stream?
When will the recordings be available?
