How Do You Make a Transparent Box in Figma?

If you’re looking for a way to make a transparent box in Figma, you’ve come to the right place. Figma is an incredibly versatile platform that allows you to quickly and easily create user interfaces, illustrations, and design elements.

With its intuitive drag-and-drop UI, it’s easy to make a transparent box from scratch and add it to your project. This article will show you how.

Step 1: Create the Frame

The first step is to create the frame for your transparent box. To do this, open up Figma and create a new frame from the toolbar.

You can adjust the size of the frame by dragging the corner handles. Make sure it’s large enough for whatever content you plan on adding.

Step 2: Set Opacity

Once your frame is created, select it and open up the Properties Panel. This panel will allow you to edit various aspects of your frame such as its color, opacity, stroke weight, etc. To make your box transparent, set its opacity value to “0”.

Step 3: Add Content

Now that your frame is created and set to be transparent, it’s time to add content inside of it. You can do this by creating objects (such as rectangles or text) within your frame and positioning them accordingly.

Step 4: Style Your Transparent Box

The last step is to style your transparent box with colors, shadows, or any other design element that you want. Select the frame again and use the properties panel to customize it however you’d like.


With these simple steps you can easily create a custom transparent box in Figma! Whether you’re creating a user interface or designing an illustration, this technique will help bring more depth and texture into your project.