Joey Banks, founder of Baseline Design, joins Code & Pixels to talk about what it actually feels like to navigate AI tooling right now. His “You’re Not Behind” post came out of his own anxiety the weekend Claude Design launched, and this conversation unpacks it honestly. The most interesting moment: Joey spent 102 prompts vibe-coding a to-do app in Cursor and found himself checking Slack while the model ran, feeling further from the output than he ever does in Figma.
“AI tends to pull us in deep before we’ve gone wide, and I think that’s a mistake.” Joey Banks’s recap of Config 2026 is a good summary of the features, but the reason to read it is this thread running underneath: the entire Figma canvas strategy this year is really an argument for staying in the messy middle rather than reaching for the polished AI output too fast.
Joey Banks shares a simple way to get started with variables structure when he is not sure where to begin: “One very simple approach that’s worked well for me is separating variables into non-interactive and interactive buckets. […] Non-interactive variables describe the environment. Things like background surfaces, text, icons, and borders that don’t change based on input. Interactive variables describe behavior, such as actions, states, and feedback that do respond to input.”
Joey Banks shares a free lesson from his course with Dive readers on how to use Figma’s MCP Server.
Joey Banks recreated Apple’s new iOS 26 and iPadOS 26 button styles using Figma, complete with their new Liquid Glass material. These buttons are fully editable and use native Figma effects.
Joey Banks on creating responsive and robust components within Figma: “Creating a component in Figma is relatively easy. However, building a component that works well in various situations and for different screen widths and heights using tools like constraints and auto layout can be more challenging and intimidating. Let’s first talk about those tools and how they work within Figma, and I’ll share the techniques and practices that have helped me ensure I’m building reliable components for those depending on the system.”
Joey Banks explains how to use constraints to create responsive components that work with nearly endless screen widths and heights. One hidden feature he didn’t mention is a special relationship between constraints and layout grids — see my old article “Using Constraints with Layout Grids in Figma” from 2020.
Joey Banks with a deep dive on applying and organizing variables in Figma: “…if there’s one thing I’ve learned about variables, it’s that nearly every team takes a slightly different approach when it comes to creating and keeping them organized in Figma. I’d love to recap the many ways I use variables within the components and libraries I make, as well as some of the techniques and decision frameworks that have helped me most, and share with you how I approach creating and keeping them all organized, too.”
Joey Banks shows one of the newly announced features. When objects are duplicated, rotated, and then duplicated again, Figma will continue that rotation with subsequent copies of your object.
Recap and wishlist from Joey Banks: “While the updates felt a little more iterative this time around rather than innovative, what Figma shared seems to be paving the way for all that’s near and far ahead. In case you missed the product keynote, or if perhaps you’d just like a recap of the highlights from the perspective of a design systems designer, I’d love to share all that’s new with you in this newsletter.”
Joey Banks recaps the Framework announcements. On choosing between styles and variables: “Wait, but styles don’t allow for modes, right? Wouldn’t the use of styles prevent us from switching themes or brands? Actually, this is what I’m most excited about with this update, and it’s the further positioning of how styles can be useful in combination with variables. Because all styles (yes, typography now, too!) can use variables, adjusting one variable mode within a style will adjust all variables to reflect that new mode change.”
Joey Banks with the deepest dive on the multi-edit: “The team solved and shipped a feature — actually, kind of a whole new way of working within the canvas — to help address a problem I didn’t even know I had.”
Joey Banks spent a lot of time after Config adjusting component libraries to use the new Figma features. In this issue of Baseline, he dives deep into variables and wrote an epic guide on what they are, how he is using them, and a few shortcuts to help make workflows and creation more efficient. My favorite tip on using the number variables: “With your cursor inside an input, tap the equal = key on your keyboard to launch the variable list quickly, or hold Shift + click. To remove a variable, click into the input and tap Backspace twice.” (Note that the = shortcut may go away in the future.)
This part of his conclusion brought back the topic of usability vs. visibility started by component properties: “One thing I still find to be a little challenging within this new way of building and viewing components in Figma is that so much of the previous on-canvas visual representation is now absent using variables. Previously, if there were two density sizes used or if a layer was toggled as hidden within a particular situation, that was easy to see, as we had to build it out as a visual variant. With variables, much of that information, such as sizing, booleans, and color adjustments, is all within the Variables modal and not on the canvas.”
Joey Banks’ recap of everything announced at Config. (I was lucky to meet Joey and share the scene with him at Config, and his deep knowledge of Figma and expertise in design systems are second to none. Highly recommend subscribing to his Baseline newsletter.)
Ridd just launched Deep Dives, “a new interview series full of stories and advice to help you take a huge leap forward in your career”. In the first episode, Joey Banks gives an in-depth look at what it’s like to lead design systems at Twitter and Webflow, shares his strategies for structuring component libraries, working efficiently in Figma, and even keeping up with all of the latest plugins and tooling.
Joey Banks is back with this year’s iPadOS 16 UI Kit for Figma! “This file contains hundreds of components, templates, demos, and everything else needed to help you start designing for iPadOS. Each component uses the latest version of Auto Layout, supports Component Properties, variants, Light and Dark Mode, and much more.”
Joey Banks is back with a bit of advice on his new approach to using Auto Layout for building responsive components. “With my approach today, I first like to drag out an unfinished component instance and stretch it in bizarre and unexpected ways to see what happens. If I can make this component work as expected in the strangest sizes, I’ll feel confident that it’ll work for nearly all situations.”
Joey Banks published an update to his file thumbnail UI kit with dozens of custom combinations, and now even easier to edit with component properties.
Joey Banks explains why new features are so important for the design systems’ work.
Joey Banks is back with five advanced Figma tips — renaming layers in bulk, selecting all objects based on a specific property, Spacebar’s superpower, private components, and using descriptions to improve search.