SVGView

Инструмент изменения размера SVG

Настройте размеры без нарушения макета. Полезно для подгонки иконок к сеткам или соответствия спецификациям дизайна. Открывайте файлы SVG онлайн и начинайте обработку сразу.

SVG не загружен. Перетащите файл для начала.

Добро пожаловать в редактор SVG

Перетащите SVG-файл, нажмите «Загрузить»/«Иконки» или используйте Ctrl/Cmd+V для вставки кода SVG

Начните с образца иконки

Выберите образец ниже или загрузите и отредактируйте свой SVG.

Почему использовать наш инструмент изменения размера SVG?

Управление пикселями или процентами

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

Блокировка соотношения сторон

Опция блокировки сохраняет пропорции и предотвращает искажение. Сохранение соотношения обеспечивает визуальный баланс иконок и иллюстраций. Это особенно полезно для логотипов, которые не должны растягиваться.

Вывод с учетом viewBox

Инструмент сохраняет или исправляет viewBox, чтобы актив масштабировался правильно в CSS и HTML. Это избегает неожиданного обрезания или пробелов в производстве. Правильные настройки viewBox также уменьшают смещения макета при замене активов.

Живой предварительный просмотр

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

Гибкий экспорт

Инструмент изменения размера SVG позволяет скачать измененный SVG или экспортировать PNG в один шаг. Это полезно, когда вам нужен растровый fallback для документов или презентаций. Держите обе версии в одной папке для легкой передачи. Экспорт обоих форматов уменьшает туда-сюда во время ревью.

Локальная обработка

Инструмент изменения размера SVG работает полностью в вашем браузере, поэтому файлы никогда не покидают ваше устройство. Это сохраняет приватность клиентских активов и ускоряет итерации. Локальная обработка также избегает задержек загрузки на больших файлах. Это хорошо работает, когда сетевые политики блокируют загрузки.

Как изменить размер SVG

1

Добавьте свой SVG

Перетащите файл или вставьте разметку SVG. Инструмент изменения размера SVG загружает источник локально и сохраняет оригинальный viewBox. Если SVG не имеет viewBox, добавьте один перед изменением размера. Открывайте файлы SVG онлайн и начинайте обработку сразу.

2

Установите размеры

Введите целевую ширину и высоту или масштабируйте пропорционально. Инструмент изменения размера SVG показывает живой предварительный просмотр, чтобы вы могли проверить вид. Проверьте ширину штрихов, чтобы убедиться, что они все еще кажутся сбалансированными.

3

Экспортируйте результаты

Скачайте измененный SVG или экспортируйте PNG мгновенно. Инструмент изменения размера SVG сохраняет чистые имена файлов, чтобы активы были легко отслеживать в передаче. Используйте последовательный шаблон именования, такой как icon-name-24.svg.

FAQ по изменению размера SVG

Могу ли я изменить размер SVG онлайн до точных размеров?
Да. Инструмент изменения размера SVG принимает точные значения пикселей для ширины и высоты, что облегчает соответствие спецификациям макета. Это полезно, когда активы должны соответствовать строгим размерам компонентов.
Как сохранить соотношение сторон при изменении размера SVG?
Включите опцию блокировки в инструменте изменения размера SVG, чтобы сохранить пропорции. Это предотвращает растяжение иконок и логотипов. Это также сохраняет круги от превращения в овалы.
Сохранит ли инструмент изменения размера SVG viewBox?
Инструмент изменения размера SVG сохраняет viewBox и обновляет его при необходимости, чтобы масштабирование оставалось точным в браузере. Правильные значения viewBox улучшают отзывчивость в CSS. Это важно, когда SVG используются как фоновые изображения.
Могу ли я экспортировать PNG после изменения размера?
Да. Инструмент изменения размера SVG включает опцию экспорта PNG для документации, слайдов или инструментов только растровых. Экспорты PNG полезны, когда платформа не поддерживает SVG. Они также удобны для быстрых предварительных просмотров клиентов.
Загружается ли мой SVG?
Нет. Инструмент изменения размера SVG работает локально в вашем браузере, поэтому ваши файлы никогда не покидают ваше устройство. Это сохраняет конфиденциальность клиентских активов.
Какой лимит размера файла?
Инструмент изменения размера SVG поддерживает файлы до 10 МБ. Если SVG очень сложный, рассмотрите его оптимизацию сначала. Более простые пути также рендерятся быстрее.
Могу ли я изменить размер для retina-активов?
Да. Инструмент изменения размера SVG хорошо работает для экспорта размеров 2x или 3x, которые вы можете затем уменьшить в CSS для дополнительной резкости. Это полезно для наборов иконок в системах дизайна. В сомнительных случаях экспортируйте больше и уменьшайте масштаб, чтобы избежать мягкости.
Бесплатен ли инструмент изменения размера SVG без загрузки?
Да. Инструмент изменения размера SVG бесплатен для использования в вашем браузере. Не требуются загрузки или установка.
Нужен ли аккаунт для использования инструмента изменения размера SVG?
Нет. Инструмент изменения размера SVG работает мгновенно в браузере без регистрации, и файлы остаются локальными.

Связанные инструменты SVG

Используйте инструмент изменения размера SVG с этими инструментами для поворота, оптимизации и экспорта согласованных активов.

Поворот и отражение SVG

Настройте ориентацию перед изменением размера SVG, чтобы окончательные размеры соответствовали вашему макету. Это сохраняет ширину и высоту предсказуемыми после поворота.

Открыть инструмент

Оптимизатор SVG

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

Открыть инструмент

Просмотрщик SVG

Предварительно просмотрите актив перед и после изменения размера SVG, чтобы проверить выравнивание. Используйте фоны сетки для проверки отступов.

Открыть инструмент

SVG в PNG

Экспортируйте PNG вместе с результатами изменения размера SVG, когда вам нужны растровые fallbacks. Это удобно для презентаций и документов.

Открыть инструмент