Основные горячие клавиши в фигма на русском языке на Windows и Mac
Горячие клавиши в Figma, или Keyboard Shortcuts, — это мощное оружие для ускорения работы. В этой статье расскажем, где посмотреть список горячих клавиш в Figma и какое действие скрывается за каждой комбинацией.
Больше полезных заметок о Figma и дизайне в целом в нашем Telegram-канале и группе ВК.
Оглавление:
Где смотреть список горячих клавиш в Figma
В Figma есть удобное окно со списком всех доступных горячих клавиш. Открыть его можно несколькими способами (о них ниже).
Способ 1: с помощью иконки вопроса
Нажмите на иконку вопроса в правом нижнем углу интерфейса и выберите «Keyboard Shortcuts».
Способ 2: через меню
Откройте меню и выберете «Help and Account» → «Keyboard Shortcuts».
Способ 3: с помощью горячих клавиш
Нажмите Ctrl + Shift + ? (Windows) или Cmd + Shift + ? (Mac), после появится окно со списком горячих клавиш.
Единственный нюанс всплывающего окна в фигма — все пояснения представлены на английском. Если вы пока не освоили иностранный, разобраться в комбинациях поможет эта статья.
Важно! По умолчанию Figma использует горячие клавиши, настроенные под раскладку клавиатуры US QWERTY. Если у вас другая раскладка, некоторые клавиши могут располагаться в других местах или вообще отсутствовать. Чтобы получить доступ к сочетаниям клавиш, работающих на вашем устройстве, обновите раскладку клавиатуры в настройках программы. Подробнее о том, какие раскладки поддерживает Figma и как выбрать нужную.
Также обращаем внимание, что мы разбираем только те горячие клавиши, которые Figma отображает в всплывающем окне. И они могут частично не совпадать с горячими клавишами на вашем устройстве.
Tools — инструменты
Горячие клавиши в разделе Tools позволяют быстро переключаться между основными инструментами в Figma.
Если вы хотите использовать инструмент:
- Перемещения (Move tool), нажмите V. После можете двигать выделенный объект стрелками на клавиатуре или с помощью мыши. Обратите внимание: когда вы открываете Figma, этот инструмент выбран по умолчанию.
- Фрейм (Frame tool), нажмите F. Фрейм — это рабочая область, в которой размещают элементы дизайна.
- Перо (Pen tool), нажмите P. Позволяет рисовать новые векторные элементы или редактировать уже существующие.
- Карандаш (Pencil tool), нажмите Shift + P. Позволяет рисовать произвольные линии. Его часто используют, чтобы обвести что-то на скриншоте или рабочей области.
- Текст (Text tool), нажмите T. Позволяет работать с текстом: создавать или редактировать.
- Прямоугольник (Rectangle tool), нажмите R. Позволяет создать прямоугольник или квадрат.
Чтобы быстро сделать квадрат, выберите инструмент «Прямоугольник» и с зажатой клавишей Shift протянете курсором по экрану. - Эллипс (Ellipse tool), нажмите О. Позволяет создать эллипс или круг.
Чтобы быстро сделать круг, выберите инструмент «Эллипс» и с зажатой клавишей Shift протянете курсором по экрану. - Линия (Line tool), нажмите L. Позволяет создать линию.
- Стрелка (Arrow tool), нажмите Shift + L. Позволяет создать векторную стрелку. Полезно, если нужно показать что-то на скриншоте.
- Комментарии (View comments), нажмите C. Позволяет оставить новые или посмотреть существующие комментарии.
- Пипетка (Pick color), нажмите I. Нужна для быстрого выбора и копирования цвета из любого объекта на макете.
- Нож (Slice tool), нажмите S. Позволяет создавать срез дизайн-макета для последующего экспорта.
View — просмотр
Горячие клавиши в разделе View помогают настроить рабочее пространство.
Если вы хотите:
- Показать или скрыть боковые панели (Show/Hide UI), нажмите Ctrl/Cmd + \. Скрывает боковые панели интерфейса программы и слева, и справа. Удобно, если нужно посмотреть дизайн-проект без лишнего шума.
- Показать или скрыть курсоры других пользователей (Multiplayer cursors), нажмите Ctrl/Cmd + Alt + \. Актуально, если вы работаете в макете не один. Курсоры других пользователей можно отключить, если нужно сосредоточиться на своей задаче.
- Включить или отключить режим разработки (Open Dev Mode), нажмите Shift + D. Dev Mode позволяет разработчикам быстро переводить макет в код. Режим доступен только в платном тарифе программы.
- Показать или скрыть линейки (Rulers), нажмите Shift + R. Панель линеек отображается вдоль верхней и левой границ холста. Для создания направляющей перетащите линию с линейки на холст.
- Показать или скрыть контуры всех объектов на странице (Show outlines), нажмите Ctrl/Cmd + Shift + O. На Windows также может помочь сочетание Ctrl + Shift + 3. Позволяет отображать контуры всех объектов на холсте, включая скрытые слои и границы.
- Включить или выключить пиксельный режим просмотра (Pixel Preview), нажмите Ctrl + Shift + P на Windows или ⌃ + P на Mac. Помогает понять, как будет выглядеть ваша работа в растровом формате (JPG, PNG).
- Показать или скрыть сетки макета (Layout grids), нажмите Shift/⌃ + G. Отображает или скрывает сетки макета, если вы ранее настраивали их.
- Показать или скрыть пиксельную сетку (Pixel grid), нажмите Shift/Cmd + '. Сетка видна, если сильно увеличить макет.
- Показать панель Layers (Open layers panel), нажмите Alt + 1. Эта комбинация открывает панель слоев в левой части интерфейса. Если вы до этого переключились на другую панель, например, на Assets, сочетание клавиш вернёт вас к слоям.
- Показать панель Assets (Show assets), нажмите Alt + 2. Эта комбинация открывает панель Assets в левой части интерфейса. Если вы до этого переключились на другую панель, например, на File, сочетание клавиш вернёт вас к Assets.
- Показать или скрыть командную библиотеку (Team library), нажмите Alt + 3. Программа открывает её в виде модального окна.
- Показать дизайн-панель (Open design panel), нажмите Alt + 8. Эта комбинация открывает панель дизайн-панель в правой части интерфейса. Если вы до этого переключились на другую панель, например, на Prototype, сочетание клавиш вернёт вас к дизайн-панели.
- Показать прототип-панель (Open prototype panel), нажмите Alt + 9. Открывает дизайн-панель в правой части интерфейса, если вы ранее переключились с неё на другую панель.
Zoom — масштабирование
Горячие клавиши в разделе Zoom позволяют управлять масштабом рабочего пространства в Figma.
Если вы хотите:
Переместить рабочее пространство (Pan), зажмите Space (пробел) и перемещайте мышью рабочее пространство (drag).
Приблизить рабочую область (Zoom in), нажмите Ctrl/Cmd + (или просто +). Обычно приближает рабочую область примерно в 2 раза.
Отдалить рабочую область (Zoom out), нажмите Ctrl/Cmd - (или просто -). Обычно уменьшает рабочую область примерно в 2 раза.
Масштаб 100% (Zoom to 100%), нажмите Ctrl/Shift + 0. Показывает макет 1:1 к экрану.
Поставить в видимую рабочую область все объекты на холсте (Zoom to fit), нажмите Shift + 1. Это удобно для быстрого обзора всей рабочей области без необходимости прокручивать.
Поставить в рабочую область выделенный слой на максимальном масштабе (Zoom to selection), нажмите Shift + 2. Это позволяет быстрее работать с конкретными элементами, без необходимости прокручивать или вручную менять масштаб.
Поставить в рабочую область следующий фрейм (Zoom to next frame), нажмите N
Поставить в рабочую область предыдущий фрейм (Zoom to previous frame), нажмите Shift + N
Перейти к предыдущей странице вашего проекта (Previous page), нажмите Page Up
Перейти к следующей странице вашего проекта (Next page), нажмите Page Down
Перейти к предыдущему фрейму на холсте (Find previous frame), нажмите Home
Перейти к следующему фрейму на холсте (Find next frame), нажмите End
Text — текст
Горячие клавиши в разделе Text помогают настраивать стили, выравнивание и другие параметры текста.
Внимание! Горячие клавиши сработают, если вы выделите текстовый блок или фрагмент текста, к которому хотите применить стили.
Если вы хотите:
- Выделить текст жирным или курсивом (Bold/Italic), нажмите Ctrl/Cmd + B или I
- Подчеркнуть текст (Underline), нажмите Ctrl/Cmd + U
- Создать ссылку (Create link), нажмите Ctrl + Shift + U или Ctrl + K на Windows и Cmd + K на Mac
- Перечеркнуть текст (Strikethrough), нажмите Ctrl/Cmd + Shift + X
- Оформить текст в виде списка (Turn into a list), нажмите Ctrl/Cmd + Shift + 7 или 8
Для выравнивания текста:
- По левому краю (Text align left) — Ctrl/Cmd + Alt + L
- По центру (Text align center) — Ctrl/Cmd + Alt + T
- По правому краю (Text align right) — Ctrl/Cmd + Alt + R
- По ширине (Text align justified) — Ctrl/Cmd + Alt + J
Для изменения:
- Размера шрифта (Adjust font size) — Ctrl/Cmd + Shift + < и >
- Веса шрифта (Adjust font weight) — Ctrl/Cmd + Alt + < и >
- Расстояния между буквами (Adjust letter spacing) — Alt + < и >
- Расстояния между строками (Adjust line height) — Shift + Alt + < и >
Shape — форма
Горячие клавиши в разделе Shape помогают эффективно работать с формами.
Если вы хотите использовать инструмент:
- Перо (Pen), нажмите P. Позволяет рисовать новые векторные фигуры или редактировать уже существующие.
- Карандаш (Pencil), нажмите Shift + P. Позволяет рисовать произвольные линии. Его часто используют, чтобы обвести что-то на скриншоте или рабочей области.
- Заливка замкнутых контуров (Paint bucket), нажмите B. Работает только в режиме редактирования вектора.
Для работы с заливкой и обводкой:
- Удалить заливку (Remove fill), нажмите Alt + /
- Удалить обводку (Remove stroke), нажмите Shift + / или просто /
- Поменять местами обводку и заливку (Swap fill and stroke), нажмите Shift + X
Если вы хотите:
- Преобразовать в кривые (Outline stroke), нажмите Ctrl/Cmd + Alt + O
- Объединить несколько объектов в единое целое (Flatten selection), нажмите Cmd/Ctrl + E. Чтобы комбинация сработала, выберите 2 или более векторных элемента.
- Соединить точки (Join selection), нажмите Ctrl/Cmd + J
- Удалить опорную точку, не разрывая контура (Delete and heal selection), нажмите Shift + ⌫
Selection — выделение
Вкладка Selection позволяет быстро управлять выбором объектов на холсте.
Если вы хотите:
Выбрать все (Select all), нажмите Ctrl/Cmd + A
Выделить все, кроме выбранного (инверсия) (Select inverse), нажмите Ctrl/Cmd + Shift + A. Тогда то, что было выделено, потеряет выделение, а то, что не было выделено, выделится.
Снять выделение (Select none), нажмите Esc
Сделать сквозной выбор (Deep select), нажмите Ctrl/Cmd и кликните по нужному элементу. Это позволит выделить объект внутри группы или компонента, даже если он скрыт другими слоями.
Выбрать дочерний элемент (Select children), нажмите Enter. Это позволяет выбрать все дочерние элементы внутри группы или компонента.
Выбрать родительский элемент (Select parent), нажмите / или Shift + Enter
Выбрать следующий элемент в панели слоев (Select next sibling), нажмите Tab
Выбрать предыдущий элемент в панели слоев (Select next sibling), нажмите Shift + Tab
Выбрать все совпадающие слои (Select matching layers), нажмите Ctrl/Cmd + Alt + A
Сгруппировать элементы (Group selection), нажмите Ctrl/Cmd + Alt + G
Разгруппировать элементы (Ungroup selection), нажмите Ctrl + ⌫ на Windows и Cmd + Shift + G на Mac
Сгруппировать во фрейм (Frame selection), нажмите Ctrl/Cmd + Alt + G
Показать/скрыть выбранные элементы (Show/Hide selection), нажмите Ctrl/Cmd + Shift + Н
Заблокировать/разблокировать элементы (Lock/Unlock selection), нажмите Ctrl/Cmd + Shift + L
Edit — редактирование
Горячие клавиши в разделе Edit позволяют быстро выполнять действия с элементами в Figma: копировать, вставлять, переименовывать и экспортировать.
Если вы хотите:
- Копировать (Copy), нажмите Ctrl/Cmd + C
- Вырезать (Cut), нажмите Ctrl/Cmd + X
- Вставить (Paste), нажмите Ctrl/Cmd + V
- Вставить с заменой (Paste to replace), нажмите Ctrl/Cmd + Shift + R. Позволяет вставить скопированный объект на место выбранного, заменяя его.
- Вставить поверх выделенного элемента (Paste over selection), нажмите Ctrl/Cmd + Shift + V. Вставляет скопированный объект точно поверх выбранного элемента. Это полезно, если нужно наложить новый объект на существующий, сохраняя его позицию в макете.
- Дублировать элемент (Duplicate), нажмите Ctrl/Cmd + D
- Переименовать (Rename selection), нажмите Ctrl/Cmd + R. Позволяет переименовать сразу несколько выбранных объектов.
- Экспортировать элемент (Export), нажмите Ctrl/Cmd + Shift + E
- Найти элемент (Find), нажмите Ctrl/Cmd + F. Вызывает окно поиска в левой части интерфейса. Вам необходимо ввести в него название слоя, текста или фрагмент содержимого, который хотите найти.
Для копирования и вставки свойств:
- Скопировать элемент в формате PNG в буфер обмена (Copy as PNG), нажмите Ctrl/Cmd + Shift + C
- Скопировать свойства выделенного элемента (Copy properties), нажмите Ctrl/Cmd + Alt + C
- Вставить скопированные ранее свойства элемента (Paste properties), нажмите Ctrl/Cmd + Alt + V
Transform — трансформирование
Горячие клавиши в разделе Transform позволяют быстро изменять положение, ориентацию и прозрачность элементов в Figma.
Если вы хотите:
- Отразить элемент по горизонтали (Flip horizontal), нажмите Shift + H
- Отразить элемент по вертикали (Flip vertical), нажмите Shift + V
- Создать маску (Use as mask), нажмите Ctrl/Cmd + Alt + M
- Включить редактирование векторных объектов или изображений (Edit shape or image), нажмите Enter
- Вставить изображение (Place image…), нажмите Ctrl/Cmd + Shift + K
Для работы с прозрачностью:
- Задать прозрачность элементу 0% (Set opacity to 0%), нажмите 0 0
- Задать прозрачность элементу 10% (Set opacity to 10%), нажмите 1
- Задать прозрачность элементу 50% (Set opacity to 50%), нажмите 5
- Задать прозрачность элементу 100% (Set opacity to 100%), нажмите 0
Arrange — выравнивание
Горячие клавиши в разделе Arrange помогают быстро изменять порядок слоев, выравнивать объекты и распределять элементы на странице.
Если вы хотите переместить выбранный объект:
- На один уровень выше в слоях (Bring forward), нажмите Ctrl/Cmd + ]
- На один уровень ниже в слоях (Send backward), нажмите Ctrl/Cmd + [
- На самый верхний уровень внутри группы или фрейма (Bring to front), нажмите ] на Windows или Cmd + Alt + ] на Mac
- На самый нижний уровень внутри группы или фрейма (Send to back), нажмите [ на Windows или Cmd + Alt + [ на Mac
Для выравнивания объектов:
- Выровнять объекты по левому/правому краю (Align left/right), нажмите Alt + A и D. Выравнивает выбранные элементы по левому или правому краю относительно друг друга. Чтобы использовать, выберите несколько объектов и нажмите комбинацию клавиш.
- Выровнять объекты по верху/низу (Align top/bottom), нажмите Alt + W и S. Выравнивает выбранные элементы по верхнему или нижнему краю относительно друг друга. Чтобы использовать, выберите несколько объектов и нажмите комбинацию клавиш.
- Выровнять по центру (Align center), нажмите Alt + H и V. Выравнивает выбранные элементы по центру относительно друг друга или по отношению к холсту. Чтобы использовать, выберите несколько объектов и нажмите комбинацию клавиш.
Для распределения объектов и выравнивания:
- Распределить расстояние между элементами по горизонтали и вертикали (Distribute spacing), нажмите Alt + Shift/⌃ + H и V. Равномерно распределяет пространство между выбранными объектами. Для использования выберите несколько объектов и нажмите комбинацию клавиш.
- Умное выравнивание (Tidy up), нажмите Ctrl/Cmd + Alt + Shift + T на на Windows или ⌃ + Alt + T на Mac. Программа автоматически ищет закономерность между отступами выделенных элементов и приводит к стандарту те, которые отличаются. Для использования выберите несколько объектов и нажмите комбинацию клавиш.
Для работы с автолэйаутом:
- Добавить автолэйаут (Add auto layout), нажмите Shift + A
- Удалить автолэйаут (Remove auto layout), нажмите Alt + Shift + A
- Автоматический автолэйаут (Suggest auto layout), нажмите Ctrl + Alt + Shift + A на Windows и Cmd + Shift + A на Mac
Components — компоненты
Горячие клавиши в разделе Components помогают быстро работать с компонентами.
Если вы хотите:
- Показать панель Assets (Show assets), нажмите Alt + 2. Эта комбинация открывает панель Assets в левой части интерфейса. Если вы до этого переключились на другую панель, например, на File, сочетание клавиш вернёт вас к Assets.
- Показать или скрыть командную библиотеку (Team library), нажмите Alt + 3. Программа открывает её в виде модального окна.
- Создать компонент (Create component), нажмите Ctrl/Cmd + Alt + K
- Отменить привязку компонента (Detach instance), нажмите Ctrl/Cmd + Alt + B. Позволяет отсоединить компонент от инстанции. После этого он становится обычным редактируемым элементом, и любые изменения в инстанции не будут применяться к этому элементу.
- Поиск компонента (Component search), нажмите Shift + I Позволяет быстро находить компоненты в вашем проекте или библиотеке.
- Поменять местами экземпляры компонентов (Swap component instance), нажмите Alt