Learnings

<p>Figma has a new VS Code extension that allows devs to open designs on VS Code and get CSS autocompletion from what they are inspecting </p>

<p>Create an Optimized Style Guide in Figma for Webflow </p>

<p>The Component Gallery is an up-to-date repository of interface components based on examples from the world of design systems </p>

<p>“Include” is a Figma plugin built to make annotating for accessibility (a11y) easier for designers to spec and for developers to understand what is required. </p>

<p>FigGPT: Use ChatGPT in Figma or Figjam! </p>

<p>If you notice the different BG colours on your assets, this does not mean some have a white BG and others dont. This is Figma’s way of saying: “White BG = Component with 1 variant, Grey BG = Component with multi variants” </p>

<p>Adding an emoji to the beginning of your Figma's file title replaces the default File Icon with your chosen emoji :art:</p>

<p>Welcome to the WIP — <em>How do you make progress when the work is always in flux? What if some of the best features actually—gasp!—start with a solution instead of a problem?</em> </p>

<p>Magically transform your Figma frames into a PowerPoint/Google Slide using this plugin </p>

<p>When replacing thousands of uncomponentized UI on Figma, try using the Similayer plugin to find all repeated layers and replace all selected at once by pressing ⇧ Shift + ⌘ Command + R</p>

<p>How to safely upgrade and deprecate components in Figma </p>

<p>Move published components and component sets between files, without breaking links to instances. </p>

<p>Creating one-third or two-third responsive layouts in Figma </p>

<p>When dealing with extensive Figma files with dozens of different Pages, you can create an empty page between other pages and call it ” ” to create breathing rooms between contexts and make the file more amicable to navigate.</p>

<p>Find all Instances of a Component used in your file. </p>

<p>Detach components, just like you detach instances with this simple plugin. </p>

<p>Design Workflow with Chakra UI (Third Party Design Library) and Figma </p>

<p>10 Best React Design System Libraries by Openbase </p>

<p>This plugin transforms all of the prototype interactions into arrows in the spec</p>

<p>Design for everyone with these accessibility-focused plugins </p>

<p>10 Figma Best Practices to 10X Your Workflow </p>

<p>An all-inclusive Figma template for your next remote design sprint </p>

<p>Playground for learning how to use the new Interactive Components feature for Figma (Beta)-(Community)?node-id=0%3A1</p>

<p>Universal search bar for Figma, fetch assets faster from your design system </p>