This morning, @Ana_Boyer, Josh Ferrell, and @Ryhan_Hassan shared in a livestream how Figma evolved from its first set of design tokens into a full system using Figma variables as our source of truth! 
But wait… that’s not all! Check out all of the latest updates we announced this month below! 
Enhanced Project Management with Trash, Restore, and Permanent Delete
Now, you can:
- Trash projects you no longer need, keeping your workspace organized.
- Restore trashed projects and recover all active files within them when you need them back.
- Permanently delete projects, removing all associated files to clear out space for good.
Variables updates and component properties improvements for design systems
Component properties can be bound to variables
- Variables can now be bound to an instance’s component property to help drive design system consistency and more powerful prototypes.
- The UI has been simplified so that now both variables and properties are combined into one drop down menu with text at the top position.
Plus, seven quality of life improvements to variables
- Copy and paste variables: In the authoring modal, users can now use keyboard shortcuts for copy and paste. Users can also copy multiple variables at once and paste variables in a different collection or file.
- New variables under the selection: When creating a new variable in the authoring modal, the new variable appears under the selection (and not at the bottom of the table).
- Tabbing through authoring window: In the authoring modal, tab stops are now present in the inputs for modes, variable names, and variable values for improved accessibility.
- Improved accessibility: Pressing Backspace once within a bound input field now detaches the variable (previously, two Backspaces were required). Clicking on an input field sets the focus to it. Additionally, when tabbing through inputs with bound variables, the focus remains on the value itself, capturing user action. The keyboard interactions are now smoother and should behave as expected.
- Resizable columns in the authoring modal: Columns in the authoring modal are now resizable for easier viewing of longer-form data
- Hover to show value and description: Hovering on a bound variable shows the rendered value and the variable’s description in the tooltip.
- Hover to show group name: When long group names are truncated in the variable picker, hovering shows the full name in a tooltip. Also fixed bugs in the authoring modal where long group names were cut off in the sidebar and the group headers.
Eyedropper is now more powerful, ergonomic, and fully redesigned for UI3
A few new updates to the eyedropper, only available in UI3
- Eyedropper now supports color variables and color styles in addition to the raw hex
- Eyedropper can create a new color variable or color style and apply that variable by using the shortcut “command + shift” even when not a visible option
- Users can use the eyedropper to copy hex, RGB, HSL, HSB codes in raw text format to the clipboard
- Users can use the tab key to rotate through different color formats directly from the eyedropper
Get all the variable information you need in Dev Mode.
Suggested variables
When getting layout code suggestions in Dev Mode, users will now see when a style, color, or size value matches a local variable even if it wasn’t specified in the design.
Variables details
Users now can see more than just the variable names in Dev Mode. Selecting a variable opens a pop-up panel that includes values, properties, aliases, collection information, and more.
Access variable collections
View all the variable collections used in a file in a single table. Easily see all available variables, modes, and values in a single view.
Libraries modal refresh
The libraries modal in UI3 has been refreshed, making it easier and faster to browse libraries and add them to your Figma Design file. We’ve added a new “recommended” libraries view and clearer arrangement of available libraries across your teams. This update is available in UI3 only.
