Free Transform in Figma — How to Skew, Distort & Transform Shapes

“I want to skew a shape like Illustrator’s free transform.” “I’m looking for trapezoid or perspective and can’t find it.” “I scaled it up and the stroke width changed too.” Stumbling points when transforming shapes in Figma usually come from one thing: Figma’s built-in transforms go as far as resize, scale, rotate, and flip — skew and perspective aren’t built in. Knowing that line clears up most of the confusion.

This article walks through what’s built in (resize, scale, rotate, flip) → adding free transform, skew, and perspective with a plugin, in the order of what you’re trying to do. At the end, we cover what trips up designers migrating from Illustrator or Adobe XD.

The short version: built-in stops at resize, scale, rotate, flip

Figma’s built-in features cover resize, scale, rotate, and flip. Free transform (dragging the four corners independently), skew, and perspective (trapezoid) are not built in. If you need those, use a dedicated plugin or approximate them with a workaround. Keep that line in mind and it’s the shortest route.

What you’ll learn

  • How to resize and scale a shape (and scale strokes and effects along with it)
  • How to rotate and flip, with the shortcuts
  • How to add free transform, skew, and perspective with a plugin (since Figma has no native option)
  • How to pick a transform plugin
  • What trips up designers migrating from Illustrator or XD

📐 Resize and scale (the Scale tool)

There are two ways to change a shape’s size, and they give different results, so use them deliberately.

  • Resize (selection tool): select the shape and drag the outer handles. Hold Shift while dragging to keep the aspect ratio. Stroke width, corner radius, and effects stay as they are — only the dimensions change.
  • Scale (Scale tool, K): switch to the Scale tool with K, then drag — strokes and blurs scale along with the shape1. On a text layer it changes the bounding box and the font size at once2. Use this when you want to make the whole thing, say, 1.5× bigger.

Dragging isn’t the only way to use it. Figma’s help centre documents three more controls in the Scale panel of the right sidebar1.

  • Scale by multiplier: pick one from the dropdown in the Scale panel, or type a value and press Enter
  • Scale by dimensions: type into either the width or the height field and the other updates automatically
  • Set the scale direction: use the anchor box to choose which side stays put. Anchored to the centre, the object grows in every direction; anchored to the top-left, it grows down and to the right

⚠️ Two things the Scale tool won’t touch. The official docs are explicit that locked layers and layers nested inside a component instance can’t be scaled1. When one element stubbornly refuses to resize, check those two first.

Resize vs. Scale

To make a button twice as big, a plain resize stretches the box while strokes and text stay their original size — the layout looks broken. The Scale tool (K) scales the stroke width and text along with it, so the proportions hold. For scaling up an icon or component as a whole, Scale is the one you want.

Watch for fractional values after scaling

The official docs note that because the Scale tool ignores constraints in order to scale everything together, it can produce fractional font sizes and layers on subpixel positions and dimensions2. That isn’t only a tidiness problem — it’s a documented cause of unwanted artifacts on export. Stick to clean multipliers like 1.5× or 2×, or round the values back off after scaling.

🔄 Rotating

There are a few ways to rotate a shape — pick one for the job.

  1. Drag with a handle. Select the shape and move the cursor just outside a corner until it becomes the rotate cursor, then drag. Hold Shift for 15° increments3.
  2. Type an exact angle. Enter a value in the Rotation field of the right panel for a precise angle3.
  3. Move the point it rotates around. By default Figma rotates around the centre of the selection, but Option + R (Mac) / Alt + R (Windows) reveals the rotation-origin target, which you can drag somewhere else3. Clock hands and pendulums — anything that pivots on its end — are impossible to build without this.

The angles themselves follow a rule worth knowing. Per the official docs, every layer starts at 0°, and a positive angle goes counterclockwise while a negative angle goes clockwise, each running to ±180°. Past 180° the count runs back down toward 0° — go 15° beyond 180° and Figma shows -165°3.

No rotate tool — and effects don't rotate

Figma has no single-key shortcut for a “rotate tool” — there’s no rotation equivalent of K for Scale. You rotate by dragging just outside a corner, entering a value in the right panel, or Shift-dragging for 15° increments, and you can always check and correct the angle in the right panel afterward.

The other thing to know: Figma won’t rotate the effects applied to a layer3. Spin a shape with a drop shadow and the shadow keeps pointing the way it did before. If the light direction matters, readjust the shadow’s X / Y after rotating.

🪞 Flipping

To mirror a shape (swap left–right or top–bottom), use flip.

  • Flip horizontal: Shift + H
  • Flip vertical: Shift + V

You can also flip from the right-click menu3. It’s handy for changing an icon’s direction or building symmetrical parts. Flipping only mirrors the shape — it doesn’t distort it.

🪄 How to skew, distort & add perspective (needs a plugin)

This is where many people get stuck. Dragging the four corners independently to warp a shape, or adding skew and perspective (trapezoid) — the way Illustrator or Photoshop’s free transform works — is not built into Figma. The built-in rotate, scale, and flip can’t slant a shape or add depth.

Figma Draw's Transform section is not a transform tool

Switch to Figma Draw and a Transform section appears in the right sidebar, which sends plenty of people hunting for free transform there. But per the official docs, those transforms are Radial repeat (repeating an object around a central point) and Linear repeat (repeating it evenly in a line) — a non-destructive way to build patterns out of an object4. They don’t skew or add perspective, so don’t let the name keep you searching.

To get free transform, skew, or perspective, you have two routes:

  • Use a transform plugin. The Figma Community has several plugins that let you drag the four corners to warp, or apply perspective and skew. Select the shape, run the plugin, and it replaces the shape with the warped result. Handy when you want to stay inside Figma.
  • Process it outside, then place it. Transform it in Illustrator or Photoshop, export it as an image (PNG / SVG), and place it in Figma. This route gives you the finest control over the result.

Image perspective and text skew work the same way

“Add perspective to an image” or “skew some text” also can’t be done with built-in features alone. For both images and text, process them with a transform plugin or edit them externally and bring them back in. Note that skewing text turns it into a non-editable outline (or an image).

🚀 Move your XD shapes into Figma without breakage — Pixel Fine Converter

Converts the shapes and paths from your XD file into Figma's structure. Try the Free version on your own file to check the fidelity before you decide.

🔌 Choosing a transform plugin

There are several free-transform plugins, each better at certain jobs. A few pointers for choosing:

  • Warping a vector shape: pick one that transforms paths as true geometry (subdividing curves smoothly).
  • Perspective on an image: choose one that warps images at high quality (pixel by pixel).
  • Quick skew or trapezoid: a simple slider-based plugin is easiest to handle.

Watch the editability after transforming

Applying free transform or perspective with a plugin can flatten the original vector to the warped shape or convert it to an image. If you might fine-tune it later, duplicate the original and keep it aside. Either way, what ends up in Figma is the transformed object.

🔄 Shapes migrated from XD or Illustrator

In files migrated from Illustrator or Adobe XD, shape transforms need one extra bit of care.

  • Illustrator’s free transform and perspective don’t carry over as-is: a shape you free-transformed or gave perspective to in Illustrator has to be treated as a flattened path or image on Figma’s side. It can’t carry over as an editable “mid-transform” state.
  • XD shapes and paths are best migrated with their structure intact: simple resizes and rotations reproduce fine, but complex paths and boolean operations hold up better with a migration path that converts the structure itself.

Rebuilding shapes one at a time is tedious, so the safe move is a migration path that converts the shape and path structure itself. How well structure survives varies a lot between tools, so if you’re still choosing one, compare the options in the best Adobe XD to Figma plugins before you commit. Pixel Fine Converter reads XD files directly and converts shapes and paths into Figma’s structure. For the details of XD shape conversion, see converting XD shapes to Figma.

💬 FAQ

Q: Can I free transform (skew) a shape in Figma?

Not with built-in features alone. Free transform (dragging the four corners), skew, and perspective (trapezoid) aren’t in Figma natively, so use a transform plugin or edit it in Illustrator / Photoshop and bring it back as an image. Built-in transforms go as far as resize, scale, rotate, and flip.

Q: I scaled a shape and the stroke width changed too.

A plain resize (the selection tool’s handles) shouldn’t change stroke width, but the Scale tool (K) scales stroke width, effects, and text proportionally. Use the selection tool to keep stroke width, and the Scale tool when you want to scale the whole look.

Q: What’s the shortcut to rotate a shape?

There’s no single-key rotate shortcut. Drag just outside a corner (Shift for 15° increments), or enter a value in the Rotation field of the right panel.

⚠️ Arrow keys do not rotate. In Figma the arrow keys are bound to nudge — they move a layer, 1pt at a time by default and 10pt with Shift held3. Adding modifier keys doesn’t turn that into rotation; we confirmed this hands-on on Windows. For fine angles, use the numeric field in the right panel.

Q: How do I flip (mirror) a shape?

Flip horizontal is Shift + H, and flip vertical is Shift + V. You can also flip from the right-click menu.

Q: I want to add perspective to an image.

That’s not possible with built-in features. Use a transform plugin that supports perspective, or edit the image externally and place it back in Figma.

Q: A shape I free-transformed in Illustrator broke after migrating to Figma.

Illustrator’s free transform and perspective have to be treated as a flattened path or image on Figma’s side. They can’t carry over as an editable transform state, so migrate them in a flattened form or rebuild them in Figma.

🎯 Recap

Transforming shapes in Figma is about knowing what’s built in and filling the rest with a plugin. The four key points:

#GoalFeature
1Change sizeResize (strokes stay) / Scale tool K (strokes scale too)
2RotateHandle / right panel / Shift for 15°
3FlipHorizontal Shift + H / vertical Shift + V
4Free transform, skew, perspectiveNot built-in — transform plugin or external processing

Scale tool for size, handle or a value for rotation, Shift + H / V to flip. Need skew or perspective? A plugin. Keep that line in mind and transforming shapes in Figma stops being a guessing game. And if your file starts in Illustrator or Adobe XD, migrating with the shape and path structure intact is the surest way to avoid rebuilding.

🚀 Install Pixel Fine Converter from the Figma Community

One-click install from Figma Community

Everything in this article about how Figma behaves is sourced to Figma’s official documentation, cited below. Everything about how Pixel Fine Converter converts shapes and paths is first-hand: it comes from our own source code and hands-on testing.

Sources

  1. Scale layers while maintaining proportions — the Scale tool (K) scaling strokes and blurs along with the shape, the multiplier / dimension fields / anchor box in the Scale panel, and the exclusion of locked layers and layers nested in a component instance (checked 2026-08-20) ↩ ↩2 ↩3

  2. Adjust text dimensions and resizing — the Scale tool changing a text layer’s bounds and font size at once, and fractional font sizes / subpixel dimensions leading to export artifacts (checked 2026-08-20) ↩ ↩2

  3. Adjust alignment, rotation, position, and dimensions — the 0° default and the ±180° convention, Shift for 15° increments, moving the rotation origin with Option/Alt + R, effects not rotating, and the flip shortcuts and right-click menu (checked 2026-08-20) ↩ ↩2 ↩3 ↩4 ↩5 ↩6 ↩7

  4. Create patterns with transforms — Figma Draw’s transforms being Radial repeat and Linear repeat, a non-destructive way to build patterns from an object (checked 2026-08-20) ↩