SVG (Scalable Vector Graphics)
SVG — формат векторных изображений на основе XML, масштабируемый до любого разрешения без потери качества. Идеально подходит для логотипов, иконок, иллюстраций и интерактивной графики в интернете. Файлы SVG можно стилизовать с помощью CSS, анимировать с помощью JavaScript, они полностью доступны для поиска и скринридеров.
MIME-тип
image/svg+xml
Тип
Текст
Сжатие
Без потерь
Преимущества
- + Infinite scalability without quality loss
- + Tiny file sizes for simple graphics
- + Styleable with CSS and scriptable with JS
- + Accessible and SEO-friendly (text is selectable)
Недостатки
- − Not suitable for photographs or complex raster images
- − Complex SVGs can be large and slow to render
- − Security concerns when accepting user-uploaded SVGs
Когда использовать .SVG
Используйте SVG для логотипов, иконок, иллюстраций, диаграмм и любой графики, которая должна идеально масштабироваться при любом разрешении или стилизоваться через CSS.
Технические детали
SVG хранит изображения как XML-текст, описывающий геометрические фигуры, контуры и текст. Поддерживает фильтры, градиенты, обтравочные контуры, маски и встроенные растровые изображения.
История
SVG был разработан консорциумом W3C и впервые выпущен как рекомендация в 2001 году. SVG 1.1 стал широко принятым стандартом в 2003 году, а SVG 2 в настоящее время находится в разработке.
Конвертировать из .SVG
Конвертировать в .SVG
Связанные форматы
Связанные термины
Learn More
Color Theory for Digital Design: A Practical Guide
Understanding color theory helps you create visually harmonious designs that communicate effectively. This guide covers color models, harmony rules, accessibility …
CSS Units Explained: px, em, rem, vh, and When to Use Each
CSS offers over a dozen length units, each suited to different situations. Understanding the differences between absolute and relative units …
Image Format Guide: JPEG vs PNG vs WebP vs AVIF
Choosing the right image format affects file size, quality, and browser compatibility. This comparison covers the strengths of JPEG, PNG, …
QR Code Generation: Best Practices for Print and Digital
QR codes bridge physical and digital experiences, but poorly generated codes fail to scan. This guide covers sizing, error correction, …
Flexbox vs CSS Grid: A Practical Comparison
Flexbox and CSS Grid are complementary layout systems, not competitors. This guide clarifies when to reach for each one and …
How to Convert Images Between Formats
A practical guide to converting between image formats like JPEG, PNG, WebP, SVG, and HEIC. Learn which conversions are lossless, …