Конвертер текста в контуры SVG
Преобразуйте текст в контуры SVG с помощью собственного шрифта TTF, OTF, WOFF или WOFF2. Настройте размер, межбуквенный интервал, высоту строки и выравнивание, затем скопируйте или скачайте SVG — без загрузки на сервер.
🔒 Работает полностью в вашем браузере — ничего не загружаетсяDrop a font here or click to browse
TTF, OTF, WOFF or WOFF2. The font never leaves your device.
Load a font to see the SVG preview.
Превратите любой текст в векторные контуры
Этот конвертер берёт файл шрифта и фрагмент текста и создаёт SVG, в котором каждая буква является векторным контуром. Результат больше не зависит от того, установлен ли шрифт, поэтому выглядит абсолютно одинаково на любом устройстве и в любой программе. Благодаря этому текст в кривых идеально подходит для логотипов, иконок, графики для соцсетей, наклеек и подписей в электронных письмах, а также для машин, которые понимают только фигуры, — лазерных резаков, режущих плоттеров для винила, фрезерных станков с ЧПУ и программ для вышивки.
Параметры раскладки работают как небольшой текстовый движок. Задайте размер шрифта в пикселях, увеличьте или уменьшите межбуквенный интервал в тысячных долях em, выберите высоту строки для многострочного текста и выровняйте строки по левому краю, по центру или по правому краю. Кернинговые пары из шрифта применяются автоматически. Цвет заливки записывается в SVG, а количество знаков после запятой можно уменьшить, чтобы файл стал меньше, — это удобно, когда данные контура вставляются прямо в HTML, CSS или компонент React.
Как создаётся SVG
Шрифт разбирается библиотекой opentype.js в вашем браузере, и каждая строка текста превращается в команды рисования — перемещения, линии и квадратичные или кубические кривые Безье, — которые напрямую соответствуют синтаксису контуров SVG. Инструмент вычисляет плотную ограничивающую рамку вокруг глифов, добавляет небольшой отступ и задаёт viewBox, поэтому SVG чисто масштабируется без лишнего пустого пространства. По умолчанию каждая строка становится отдельным элементом path; отметьте «Merge into a single path», если нужна одна составная фигура. Предпросмотр — это сам файл SVG, показанный как изображение, поэтому вы видите именно то, что скачаете.
Ничего не загружается на сервер: шрифт и ваш текст остаются на вашем устройстве. Однако преобразование текста в кривые считается использованием шрифта, поэтому убедитесь, что его лицензия покрывает создаваемую вами графику или продукты. Большинство шрифтов с открытым исходным кодом это разрешают, как и многие коммерческие десктопные лицензии. Сохраните исходный текст и настройки, чтобы при необходимости быстро сгенерировать обновлённый SVG.
Как использовать
- Загрузите шрифтПеретащите шрифт TTF, OTF, WOFF или WOFF2, который хотите использовать, или щёлкните по полю, чтобы выбрать файл.
- Введите текстВведите одну или несколько строк текста. Нажмите Enter, чтобы начать новую строку.
- Настройте раскладкуЗадайте размер шрифта, межбуквенный интервал, высоту строки, выравнивание, цвет заливки и количество знаков после запятой. Предпросмотр обновляется по мере ввода.
- Скопируйте или скачайтеСкопируйте разметку SVG или только данные контура либо скачайте готовый к использованию файл .svg.
Часто задаваемые вопросы
Зачем преобразовывать текст в контуры вместо использования текстового элемента SVG?
<text> нужно, чтобы шрифт был установлен или загружен везде, где показывается файл. Контуры выглядят одинаково везде — в браузерах, программах для дизайна, лазерных резаках и плоттерах — без какого-либо файла шрифта.