Генератор текстовых рамок

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

Ваш текст

Стиль рамки

Выравнивание

Отступы

Как пользоваться Текстовая рамка

1
Введите или вставьте текст
Введите текст, который хотите обвести рамкой. Одна строка или несколько — рамка растягивается под самую длинную строку.
2
Выберите стиль рамки
Выберите рамку — одинарную, скруглённую, двойную, жирную, ASCII, пунктирную, из звёздочек или блочную, — подходящую к месту, куда вы её вставите.
3
Задайте выравнивание и отступы
Выровняйте текст внутри рамки по левому краю, по центру или по правому и добавьте внутренние отступы, чтобы вокруг слов было немного свободного места.

4
Скопируйте и вставьте
Текст в рамке мгновенно появляется ниже. Скопируйте его и вставьте в комментарий, README, блок кода, терминал или чат.

О рисовании рамок и границ вокруг текста

Что такое символы псевдографики

Задолго до появления графики терминалы рисовали таблицы, рамки и меню при помощи особого блока символов Unicode, придуманного именно для этой задачи: углы, горизонтальные и вертикальные линии, а также стыки, которые без зазоров соединяются в непрерывную границу. Те же самые символы по-прежнему работают в любом современном приложении, поэтому вы можете обвести заметку или заголовок настоящим прямоугольником вместо ряда дефисов, которые в углах толком не сходятся.

Поскольку каждый глиф — это обычный текст, рамка, которую вы строите здесь, не является картинкой. Она копируется и вставляется, как любые другие слова, переживает цитирование и правки и читается всем, что вообще умеет читать текст, — именно поэтому текст в рамке повсюду встречается в файлах README, инструментах командной строки и комментариях к коду.

Заглянем внутрь блока псевдографики Unicode

Линейные глифы берутся из специального диапазона Unicode под названием Box Drawing — набора примерно из 128 символов, разработанного в эпоху текстовых терминалов, чтобы программы могли рисовать таблицы и окна. В нём есть четыре угла, горизонтальные и вертикальные линии, а также Т-образные и крестообразные стыки в нескольких начертаниях: тонком, утолщённом и двойном. Скруглённые углы, придающие стилю «Скруглённая» мягкий вид, входят в тот же блок, поэтому изгиб аккуратно стыкуется с прямыми линиями.

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

Выбор стиля и компоновки

Стили рамки задают настроение. Одинарная и скруглённая — спокойные и аккуратные для небольшой заметки; двойная и жирная привлекают больше внимания и хороши для заголовка или предупреждения; ASCII — безопасный выбор, когда вы не уверены, что место назначения поддерживает причудливые символы, ведь она использует только самые базовые клавиши. Из звёздочек и блочная — декоративные и выделяются в чате или баннере.

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

Границы Unicode против запасного варианта ASCII

Здесь есть два семейства рамок, и выбор подходящего сводится главным образом к тому, где эта рамка будет жить. Стили Unicode — одинарный, скруглённый, двойной и жирный — рисуют чёткие, непрерывные линии и смотрятся лучше всего в современных приложениях, которые полностью поддерживают блок псевдографики, а это сегодня почти везде. Стиль ASCII намеренно проще: он строит рамку только из клавиш плюс, минус и вертикальной черты — символов, которые каждая система поддерживает с самого начала.

Берите ASCII, когда место назначения старое, неизвестное или строгое к символам, — устаревший терминал, файл конфигурации, письмо в виде простого текста или код, который обязан оставаться чистым ASCII. Углы получатся чуть более угловатыми, ведь знак плюса выполняет работу настоящего углового глифа, зато рамка гарантированно отобразится одинаково везде. Во всех остальных случаях стили Unicode дают более чистый результат.

Почему важны моноширинные шрифты, и разбор на примере

Нарисованная рамка остаётся прямоугольной только тогда, когда каждый символ занимает одинаковую ширину, — а это и есть определяющее свойство моноширинного шрифта, или шрифта фиксированной ширины. В таких условиях верхняя линия, нижняя линия и боковые планки укладываются в одинаковое число колонок, поэтому прямоугольник аккуратно замыкается. Наберите в этом инструменте Hello с одинарной рамкой и отступом в один символ — и вы получите верхнюю линию из углов и дефисов, среднюю строку вида │ Hello │ и точно такую же нижнюю линию: три ряда, края которых идеально совпадают в любом моноширинном шрифте.

Поместите эту же рамку в чат с пропорциональным шрифтом — и иллюзия рушится, ведь узкая буква вроде «i» занимает меньше места, чем широкая вроде «m», из-за чего правая граница становится рваной. Решение — поместить рамку туда, где правит шрифт фиксированной ширины, в блок кода или терминал, а не менять саму рамку.

Выравнивание рамок с широкими символами

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

Это свойство того, как шрифты отображают подобные системы письма, а не изъян рамки. Если рамка вокруг эмодзи или текста CJK выглядит перекошенной, простой одинарный стиль или ASCII лучше всего терпят эту разницу, а небольшой отступ способен скрыть смещение в одну колонку. Ради идеально прямоугольного результата держите содержимое в пределах символов одинарной ширины.

Как удачно использовать текст в рамке

Текст в рамке проявляет себя лучше всего, когда что-то выделяет: заголовок в начале README, примечание в комментарии к коду, ASCII-баннер в терминальной программе или подсвеченное сообщение в блоке кода на форуме. Используйте рамку, когда блок текста заслуживает заметной границы, и держите содержимое коротким, чтобы прямоугольник оставался разумной ширины.

Единственное правило, которое действительно важно, — это шрифт. Рамка остаётся прямоугольной только в моноширинной среде, поэтому вставляйте её туда, где используется шрифт фиксированной ширины, и при неуверенности предпочитайте простой линейный стиль. На GitHub, Discord, Reddit и Slack это означает обернуть рамку в блок кода, который принудительно задаёт шрифт фиксированной ширины и держит каждый край в строю.

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

Что такое генератор текстовых рамок?

Это инструмент, который окружает ваш текст нарисованным прямоугольником из символов псевдографики — линий и угловых глифов, как в одинарных, двойных или скруглённых рамках. Результат — это обычный текст, поэтому его можно вставить куда угодно в виде аккуратного блока в рамке, а не разрозненной строки слов.

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

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

Где текст в рамке смотрится лучше всего?

Везде, где используется моноширинный шрифт (фиксированной ширины), в котором каждый символ имеет одинаковую ширину, — в блоках кода на GitHub, Discord, Reddit и Slack, в файлах README, терминалах и комментариях к коду. В таких местах рамка выстраивается в идеально ровный прямоугольник.

Почему в некоторых приложениях рамка выглядит кривой?

В большинстве полей для чата и документов используется пропорциональный шрифт, где «i» уже, чем «m», поэтому правый край рамки может выглядеть рваным. Вставьте рамку в блок кода или переключите область на моноширинный шрифт — и края снова выровняются. Широкие символы, такие как эмодзи и китайский, японский или корейский текст, занимают в терминале две колонки, поэтому рамка вокруг них тоже может оказаться смещённой на колонку — это свойство шрифта, а не ошибка.

В чём разница между стилями?

Они рисуют один и тот же прямоугольник разными линейными глифами. Одинарный, скруглённый, двойной и жирный используют линии псевдографики Unicode с прямыми, скруглёнными, двойными или утолщёнными штрихами. ASCII использует только плюс, минус и вертикальную черту, поэтому работает даже в самых простых средах. Пунктирный использует прерывистую линию, из звёздочек строит рамку из астерисков, а блочный использует сплошные полублоки для массивного вида.

Отправляется ли мой текст куда-либо?

Нет. Рамка полностью строится в вашем браузере по мере того, как вы печатаете. Ничего из того, что вы вводите, не загружается на сервер, не записывается в журнал и не сохраняется.