Keyboard navigation

Shortcuts

You can always find the list of keyboard shortcuts by pressing <kbd>?</kbd> in the Studio.

Playback

<table> <tr> <td> <kbd> <svg viewBox="0 0 448 512" style={{ width: 10, display: "inline" }}> <path fill="currentColor" d="M48.048 304h73.798v128c0 26.51 21.49 48 48 48h108.308c26.51 0 48-21.49 48-48V304h73.789c42.638 0 64.151-51.731 33.941-81.941l-175.943-176c-18.745-18.745-49.137-18.746-67.882 0l-175.952 176C-16.042 252.208 5.325 304 48.048 304zM224 80l176 176H278.154v176H169.846V256H48L224 80z" ></path> </svg> </kbd> <div style={{ width: 2, display: "inline-block" }} /> <kbd> <svg viewBox="0 0 448 512" style={{ width: 10, display: "inline" }}> <path fill="currentColor" d="M257.5 445.1l-22.2 22.2c-9.4 9.4-24.6 9.4-33.9 0L7 273c-9.4-9.4-9.4-24.6 0-33.9L201.4 44.7c9.4-9.4 24.6-9.4 33.9 0l22.2 22.2c9.5 9.5 9.3 25-.4 34.3L136.6 216H424c13.3 0 24 10.7 24 24v32c0 13.3-10.7 24-24 24H136.6l120.5 114.8c9.8 9.3 10 24.8.4 34.3z" ></path> </svg> </kbd>{" "} </td> <td> Move 1 second back{" "} </td> </tr> <tr> <td> <kbd> <svg viewBox="0 0 448 512" style={{ width: 10, display: "inline" }}> <path fill="currentColor" d="M257.5 445.1l-22.2 22.2c-9.4 9.4-24.6 9.4-33.9 0L7 273c-9.4-9.4-9.4-24.6 0-33.9L201.4 44.7c9.4-9.4 24.6-9.4 33.9 0l22.2 22.2c9.5 9.5 9.3 25-.4 34.3L136.6 216H424c13.3 0 24 10.7 24 24v32c0 13.3-10.7 24-24 24H136.6l120.5 114.8c9.8 9.3 10 24.8.4 34.3z" ></path> </svg> </kbd>{" "} </td> <td> Move 1 frame back </td> </tr> <tr> <td> <kbd>Space</kbd> </td> <td>Play / Pause</td> </tr> <tr> <td> <kbd> <svg viewBox="0 0 448 512" style={{ width: 10, display: "inline" }}> <path fill="currentColor" d="M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z" ></path> </svg> </kbd>{" "} </td> <td> Move 1 frame forward </td> </tr> <tr> <td> <kbd> <svg viewBox="0 0 448 512" style={{ width: 10, display: "inline" }}> <path fill="currentColor" d="M48.048 304h73.798v128c0 26.51 21.49 48 48 48h108.308c26.51 0 48-21.49 48-48V304h73.789c42.638 0 64.151-51.731 33.941-81.941l-175.943-176c-18.745-18.745-49.137-18.746-67.882 0l-175.952 176C-16.042 252.208 5.325 304 48.048 304zM224 80l176 176H278.154v176H169.846V256H48L224 80z" ></path> </svg> </kbd> <div style={{ width: 2, display: "inline-block" }} /> <kbd> <svg viewBox="0 0 448 512" style={{ width: 10, display: "inline" }}> <path fill="currentColor" d="M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z" ></path> </svg> </kbd> </td> <td> Move 1 second forward </td> </tr> <tr> <td> <kbd>A</kbd> </td> <td> Jump to beginning </td> </tr> <tr> <td> <kbd>E</kbd> </td> <td> Jump to end </td> </tr> <tr> <td> <kbd>J</kbd> </td> <td> Play in reverse </td> </tr> <tr> <td> <kbd>K</kbd> </td> <td> Pause </td> </tr> <tr> <td> <kbd>L</kbd> </td> <td> Play (press repeatedly to increase speed) </td> </tr> <tr> <td> <kbd>G</kbd> </td> <td> Jump to frame </td> </tr> <tr> <td> <kbd>Enter</kbd> </td> <td> Pause and return to where playback started </td> </tr> </table>

Sidebars

<table> <tr> <td> <kbd>⌘/Ctrl</kbd> <div style={{width: 2, display: 'inline-block'}} /> <kbd>B</kbd> </td> <td>Toggle left sidebar</td> </tr> <tr> <td> <kbd>⌘/Ctrl</kbd> <div style={{width: 2, display: 'inline-block'}} /> <kbd>J</kbd> </td> <td>Toggle right sidebar</td> </tr> <tr> <td> <kbd>⌘/Ctrl</kbd> <div style={{width: 2, display: 'inline-block'}} /> <kbd>G</kbd> </td> <td>Toggle both sidebars</td> </tr> </table>

View

<table> <tr> <td> <kbd>F</kbd> </td> <td>Enter fullscreen</td> </tr> <tr> <td> <kbd>Esc</kbd> </td> <td>Exit fullscreen</td> </tr> </table>

Playback range

<table> <tr> <td> <kbd>I</kbd> </td> <td>Set In Point - video will only play from this point</td> </tr> <tr> <td> <kbd>O</kbd> </td> <td>Set Out Point - video will only play until this point</td> </tr> <tr> <td> <kbd>X</kbd> </td> <td>Clear both In and Out points</td> </tr> </table>

Zoom

<table> <tr> <td> <kbd>+</kbd> </td> <td>Zoom in</td> </tr> <tr> <td> <kbd>-</kbd> </td> <td>Zoom out</td> </tr> <tr> <td> <kbd>0</kbd> </td> <td>Reset zoom</td> </tr> </table>

Props editor

<table> <tr> <td> <kbd>⌘/Ctrl</kbd> <div style={{width: 2, display: 'inline-block'}} /> <kbd>Z</kbd> </td> <td>Undo</td> </tr> <tr> <td> <kbd>⌘/Ctrl</kbd> <div style={{width: 2, display: 'inline-block'}} /> <kbd>Y</kbd> </td> <td>Redo</td> </tr> </table> <table> <tr> <td> <kbd>PageUp</kbd> </td> <td>Previous composition</td> </tr> <tr> <td> <kbd>PageDown</kbd> </td> <td>Next composition</td> </tr> <tr> <td> <kbd>R</kbd> </td> <td>Render composition</td> </tr> <tr> <td> <kbd>T</kbd> </td> <td>Toggle checkerboard background</td> </tr> </table>

AI

The menus are keyboard-navigation friendly. Press <kbd>Tab</kbd> to navigate between the menus and <kbd>Enter</kbd> to select an item.

Quick Switcher

Press <kbd>⌘/Ctrl</kbd> + <kbd>K</kbd> to open the Quick Switcher. You can use it to quickly navigate to any file in your project.

Disable keyboard shortcuts

Start the Studio with --disable-keyboard-shortcuts to disable all keyboard shortcuts. Useful if you are embedding it into an iframe.