View Settings

You can customize your Editor preferences in the View Settings menu. You can find this by clicking the Zoom dropdown in the top-right corner of the Editor:

From here you can toggle your Global settings like viewing Layout or Pixel Grids and Multiplayer Cursors. You can also find your Zoom Settings here.

Each setting in this list can be toggled off or on. If there is a check next to the setting then it is currently enabled. If there isn't a check, then it is currently disabled.

You can then click on the setting from the menu to enable it.

In this article, we'll cover the following settings in more detail:

  1. Zoom Settings
  2. Pixel Preview
  3. Pixel Grid
  4. Layout Grids
  5. Multiplayer Cursors

Zoom Settings

When you first open a File, the default Zoom level will be set to Zoom to Fit.

You may want to update this to a specific percentage, or use the controls to Zoom In or Zoom Out on the canvas. Any changes you make to the Zoom settings will only apply to the current File.

You have a number of Zoom settings available:

  1. You can use the field provided to enter a specific Zoom percentage.
  2. Use the Zoom In and Zoom Out options to adjust the Zoom level at pre-determined increments.

    Or, you can also use the Keyboard Shortcuts: Zoom In [+] Zoom Out [-]
  3. You can use the Zoom to Fit option [Shift + 1] to fit the entire working area of the canvas in screen.

    Tip! You can also Zoom to Selection by using the Keyboard Shortcut [Shift + 2]

  4. You can also Zoom to a specific percentage. This will display the canvas at the percentage of the virtual/actual pixel size.
    1. Zoom to 50%
    2. Zoom to 100%
    3. Zoom to 200%

Tip! If you are opening a Figma URL that links to a specific node, the canvas will be zoomed to fit that specific node.

You can also use your Trackpad or Mouse to Zoom in and out on the canvas:

Trackpad

Mouse

MacOS + Windows:
  • Pinch two fingers together to Zoom out
  • Stretch two fingers apart to Zoom in
  • Windows: Scroll the mouse wheel up (Zoom In) or down (Zoom Out).
  • Apple Magic Mouse: Double-tap with one finger to zoom in and back out of a webpage or PDF.


Pixel Preview

By default, vectors in Figma are rendered as resolution-independent. This means that there aren't fixed resolutions for the paths you create in the canvas.

To support pixel-precise editing, you can enable Pixel Preview. This allows you to preview vector objects in their rasterized format.

You can view Pixel Preview in either 1x or 2x mode. This allows you to preview how objects will appear on both low and high resolution displays.

  1. Open the View Settings menu.
  2. Click on the Pixel Preview option to enable it: 
  3. A tick will appear next to the setting in the menu. You will also receive a notification in the canvas: 
  4. You will now be able to adjust the Pixel Preview section in the Properties Panel. Click on a blank space in the canvas to deselect any objects.
  5. Use the dropdown to toggle between 1x and 2x:
  6. Head back to the View Settings menu and click Pixel Preview again to disable.

Tip! You can also use the Keyboard Shortcut to toggle Pixel Preview off and on:

  • MacOS: [Control] + [P]
  • Windows: [Control] + [Alt] + [P]

Pixel Grid

For greater accuracy when placing and aligning objects, you can enable the Pixel Grid

Each square in the Pixel Grid represents a single pixel, when exported at 1x resolution.

  1. Click on the View Settings menu:
  2. If there is no check next to it, you can select Pixel Grid to toggle this on:
  3. If there is already a check next to Pixel Grid, you can click it again to toggle it off.
  4. You can also use the Keyboard Shortcuts to toggle the Pixel Grid off and on:
    1. MacOS: [⌘] + [']
    2. Windows: [Ctrl] + [']

Snap to Pixel Grid

The Pixel Grid itself will only be visible at zoom levels of 400% or higher. If you want to use the Pixel Grid while zoomed out, the Snap to Pixel Grid setting is a great tool.

When you enable this functionality we will align objects to the underlying grid when placing or moving them. This can help to prevent mis-aligned pixel errors when exporting elements.

  1. Click on the View Settings menu.
  2. Select Snap to Pixel Grid to toggle this on.
  3. If there is already a check next to Snap to Pixel Grid, click it again to toggle it off.
  4. You can also use the Keyboard Shortcuts to toggle the Pixel Grid off and on:
    1. MacOS: [⌘] + [']
    2. Windows: [Ctrl] + [Shift] + [']

Note: It's still possible to place Objects on sub-pixel values when using the Scale tool.

Limitations of the Pixel Grid

Both your browser and your hardware determine what 1 pixel corresponds to on your display.

As you can use Figma on most operating systems and browsers - with a multitude of hardware options - "1 pixel" is not always the same as the next.

For this reason, any pixels in Figma are really "virtual pixels".

If you're wanting to work in a more resolution-independent manner, we recommend using Layout Grids to control placement and alignment of objects. Learn more about creating and using Layout Grids in our Layout Grids article.

Layout Grids

You can toggle the visibility of all Layout Grids in your Files, from the View Settings menu.

This is great if you'd like to preview how a design will look, without having to remove or hide Layout Grids for individual objects.

  1. Click on the View Settings menu:
  2. If there is no check next to the Layout Grids option, click to display them:
  3. If there is a check already showing, clicking Layout Grids will hide them:
  4. You can also use the Keyboard Shortcut [Shift] + [G] to toggle Layout Grids.

Learn more about creating and using Layout Grids in our Layout Grids article.

Multiplayer Cursors

If you're collaborating with other Team members in a File, you will be able to see their actions via the Multiplayer cursors.

Your Team member's name and cursor will be shown next to their location on the canvas.

If you don't want to be distracted by other Team member's actions, you can hide their cursors from your view.

  1. Click on the View Settings menu.
  2. If there is no check next to the Multiplayer Cursors option, click to display them.
  3. If there is a check already showing, click Multiplayer Cursors again to hide.
  4. You can also use the Keyboard Shortcut [Option] + [Command] + [\] to toggle Multiplayer Cursors.
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.