Оформление текста в SVG

SVG тег <text> определяет графический элемент, содержащий текст. Как и к любому другому, к нему можно применить градиент, шаблон, окантовку, маску или фильтр.

Обратите внимание:

При изменении текста, возможно придется менять его размер и положение, а также параметры окна отображения viewBox

Обычный текст с обводкой

Обычный текст

Текст с анимированной обводкой

В данном примере можно использовать до 5-ти различных цветов контура каждой буквы

Atuin

Градиентный текст

Градиентный текст

Смещающийся и печатающийся текст

Смещающийся и печатающийся текст

3D текст

Похожий вариант на CSS можно посмотреть в теме 3D текст на CSS

3D текст 3D текст

Текст с фоновым изображением

ATUIN

Эффект жидкого текста

ATUIN

Заполняющийся текст

ATUIN

Последний вариант

ATUIN

Смотрите также:

Добавить комментарий:

Ваш комментарий отправлен!