Polygon and star shapes in Figma - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to create a polygon shape with 5 sides.

Figma

const polygon = figma.createPolygon();
polygon.pointCount = [1];

Drag options to blanks, or click blank then click option'

A6

B3

C5

D8

Attempts:

3 left

💡 Hint

Common Mistakes

Using 3 or 6 sides instead of 5.

Confusing pointCount with star points.

The pointCount property sets the number of sides for the polygon. For a pentagon, use 5.

2fill in blank

medium

Complete the code to create a star shape with 7 points.

Figma

const star = figma.createStar();
star.pointCount = [1];

Drag options to blanks, or click blank then click option'

A7

B8

C5

D6

Attempts:

3 left

💡 Hint

Common Mistakes

Using the default 5 points instead of 7.

Mixing polygon and star properties.

The pointCount property sets the number of points on the star. For a 7-point star, use 7.

3fill in blank

hard

Fix the error in the code to set the star's inner radius to 30.

Figma

const star = figma.createStar();
star.innerRadius = [1];

Drag options to blanks, or click blank then click option'

A30

Bstar.innerRadius(30)

CinnerRadius = 30

D'30'

Attempts:

3 left

💡 Hint

Common Mistakes

Using quotes around the number.

Trying to call innerRadius as a function.

The innerRadius property expects a number, not a string or function call.

4fill in blank

hard

Fill both blanks to create a polygon with 8 sides and set its corner radius to 10.

Figma

const polygon = figma.createPolygon();
polygon.pointCount = [1];
polygon.cornerRadius = [2];

Drag options to blanks, or click blank then click option'

A8

B5

C10

D15

Attempts:

3 left

💡 Hint

Common Mistakes

Using wrong number of sides.

Confusing corner radius with point count.

Set pointCount to 8 for an octagon and cornerRadius to 10 for rounded corners.

5fill in blank

hard

Fill all three blanks to create a star with 6 points, set its inner radius to 20, and outer radius to 50.

Figma

const star = figma.createStar();
star.pointCount = [1];
star.innerRadius = [2];
star.outerRadius = [3];

Drag options to blanks, or click blank then click option'

A5

B6

C20

D50

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing inner and outer radius values.

Using wrong number of points.

Set pointCount to 6 for six points, innerRadius to 20, and outerRadius to 50 for star size.