Главная
»
Блог
»
Неразрывные пробелы в Figma: зачем они нужны и как с ними работать

Использование неразрывных пробелов в Figma: зачем они нужны дизайнеру и как их применять правильно

Неразрывный пробел (non-breaking space, NBSP) — маленький типографический инструмент, который сильно влияет на читаемость интерфейсов. В Figma он особенно важен, потому что макеты часто служат точным источником для разработчиков. В этой статье рассказываю, зачем нужен NBSP, как его ставить и какими плагинами можно автоматизировать процесс.

Зачем нужны неразрывные пробелы

Неразрывный пробел — это специальный символ, который визуально выглядит как обычный пробел, но не позволяет переносить строку в этом месте.
Проще говоря:

  • обычный пробел — разрешает перенос строки;
  • неразрывный пробел — запрещает перенос.

Примеры, когда неразрывные пробелы необходимы

Использование NBSP обязательно в местах, где разрыв строки искажает смысл или портит внешний вид текста:

  • Числа + единицы измерения: 12 кг, 150 м, 30%
  • Числа + слова: 5 минут, 3 шага
  • Даты: 14 июня 2025
  • Инициалы: И. И. Иванов
  • Короткие предлоги и союзы: «в доме», «и всё»
  • Валюта: 1500 ₽, 20 $

Как поставить неразрывный пробел в Figma вручную

Mac:
Option + Space

Windows:
Alt + 0160 (цифровая клавиатура)
Для способа на windows часто указывают вариант ctrl+shift+space, но у меня он не работает

Через системную таблицу символов
macOS: Control + Command + Space → поиск «non-breaking space».
Windows: «Таблица символов» → расширенная раскладка → «Неразрывный пробел».
Этот метод самый надёжный, если комбинации не работают.

Лайфхак:
скопируйте пробел между скобками: ( ) — и вставляйте по необходимости.

Как поставить неразрывный пробел с помощью плагинов

Если текстов много, ручная расстановка NBSP превращается в мучение. Поэтому лучше использовать плагины.

1. SBOL Typograph — лучший выбор для работы с NBSP
SBOL Typograph автоматически:
  • расставляет неразрывные пробелы по правилам русской типографики,
  • исправляет висячие предлоги,
  • нормализует кавычки,
  • заменяет дефисы на типографские тире,
  • очищает текст от двойных пробелов.
Плагин работает быстро, аккуратно и особенно хорошо подходит для интерфейсных текстов, где важно соблюсти норму без искажения смысла.

2. Другие плагины. Хотя SBOL Typograph — самый полный, можно использовать альтернативы:

  • Typograf for Figma — простой аналог, справляется с неразрывными пробелами и кавычками.
  • Figma Russian Typography — небольшой набор типографических автоправок, полезный для коротких текстов.
  • Content Buddy — помогает с текстами в целом, но NBSP ставит далеко не всегда.
Пример работы плагина SBOL Typograph

В каких случаях потребуется ручная расстановка неразрывных пробелов после использования плагина

Даже лучший плагин не может предугадать намерения дизайнера, поэтому иногда требуется проверка и ручная корректировка. Вот наиболее частые ситуации:


  1. Сложные технические обозначения. Например:«10−12 кВт/ч», «3D-модель 5×5 м» Плагин может пропустить такой формат или расставить NBSP не везде.
  2. Маркетинговые тексты с нетривиальной структурой.Слоганы, необычные разрывы строк, стилистические особенности — всё это требует ручного контроля.
  3. Продуктовые карточки и UI-элементы, где важна конкретная композиция. Плагин расставляет NBSP по правилам, но иногда вам нужно сохранить перенос ради визуального ритма.
  4. Иностранные слова или смешанные конструкции. Например, «iPhone 15 Pro», «ChatGPT 5.1», «UI/UX дизайн" — такие случаи плагины могут обрабатывать непоследовательно.
  5. Ситуации, где NBSP нарушает адаптивность. Иногда в маленьких контейнерах NBSP вызывает лишнее удлинение строки или неожиданные переносы — и его приходится убрать.

Резюмирую:

Неразрывные пробелы — ключевой элемент качественной типографики в Figma. Они делают интерфейс чище, понятнее и профессиональнее. Используйте автоматизацию через SBOL Typograph, но не забывайте о финальной проверке — сочетание плагинов и ручной корректировки даёт лучший результат.

Еще статьи