Вчера Figma добавила в экспорт выбор типа сэмплинга.

✔️ Краткая справка
Когда вы изменяете размер изображения (уменьшаете или увеличиваете), пиксели не просто масштабируются механически, а пересчитываются с разными алгоритмами. Это и называется ресемплингом. От метода пересчёта зависит, насколько чётким или размытым будет изображение.

Есть два варианта Detailed и Basic.

✔️ Что надо знать?
Если при экспорте картинка говно, то либо у вас стоит Basic, либо картинка изначально говно.

Выбирайте Detailed, он более крутой.

✔️ Что нам скажет чатгпт на эту тему?
Basic → для иконок, пиксель-арта, простых UI-элементов.

Detailed → для фотографий, сложных текстур, иллюстраций, где важны плавные переходы.

Если глянуть в SVG который отдаёт фигма, можно заметить прикольные штуки:

1. Angular градиент рисуется через css.

*️⃣То есть оно отлично сработает в web. В чистом виде в Android не сработает, надо попробовать конвертировать в Android Vector Drawable (.xml). В iOS понятно вообще не работает. Это надо учитывать. Для мобильных разработчиков надо объяснять, что вы там натворили.

2. Diamond градиент рисуется через 4 прямоугольника с линейным градиентом, которые преобразованны через матрицу трансформаций. Кайф.

3. Фигма добавляет свой тег, с описанием того, что это за объект, на случай если вы этот svg снова загрузите в фигму. Там будет обычный градиент как надо. Хорошее решение.

Отсюда следует — не забываем удалять лишнее из SVG перед тем как залить на сайт (нахер вам там инфа для фигмы нужна).