Skip to main content

targetAspectRatio

When toggled, causes the layer to keep its proportions when the user resizes it via auto layout, constraints, the properties panel, or on-canvas. If not set, the node does NOT resize toward a specific targetAspectRatio.

Signature

targetAspectRatio: Vector | null [readonly]

Remarks

Use lockAspectRatio and unlockAspectRatio to set targetAspectRatio.

const parentFrame = figma.createFrame()
const image = await figma.createNodeFromJSXAsync(
<figma.widget.Image
src="https://picsum.photos/200/300"
width={200}
height={300}
/>
)
parentFrame.appendChild(image)

image.lockAspectRatio() // set to 2:3 ratio, implicit from the size

// Add autolayout to parent, which defaults to Hug x Hug
parentFrame.layoutMode = 'HORIZONTAL'

// Set child to fill-width
image.layoutGrow = 1

// Resize parent to be much larger
parentFrame.resize(500, 1000)

// Since the child is fill-width, it will expand to the available space
image.width == 500
image.height == 750
// Image maintains the 2:3 ratio even as it grew with auto layout!
caution

⚠️ targetAspectRatio cannot be used with auto-resizing text (TextNodes where textAutoResize !== NONE).