tezvyn:

Create a crescent moon in Figma using Boolean operations

AI-drafted, machine-checkedSource: help.figma.comintermediate

Tests Figma vector workflow and layer hierarchy. A strong answer picks Subtract selection, places the cutter shape above the base, and notes the bottom layer sets fill and stroke. Confusing Subtract with Exclude or ignoring layer order is a red flag.

WHAT THIS TESTS: Practical command of Figma's vector tooling for icon design, specifically Boolean operations. Interviewers want to see you know the four operations by name and purpose, but more importantly that you understand Subtract selection for cutting shapes, how layer ordering affects the outcome, and that Booleans are non-destructive. This signals you can build scalable, editable icon systems rather than relying on one-off hacks.

A GOOD ANSWER COVERS: First, name Subtract selection as the correct Boolean operation because it removes overlapping areas from the bottom layer. Second, describe the setup: place the shape you want to keep at the bottom of the layer stack and the shape you want to cut out on top, then select both layers. Third, apply the operation via the toolbar or the Alt Shift S shortcut. Fourth, emphasize that the result is a non-destructive Boolean group, so you can still select and edit the original circles to tweak the crescent thickness or position. Fifth, mention that the bottom layer determines the fill, stroke, and effect properties of the resulting group, though these can be changed later.

COMMON WRONG ANSWERS: Choosing Exclude instead of Subtract without explaining the distinction; Exclude removes overlapping areas from all layers and keeps non-overlapping parts, which is not the same as cutting one shape from another. Suggesting flattening or outlining strokes as a primary method, which destroys editability. Forgetting layer order and claiming the top layer is the one that gets subtracted. Saying Boolean operations work on frames or sections, which they do not. Failing to mention that the result is a live, editable group.

LIKELY FOLLOW-UPS: How would you animate or scale this icon while preserving the Boolean relationship? What happens if you need to add a stroke to the resulting crescent and want it on only the outer edge? How would you convert this to an SVG export and what does the code look like? Can you use text layers in Boolean operations? How do you handle a case where the cutter shape has a stroke and you want the stroke included in the subtraction geometry?

ONE CONCRETE EXAMPLE: To make a crescent moon, draw a large circle for the moon base and a smaller circle for the shadow cutter. Position the smaller circle overlapping the large one where you want the bite taken out. In the Layers panel, ensure the large circle sits below the small circle. Select both shapes and choose Subtract selection. The overlapping area disappears, leaving a crescent. Because the operation is non-destructive, you can double-click into the Boolean group and nudge either circle to refine the curve. The bottom circle's fill becomes the group's fill by default.

Read the original → help.figma.com

Get five bites like this every day.

Tezvyn delivers a daily feed of 60-second tech bites with quizzes to lock in what you learn.