Flipping Horizontally in Figma: A Practical Guide

Flipping an image horizontally in Figma is a simple operation that can be done quickly on desktop de and is non-destructive, preserving image quality. This guide synthesizes the most relevant instructions from the provided material to help you master horizontal flip, vertical flip, and related capabilities across images and layers.

How to flip an image horizontally in Figma

Select the image, click the Flip Horizontal icon in the toolbar, or press Shift + H.

How to flip an image vertically in Figma

Select the image, click the Flip Vertical icon in the toolbar, or press Shift + V.

Flipping multiple images at once

Yes, select all images together and use the flip tool or shortcut.

Impact on image quality

Flipping an image in Figma is non-destructive and retains quality.

Flipping on mobile

No, flipping tools are only available in the desktop or web version of Figma.

Related tools and tips for broader editing

In addition to flipping, the article discusses rotating, snapping, alignment, distribution, and exact positioning of layers. You can adjust alignment by selecting one object or a group to align to the parent, or use Shift with alignment controls to align multiple objects. Snap to geometry is used in vector edit mode, while Snap to pixel grid helps prevent misaligned pixel errors when exporting elements. These settings can be toggled in Preferences. Furthermore, you can nudge positions with arrow keys, resize layers by dragging bounds, and maintain or temporarily disable aspect ratios with the Lock aspect ratio option. When rotating or flipping, the default rotation and flip reference points are the layer’s center, and Figma uses CSS transform properties for these transformations. You can also animate rotations between frames in prototypes and manage layer order through Z-axis positioning.

Practical notes for advanced editing

The document outlines that every shape, text, or image has its own layer, and you can adjust width, height, and rotation. For exact transformations, you can use equations in the X and Y coordinates or scrub values for precise control. Fixed layers and auto-layout constraints influence how layers respond during resizing. The rotate and flip transformations are implemented via matrix and CSS transform properties, respectively, and flips mirror across the chosen axis. When using tidy up and distribute, Figma shows spacing values to help maintain even layouts, with behavior differing between one-dimensional versus two-dimensional selections.

  1. To flip horizontally: select image(s) → Flip Horizontal or Shift + H.
  2. To flip vertically: select image → Flip Vertical or Shift + V.
  3. To flip multiple images at once: select all → use flip tool or shortcut.
  4. To ensure quality: flipping is non-destructive, original image quality is preserved.
  5. To use on mobile: flipping tools are not available in mobile; use desktop/web.

Note: The article also covers how to zoom, align, and distribute elements, as well as how to manage snapping and grid behaviors during editing, though these are not strictly required for flipping a single image.

Horizontal flip illustration in UI

How to Flip an Image in Figma

tags: #figma #flip #horizontally