Before you Start
Who can use this feature
Users on Any plan
Users with Edit access to a File to adjust the position and dimensions of objects
Below the alignment and distribution buttons at the top of the Properties Panel are tools for directly manipulating the location and dimensions of objects on the canvas. You can change the width, height, rotation, and border radius, as well as modify the x and y coordinates.
You can always manually type in values, but scrubbable inputs are fun and help speed up your workflow.
- Select an object on the canvas
- Place your cursor over the lable next to the input and watch the cursor change. You can also place your cursor over the input field and use Alt or Option and click as well.
- Now click and drag to change the input value
If you're cursor needs to go off the screen, no worries, Chrome supports cursor wrap. This works if you're using Figma in a Chrome browser, or if you're using our desktop app.
Scrubbable inputs also work when you need to add strokes, change the opacity, or blur effects.
You control the speed
Sometimes you may need to move objects ever so slightly. Sometimes you need to move them quite a bit. Here's a nice feature:
- Select a shape on your canvas
- Place your cursor over the x-axis input field
- Hold the Alt or Option key and click to activate the left/rightcursor
- Drag the cursor over the canvas
- Now slowly drag the cursor up and down the canvas
You'll notice two things:
- The width of the cursor changes, and
- A visual indicator pops up on the screen (Scrubbing at 1/2, 1x, 2x, etc). This even works with the cursor wrap technology.
When the cursor is wider and you move your mouse left and right, the object moves along the x-axis in smaller increments.
When the cursor is narrower and you move your mouse left and right, the object will move along the x-axis in smaller increments
You can rotate individual objects, Frames and Groups. There are a couple ways to do this.
- Select the element you wish to rotate on the canvas
- Place your cursor just outside the object handles to activate the rotation arrows
- Click and drag to rotate your image
You'll also see the degree of rotation change in the properties panel. Scrubbable inputs also work for rotating objects. Hover over the rotation icon to the left of the input and drag to rotate.