38 символов · копируйте свободно

Символы стрелок любой толщины

Unicode содержит стрелки нескольких толщин, разбросанные по нескольким блокам: тонкие стрелки на U+2190, двойные стрелки на U+21D0, жирные чёрные стрелки, рассыпанные по диапазонам Dingbats и Miscellaneous Symbols, и треугольники, которые заменяют кнопки направлений. Скопируйте любой символ ниже; рядом с каждым указаны его название Unicode и код, а четыре символа, которые платформы обычно отображают эмодзи, отмечены отдельно.

Тонкие стрелки

Базовый набор — все восемь направлений плюс две двунаправленные стрелки. Поддерживается повсеместно.

Двойные стрелки

Стрелки с двойным штрихом. В математике они означают импликацию, а не направление, — это стоит знать перед тем, как использовать их для украшения.

Жирные стрелки

Сплошные стрелки с настоящим визуальным весом. У всех четырёх есть эмодзи-представление — добавьте U+FE0E, чтобы сохранить монохромность.

Стрелки-треугольники

Треугольники-указатели — именно ими обычно рисуют крестовину, кнопки управления воспроизведением или экранные клавиши-стрелки. Эмодзи-представления нет, поэтому они всегда принимают ваш цвет.

Возврат, обновление и обмен

Стрелки, обозначающие действие, а не направление: отмену, перезагрузку, обмен, ответвление.

Нажмите на любой символ, чтобы скопировать его. Ничего не скачивается — это текстовые символы, а не изображения.

Блоки Unicode

  • U+2190–U+21FF Стрелки
  • U+25B2–U+25C0 Геометрические фигуры
  • U+27A1, U+2934, U+2B05 Дополнительные стрелки-B / Дингбаты / Разные символы и стрелки

Как использовать Символы стрелок

01

Выбирайте толщину, соответствующую тексту

Тонкие стрелки ←↑→↓ уместно смотрятся внутри основного текста. Жирные стрелки и треугольники — для кнопок и элементов управления, где стрелка должна читаться как цель, а не как знак препинания.

02

Принудительно включайте текстовое представление у четырёх жирных стрелок

У ⬅ ⬆ ➡ ⬇ есть эмодзи-формы, и многие платформы по умолчанию выбирают именно их, что перебивает ваш цвет. Добавьте селектор варианта U+FE0E, чтобы сохранить монохромность, — либо используйте треугольники, у которых эмодзи-формы вообще нет.

03

Обозначайте ими клавиши управления

Таблица управления читается лучше как ← → ↑ ↓, чем словами. Добавьте элементу aria-label с названием клавиши, поскольку программа чтения с экрана произнесёт «стрелка влево», а не «клавиша со стрелкой влево».

04

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

В математике ⇒ означает «влечёт», а ⇔ — «тогда и только тогда, когда». Читатель в техническом контексте сначала прочитает логический смысл, так что для обозначения движения используйте одинарные стрелки.

О «Символы стрелок»

Стрелки разбросаны по большему числу блоков Unicode, чем почти любая другая категория символов, поэтому найти нужную сложнее, чем должно быть. Основной блок Arrows на U+2190 охватывает восемь направлений компаса тонким штрихом плюс длинный хвост специализированных математических и технических вариантов. Жирных чёрных стрелок, которые на самом деле нужны большинству для кнопок, там вообще нет — они живут в Dingbats и Miscellaneous Symbols and Arrows, на настолько разрозненных позициях, как U+27A1 и U+2B05.

Эта история создаёт практическую ловушку. Четырём жирным направленным стрелкам позже добавили эмодзи-представление, поэтому на многих платформах ➡ приходит полноцветным эмодзи, который игнорирует ваш CSS-цвет и слегка не совпадает по базовой линии с текстом. Добавление селектора текстового варианта U+FE0E исправляет это. У направленных треугольников ◀▲▶▼ из блока Geometric Shapes эмодзи-формы никогда не было, что делает их более надёжным выбором для элементов интерфейса, — именно поэтому этот сайт рисует свои экранные игровые кнопки треугольниками.

Двойные стрелки заслуживают отдельного предупреждения. В математической нотации ⇒ означает импликацию, а ⇔ — эквивалентность, и эти значения настолько устойчивы, что технически подкованный читатель сначала увидит логику, а не направление. Если имеется в виду «ведёт к» или «переходит в», одинарная стрелка → одновременно верна и однозначна. Оставьте двойные стрелки для того значения, которое они несут.

В играх стрелки несут необычно большую нагрузку, потому что именно ими объясняется движение. Каждая игра на этом сайте с управлением клавиатурой описывает своё управление тонкими стрелками, а сенсорное управление рисует треугольниками, так что один и тот же словарь направлений работает и при чтении инструкции, и при касании экрана, — а поскольку и то и другое текст, оба автоматически принимают акцентный цвет игры.

Игры, нарисованные этими символами

Каждое игровое поле на этом сайте сделано из Unicode, а не из спрайтов. Эти игры используют символы, показанные выше.

Часто задаваемые вопросы

Как скопировать символ стрелки?

Кликните по любой стрелке выше, чтобы скопировать её в буфер обмена. Чтобы ввести её напрямую: в HTML используйте → ← ↑ ↓, а в большинстве редакторов напрямую работает код символа — U+2192 для →.

Почему моя стрелка превратилась в цветной эмодзи?

У жирных стрелок ⬅ ⬆ ➡ ⬇ есть и текстовое, и эмодзи-представление, и некоторые платформы по умолчанию выбирают эмодзи. Добавьте селектор текстового варианта U+FE0E сразу после символа либо переключитесь на треугольники ◀▲▶▼, у которых эмодзи-формы нет.

В чём разница между → и ⇒?

Визуально — один штрих против двух, но значения различаются. В математике ⇒ означает «влечёт», а ⇔ — «тогда и только тогда, когда». Для обычного направления или движения используйте одинарную стрелку → — иначе технически подкованный читатель увидит логику там, где вы имели в виду движение.

Какие стрелки использовать для игровых или медиа-элементов управления?

Направленные треугольники ◀▲▶▼ из блока Geometric Shapes. У них нет эмодзи-представления, поэтому они всегда принимают ваш CSS-цвет, а визуального веса им хватает, чтобы читаться как кнопки, а не как пунктуация.

Доступны ли символы стрелок для программ чтения с экрана?

Они озвучиваются по своему названию Unicode, так что → прочитается как «стрелка вправо» — а это редко то, что имелось в виду. Если стрелка подписывает элемент управления, добавьте ему aria-label вроде «Двигаться влево» и скройте сам символ через aria-hidden, чтобы он не озвучивался дважды.

Support the arcade

Нравятся игры?

UnicodeGames бесплатен, без рекламы и всегда таким останется. Если игра скрасила вам перерыв на кофе, можете отплатить тем же.

Угостить меня кофе

One-off · No account needed · Handled by Buy Me a Coffee