Оптимизатор SVG
Перетащите файлы сюда или нажмите, чтобы выбрать
- Безопасно
- Обработка выполняется на вашем устройстве, поэтому ввод/вывод никуда не отправляется.
Объяснение
Analyzes the SVG structure and removes unnecessary markup within the range that does not affect rendering. It expands styles, optimizes size declarations, reduces attributes, and simplifies numeric/path data to effectively reduce file size while maintaining visual quality.
What optimization does
| Styles | Expands CSS in <style> into per-element style attributes where possible. After expansion, it may convert them further into presentation attributes such as fill and stroke, and removes <style> elements that become empty and unnecessary. |
|---|---|
| Sizing | Removes width / height declarations in style as well as width / height attributes from the root <svg> element. viewBox, which is needed for responsive rendering, is preserved. |
| Attributes | Removes unnecessary attributes added by design tools such as Figma, Adobe XD, and Illustrator (e.g. data-name). id and class may also be removed when they are not referenced, or when element merging/conversion (e.g. <line> to <path>) makes them unnecessary. |
| References | Checks reference attributes such as filter, clip-path, and mask, and removes them when the referenced target does not exist. If a valid reference exists (and affects appearance), it is kept. |
| Numbers & paths | Automatically chooses the lightest rounding precision (floatPrecision) by comparing render results across candidates to minimize visual differences. It also simplifies path data such as the d attribute on <path>, removes unnecessary whitespace/redundancy, and applies multipass to iterate optimization for maximum size reduction. |
| Compatibility | To prevent rendering issues, viewBox is preserved. When an SVG contains <text> elements, xml:space (which controls whitespace handling) is preserved (it may be removed when there is no <text>). For SVGs with animations, some optimizations are suppressed to stay on the safe side. Complex CSS that is difficult to inline may also be kept to preserve the original appearance. |
Notes
Depending on the SVG structure and markup, the size reduction rate and final output can vary. For styles that are difficult to expand/inline automatically (e.g. complex selectors or media queries), the optimizer may keep them to preserve rendering.
When elements are merged or converted (e.g. converting <line> to <path>), id and class on the original elements may be removed if they become unnecessary due to structural changes.
Reference attributes such as filter, clip-path, and mask are automatically removed when their targets do not exist (e.g. broken url(#...) references) to keep the SVG consistent.
SVGs with animations (CSS animations or <animate> tags) can be optimized, but some optimizations are suppressed because animation behavior can break easily. If the SVG contains scripts (JS), optimization may lead to unexpected behavior.