Rounded Rectangle shapes expand to fill the space offered to them by their parent. For example, when you insert a Rounded Rectangle into a component, the shape automatically fills all of the space available in the component.

You can use modifiers such as Frame or Aspect Ratio to give the Rounded Rectangle a new parent to fill.

Rounded Rectangles come with a Radius, Corners, Style, and Color property that you can adjust.

The Rounded Rectangle shape has a corner Radius property that configures how rounded its corners are. By default, it has a Radius of 8 points.

Rounded Rectangles have a Corners property which can be set to Circular or Continuous. Changing the style results in a subtle difference in the way the corners are drawn. ‍

Circular corners are the more traditional corner radius style while Continuous corners have softer edges—a style that Apple uses frequently in their designs.

The Style property determines whether a Rounded Rectangle is drawn as a Fill or as a Stroke (border). By default, the shape’s style is set to Fill, but it can be changed to Stroke or Stroke Border from the drop-down.

A Stroke is drawn centered over the path of the Rounded Rectangle while a Stroke Border is drawn inside the path of the shape.

When you select Stroke or Stroke Border, you can control the width of the stroke with the Line Width property.

The Color property defines the color of a Rounded Rectangle’s Fill or Stroke, depending on the Style chosen.