Почему размывается svg и плохая четкость?

Question

[ololoshka1]

Есть svg

Когда ставлю ему ширину в 7vw, оно не четкое, как оригинальное, почему я не могу понять.
Если ставить больше 10vw , по четкость возвращается, как правильно делать?

P.S. Вот код https://codepen.io/vintalis/pen/mdPOBmd

Comments

[Adamos]

Для начала - проверить, в каком именно браузере проблема.

[ololoshka1]

Adamos, у всех браузерах, проблема в нем.А в svg.

[ololoshka1]

Не понимаю почему пропадает четкость при уменьшении .

[Adamos]

ololoshka1, не смог увидеть у себя в ФФ каких-либо проблем с этим SVG.

[ololoshka1]

Adamos, ну так возьми увеличь на 11vw, и сравни с 7vw ,сразу видно что четкость теряется

[RAX7]

Потому что очень много мелких деталей в логотипе. При ширине svg 100px толщина линий менее 1px вот они и размываются

[ololoshka1]

RAX7, ну тоисть это вина того кто сделал такое svg и как его исправить?

[RAX7]

ololoshka1, сделать упрощенный вариант логотипа и использовать его.

[Adamos]

По-прежнему не вижу проблемы. Совершенно нормальная растеризация, при чем тут какая-то "вина"? Если нужно, чтобы линии были темнее на мелких разрешениях - их придется сделать жирнее, но если глаз занимает 5 экранных пикселей, особенной красоты в нем все равно добиться невозможно, разве что маяться пиксельной графикой под каждый конкретный размер.

Answer 1

[Андрей Беспалов]

Нормальная растеризация - вы картинку с viewbox 2300*2500px уменьшаете до viewport 7vw.
Дисплеи у нас не векторные - все равно все в итоге отображается в растровом формате. Если до 1vw уменьшите - все еще больше поплывет.