How to create a Responsive Screen that adapts its Navigation Bar


A Figma tutorial on creating and previewing a responsive screen that's driven by variables and which adapts its navigation bar based on the screens width.
Please note that design systems such as the one laid out in this article are only available on education, professional or organization Figma accounts.
Step One: Create the Design System
