How to change the Corner Radius of a Frame or Shape in Figma

Oscar de la Hera Gomez
A flower that represents Figma with the text “Corner Radius” beneath it.

A step by step guide on adding a corner radius to all corners or specific corners of a frame or shape.

Step One: Select a Frame or a Shape

A screenshot of Figma with a Frame, Rectangle and Triangle shape on screen, beneath them sits labels that state “Frame” “Rectangle” and “Shape” respectively. The frame is highlighted indicating that it has been selected.

Select a Frame or a Shape.

Step Two: Change the radius of every corner

A screenshot of Figma with a Frame, Rectangle and Triangle shape on screen, beneath them sits labels that state “Frame” “Rectangle” and “Shape” respectively. The frame is highlighted indicating that it has been selected and has a corner radius. We have also highlighted the corner radius input on the right menu bar which has a 60px value - change this to change the corner radius of a shape or a frame.

To change all the corner radii of a frame or shape, change the corner radius value on the right menu bar.

A screenshot of Figma with a Frame, Rectangle and Triangle shape on screen, beneath them sits labels that state “Frame” “Rectangle” and “Shape” respectively. The rectangle is highlighted indicating that it has been selected and has a corner radius. We have also highlighted the corner radius input on the right menu bar which has a 100px value - change this to change the corner radius of a shape or a frame.

The same technique works for a rectangle.

A screenshot of Figma with a Frame, Rectangle and Triangle shape on screen, beneath them sits labels that state “Frame” “Rectangle” and “Shape” respectively. The triangle is highlighted indicating that it has been selected and has a corner radius. We have also highlighted the corner radius input on the right menu bar which has a 60px value - change this to change the corner radius of a shape or a frame.

The same technique works for any other shape.

Step Three: Change Individual Corner Radii

A screenshot of Figma with a Frame, Rectangle and Triangle shape on screen, beneath them sits labels that state “Frame” “Rectangle” and “Shape” respectively. The frame is highlighted indicating that it has been selected and has different corner radius per corner. We have also highlighted the box next to the corner radius input. Click it to open a menu that reveals the individual radiuses. This menu shows that we have set different radii per corner of the frame - change them to change the individual radii.

To change the individual radii, click the independent corners icon next to the corner radius input to reveal the individual corner inputs that appear below the original corner radius input. Change the individual corners radii to adapt a frame or rectangle to your specifications.

Please note this is only available for frames and rectangles.

A screenshot of Figma showing that the ability to change the individual radii is also available for rectangles.

The same technique works for a rectangle.

Step Four: Click and Drag


<p>A screenshot of Figma with a Frame, Rectangle and Triangle shape on screen, beneath them sits labels that state “Frame” “Rectangle” and “Shape” respectively. The triangle has been selected and we have highlighted the circles that appear on the corners. If you click and drag these circles you can change the corner radii visually.</p>
<p></p>

Finally, on shapes only (including rectangles) you can click and drag the circles that appear near the corners to change the corner radii visually.

Please note that this change will apply to all corner radii.

Looking to learn more about the basics behind styling frames, paths, shapes and text in Figma ?

Consult the list below to learn more about the basics behind styling text, shapes, paths and frames in Figma.

Any Questions?

We are actively looking for feedback on how to improve this resource. Please send us a note to inquiries@delasign.com with any thoughts or feedback you may have.
delasign logo

Book a Free Consultation.

An icon of an email.

Click here to email us.

Fill in the details below to book a free consultation or to let us know about something else. Whatever it is, we are here to help.

How can we help you ?

Contact Details