Boolean operations (union, subtract, intersect, exclude) in Figma - Step-by-Step Guide

Introduction

Boolean operations in Figma let you combine shapes in different ways to create new shapes. This helps you build complex visuals by adding, removing, or overlapping simple shapes without redrawing them.

When you want to combine two shapes into one shape to simplify your design.

When you need to cut out one shape from another to create a hole or a unique shape.

When you want to keep only the overlapping area of two shapes for a focused design element.

When you want to exclude the overlapping area and keep the non-overlapping parts of shapes.

When you want to create icons or logos by merging or subtracting basic shapes quickly.

Steps

Step 1: Select multiple shapes

- Canvas

All selected shapes show blue outlines indicating they are selected

Step 2: Click the Union selection button

- Top menu bar, Boolean group icons

Selected shapes merge into one combined shape with a single fill color

💡 Use Union to combine shapes and keep all areas visible

Step 3: Click the Subtract selection button

- Top menu bar, Boolean group icons

The top shape cuts out from the bottom shape, creating a hole

💡 Order of shapes matters; the top shape subtracts from the bottom

Step 4: Click the Intersect selection button

- Top menu bar, Boolean group icons

Only the overlapping area of the selected shapes remains visible

💡 Use Intersect to focus on the common area between shapes

Step 5: Click the Exclude selection button

- Top menu bar, Boolean group icons

The overlapping area disappears, leaving only the non-overlapping parts

💡 Use Exclude to remove the intersection and keep outer parts

Before vs After

Before

Two separate shapes: a blue circle and a red square overlapping partially

After

One combined shape: for Union, a single shape covering both areas; for Subtract, a red square with a blue circle hole; for Intersect, only the overlapping area visible; for Exclude, the two shapes with the overlapping area removed

Settings Reference

Boolean operation type

📍 Top menu bar, Boolean group icons

Choose how selected shapes combine or subtract from each other

Default: Union

Shape order

📍 Layers panel

Determines which shape subtracts or overlaps in Boolean operations

Default: Depends on layer order

Common Mistakes

Selecting only one shape before applying Boolean operation

Boolean operations require at least two shapes to combine or subtract

Select two or more shapes before choosing a Boolean operation

Ignoring shape order when using Subtract

The top shape subtracts from the bottom shape, so wrong order gives unexpected results

Check and adjust shape order in the Layers panel before subtracting

Summary

Boolean operations let you combine or cut shapes to create new complex shapes easily.

Use Union, Subtract, Intersect, or Exclude buttons in the top menu after selecting shapes.

Shape order affects results, especially for Subtract operation.

Practice

1.

Which Boolean operation in Figma combines two shapes into one shape that covers all areas of both?

easy

A. Subtract

B. Union

C. Intersect

D. Exclude

Solution

1. Step 1: Understand the Union operation

   Union merges two shapes into a single shape covering all areas of both shapes.

2. Step 2: Compare with other operations

   Subtract cuts one shape from another, Intersect keeps only overlapping parts, Exclude removes overlaps. Only Union combines fully.

3. Final Answer:

   Union -> Option B

4. Quick Check:

   Union = Combine all areas [OK]

Hint: Union joins all shapes fully without cutting [OK]

Common Mistakes:

• Confusing Subtract with Union
• Thinking Intersect combines all areas
• Mixing Exclude with Union

2.

Which of the following is the correct way to apply the Subtract Boolean operation in Figma?

1. Select two shapes
2. Click on Subtract in the Boolean operations menu
3. The top shape cuts out the bottom shape

easy

A. The top shape cuts out the bottom shape

B. The bottom shape cuts out the top shape

C. Both shapes merge into one shape

D. Only the overlapping area remains

Solution

1. Step 1: Recall Subtract operation behavior

   Subtract removes the area of the top shape from the bottom shape.

2. Step 2: Verify the direction of subtraction

   The top shape acts as the cutter, so it cuts out from the bottom shape, not the other way around.

3. Final Answer:

   The top shape cuts out the bottom shape -> Option A

4. Quick Check:

   Subtract = Top shape cuts bottom [OK]

Hint: Top shape always cuts out bottom in Subtract [OK]

Common Mistakes:

• Reversing which shape cuts which
• Thinking Subtract merges shapes
• Confusing with Intersect or Exclude

3.

Given two overlapping circles in Figma, what will the Intersect Boolean operation produce?

medium

A. A shape of the overlapping area only

B. A shape excluding the overlapping area

C. A shape of the first circle minus the second

D. A shape covering both circles completely

Solution

1. Step 1: Understand Intersect operation

   Intersect keeps only the overlapping area between two shapes.

2. Step 2: Apply to overlapping circles

   Only the area where both circles overlap remains visible after Intersect.

3. Final Answer:

   A shape of the overlapping area only -> Option A

4. Quick Check:

   Intersect = Keep overlap only [OK]

Hint: Intersect keeps only the overlap area [OK]

Common Mistakes:

• Thinking Intersect merges full shapes
• Confusing with Union or Subtract
• Assuming it excludes overlap

4.

In Figma, a user tries to apply the Exclude Boolean operation but the result is the same as Union. What is the likely cause?

medium

A. The user selected only one shape

B. The shapes are grouped, not boolean combined

C. The shapes are locked

D. The shapes do not overlap

Solution

1. Step 1: Recall Exclude operation effect

   Exclude removes overlapping areas between shapes, leaving non-overlapping parts.

2. Step 2: Analyze why result equals Union

   If shapes do not overlap, Exclude cannot remove anything, so it behaves like Union.

3. Final Answer:

   The shapes do not overlap -> Option D

4. Quick Check:

   No overlap means Exclude = Union [OK]

Hint: Exclude needs overlap to differ from Union [OK]

Common Mistakes:

• Assuming grouping affects Boolean results
• Thinking single shape can exclude
• Ignoring shape overlap requirement

5.

You have three overlapping shapes: A, B, and C. You want to create a new shape that includes all areas covered by A and B but excludes any area where C overlaps. Which Boolean operation sequence should you use?

hard

A. Intersect A and B, then Exclude C

B. Subtract C from A, then Union with B

C. Union A and B, then Subtract C

D. Exclude C from A, then Intersect with B

Solution

1. Step 1: Combine A and B fully

   Use Union to merge A and B into one shape covering all their areas.

2. Step 2: Remove overlap with C

   Use Subtract to cut out any area where C overlaps from the combined shape.

3. Final Answer:

   Union A and B, then Subtract C -> Option C

4. Quick Check:

   Union then Subtract excludes C overlap [OK]

Hint: Union first, then subtract to exclude overlap [OK]

Common Mistakes:

• Using Intersect instead of Union first
• Excluding before combining shapes
• Mixing order of operations