Dark Mode UI Components by uinkits
Preview our design system and elements.
Discover a selection of our UI elements and components available below:
00
Days
00
Hours
00
Min
00
Sec
uinkits App Kit
Hey, wanna learn more?
Subscribe to our cool design newsletter to receive the latest in UI/UX design.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
*By clicking "Subscribe," you agree to our Terms and conditions and Privacy Policy.
June 17, 2024
UI/UX Design
4 MIN

Figma Shortcuts for UI UX Designers in 2024

We have curated a list of all the Figma keyboard shortcuts we can use in Figma design. Check out the Figma shortcuts for Mac and Figma shortcuts for Windows.
By
Cristi Fonea
June 17, 2024
Figma Shortcuts for UI UX Designers in 2024

Figma has become the go-to UI design software for most UI UX designers. Its popularity lies in the powerful features that the platform has and the fact that Figma design allows us to collaborate with everyone – whether it’s our team or through Figma Community. 

So, one of the first tips and tricks when it comes to how to use Figma is learning shortcuts. Thankfully, its intuitive platform allows for many Figma shortcuts that will be useful in our design process. 

We have curated a list of all the Figma keyboard shortcuts we can use in Figma design. Check out the Figma shortcuts for Mac and Figma shortcuts for Windows:

Figma Shortcuts for Mac:

Basic Figma Shortcuts:

  • Shortcuts Panel: ⌃ Control + Shift + ?
  • Show/Hide UI: ⌘ + \
  • Quick Actions: ⌘ + / or ⌘ + P

Tools Shortcuts:

  • Move: press V
  • Frame: press F 
  • Group: press G
  • Rectangle Tool: press R
  • Ellipse Tool: press O
  • Line Tool: press L
  • Arrow Tool: Shift + L 
  • Place Image: Shift + ⌘ + K
  • Pen Tool: press P
  • Pencil Tool: Shift + P
  • Text Tool: press T
  • Pick Color: Control + C
  • Resources: Shift I
  • Add Comment: press C

Zoom Figma Shortcuts:

  • Zoom In: press +
  • Zoom Out: press -
  • Pan: Space drag
  • Zoom to 100%: Shift + 0
  • Zoom to fit: Shift + 1
  • Zoom to fit selection: Shift + 2
  • Zoom to the next frame: N
  • Zoom to the previous frame: Shift + N

Action Properties:

  • Bend Tool:
  • Remove fill: ⌥ Option + /
  • Remove stroke: press /
  • Scale All Selection: K
  • Flatten Selection: ⌘ + E 
  • Join Selection: ⌘ + J
  • Smooth Join Selection: Shift + ⌘ + J 

Selection Figma Shortcuts:

  • Select All: ⌘ + A
  • Select Inverse: Shift + ⌘ + A
  • Exit Selection: press Esc
  • Deep Select: ⌘ + Click
  • Select Layer Menu: ⌘ +Right-Click
  • Group Selection: ⌘ + G
  • Ungroup Selection: Shift + ⌘ + G
  • Frame Selection: ⌥ Option + ⌘ + G
  • Show/Hide Selection: Shift + ⌘ + H
  • Lock/Unlock: Shift + ⌘ + L

Edit Figma Design:

  • Copy: ⌘ + C
  • Cut: ⌘ + X
  • Paste: ⌘ + V
  • Paste Over Selection: Shift + ⌘ + V 
  • Duplicate: ⌘ + D
  • Rename Selection: ⌘ + R
  • Copy Properties: ⌥ Option + ⌘ + C
  • Paste Properties: ⌥ Option + ⌘ + V
  • Copy as PNG: Shift + ⌘ + C
  • Copy Page Link to Clipboard: ⌘ + L

Figma Design Properties:

  • Bring Forward: ⌘ + ]
  • Bring to Front: ⌥ Option + ⌘ + ]
  • Send Backward: ⌘ + [
  • Send to Back: ⌥ Option + ⌘ + [
  • Align Left:  ⌥ Option + A
  • Align Right:  ⌥ Option + D
  • Align Top:  ⌥ Option + W
  • Align Botton:  ⌥ Option + S
  • Align Centers:  ⌥ Option + H or  ⌥ Option + V
  • Distribute Spacing: ⌃ Control + ⌥ Option + H or ⌃ Control + ⌥ Option + V
  • Tidy Up: ⌃ Control + ⌥ Option + T
  • Add Auto Layout: Shift + A
  • Remove Auto Layout: ⌥ Option + Shift + A
  • Crop Image: ⌥ Option + Double Click
  • Use a Mask: ⌃ Control + ⌘ + M
  • Flip Horizontal: Shift + H 
  • Flip Vertical: Shift + V
  • Set Opacity to 10: press 1 
  • Set Opacity to 70: press 7
  • Set Opacity to 100: press 100

Components Figma Keyboard Shortcuts:

  • Create Component: ⌥ Option + ⌘ + K
  • Detach Intense: ⌥ Option + ⌘ + B
  • Swap Component Instance: ⌥ Option
  • Show Assets: ⌥ Option + 2
  • Show Resources Menu: Shift + I
  • Team Library: ⌥ Option + ⌘ + 0

Figma Prototype Shortcuts:

  • Comment: press C
  • Fullscreen: press F
  • Scale View: press Z
  • Restart Prototype: press R

Figma Shortcuts for Windows:

Basic Figma Shortcuts:

  • Shortcuts Panel: CTRL + Shift + ?
  • Show/Hide UI: CTRL + \
  • Quick Actions: CTRL + / or CTRL + P

Tools Shortcuts:

  • Move: press V
  • Frame: press F 
  • Group: press G
  • Rectangle Tool: press R
  • Ellipse Tool: press O
  • Line Tool: press L
  • Arrow Tool: Shift + L 
  • Place Image: Shift + CTRL + K
  • Pen Tool: press P
  • Pencil Tool: Shift + P
  • Text Tool: press T
  • Resources: Shift I
  • Add Comment: press C

Zoom Figma Shortcuts:

  • Zoom In: press +
  • Zoom Out: press -
  • Pan: Space drag
  • Zoom to 100%: Shift + 0
  • Zoom to fit: Shift + 1
  • Zoom to fit selection: Shift + 2
  • Zoom to the next frame: N
  • Zoom to the previous frame: Shift + N

Action Properties:

  • Bend Tool: CTRL
  • Remove fill: Alt + /
  • Remove stroke: press /
  • Scale All Selection: K
  • Flatten Selection: CTRL + E 
  • Join Selection: CTRL + J
  • Smooth Join Selection: Shift + CTRL + J 

Selection Figma Shortcuts:

  • Select All: CTRL + A
  • Select Inverse: Shift + CTRL + A
  • Exit Selection: press Esc
  • Deep Select: CTRL + Click
  • Select Layer Menu: CTRL +Right-Click
  • Group Selection: CTRL + G
  • Ungroup Selection: Shift + CTRL + G
  • Frame Selection: Alt + CTRL + G
  • Show/Hide Selection: Shift + CTRL + H
  • Lock/Unlock: Shift + CTRL + L

Edit Figma Design:

  • Copy: CTRL + C
  • Cut: CTRL + X
  • Paste: CTRL + V
  • Paste Over Selection: Shift + CTRL + V 
  • Duplicate: CTRL + D
  • Rename Selection: CTRL + R
  • Copy Properties: Alt + CTRL + C
  • Paste Properties: Alt + CTRL + V
  • Copy as PNG: Shift + CTRL + C
  • Copy Page Link to Clipboard: CTRL + L

Figma Design Properties:

  • Bring Forward: CTRL + ]
  • Bring to Front: Alt + CTRL + ]
  • Send Backward: CTRL + [
  • Send to Back: Alt + CTRL + [
  • Align Left:  Alt + A
  • Align Right:  Alt + D
  • Align Top:  Alt + W
  • Align Botton:  Alt + S
  • Align Centers:  Alt + H or  Alt + V
  • Distribute Spacing: CTRL + Alt + H or CTRL + Alt + V
  • Tidy Up: CTRL + Alt + T
  • Add Auto Layout: Shift + A
  • Remove Auto Layout: Alt + Shift + A
  • Crop Image: Alt + Double Click
  • Flip Horizontal: Shift + H 
  • Flip Vertical: Shift + V
  • Set Opacity to 10: press 1 
  • Set Opacity to 70: press 7
  • Set Opacity to 100: press 100

Components Figma Keyboard Shortcuts:

  • Create Component: Alt + CTRL + K
  • Detach Intense: Alt + CTRL + B
  • Swap Component Instance: Alt
  • Show Assets: Alt + 2
  • Show Resources Menu: Shift + I
  • Team Library: Alt + CTRL + 0

Figma Prototype Shortcuts:

  • Comment: press C
  • Fullscreen: press F
  • Scale View: press Z
  • Restart Prototype: press R
Discover Uinkits System!

Uinkits – Our Figma Design System and UI Kits

We at uinkits understand the importance of inputs in great user experiences and creating amazing UI designs. That’s why we’ve developed a Figma UI Kit with design components that include these essential UI elements that enable you to design intuitive and user-friendly interfaces effortlessly.  

“You press the button, we do the rest,” – Kodak.

Inspired by this iconic tagline from Kodak, we believe in simplifying the design process for you. Our Figma UI Kit, uinkits, is a complete design system with UI components that allows you, as a UI UX designer, to create your products as quickly as pressing a button.

Our design system includes components, icons, variables, cards, buttons, and everything you need for your design process. All you have to do is take your UI design component needed, and you’re ready to use it in your designs!

By
Cristi Fonea
June 17, 2024

Similar Articles

Discover a handpicked selection of UI/UX articles that offer valuable insights, best practices, and the latest trends in digital design.

Subscribe to our
uinkits Newsletter

Subscribe
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Stay in the loop with all our latest updates, articles, free design goodies, and other cool stuff. Don't worry, we won't flood your inbox with spam!
Photo cover for blog newsletter by Uinkits System

Start Designing Amazing Projects
Get Your Uinkits System!

At uinkits, we're all about the awesome possibilities of design. Join us now and let's shape the future together!