How Do You Create a State in Figma?

Figma is a powerful, free tool for designing and prototyping websites and mobile apps. It has become one of the most popular design tools in the industry due to its ease of use and powerful features.

One of the key features of Figma is the ability to create states, which allow you to quickly prototype different versions of a design without having to manually create each variation. In this article, we’ll explain what states are in Figma and how you can create them.

What are States?

States in Figma are essentially versions of your design that capture different stages or versions of your UI. They are like snapshots that can be used to quickly switch between different versions without having to rebuild them manually. You can think of states as a way to prototype different ideas without having to redo all your work.

How Do You Create a State?

Creating a state in Figma is easy. All you need to do is click on the “State” button at the top right corner of the interface.

This will open up a menu with several options for creating states, including “Create New State”, “Duplicate State”, and “Rename State”. The first option allows you to create an entirely new version of your design from scratch; the second option allows you to duplicate an existing state; and the third option allows you to rename an existing state.

Once you have created a new state, it will appear on the left side panel as well as in the drop-down menu at the top right corner. You can then make changes to any element within that state while preserving its original version.


Creating states in Figma is an essential part of any design workflow. It allows designers to quickly prototype different versions of their designs without having to manually recreate each one every time they want to make changes. By using the “State” button at the top right corner, it’s easy for anyone with basic knowledge of Figma’s interface to create new states and switch between them whenever necessary.