Как убрать шакализацию шрифта в браузере?

Question

[Intelix]

$ - символ, не изображение

В фигме шрифт выглядит так при любом масштабе:
На странице так:

Можно ли символ сделать таким же четким как в фигме ?

Comments

[Ankhena]

1. Шрифты рендерятся по-разному разными системами. Это нужно понимать.
2. Сам шрифт должен быть нормальным (бывают кривые вариации).
3. Шрифт должен быть правильно подключен, в правильных форматах и правильном порядке. Для современных браузеров это woff2, для предыдущего поколения woff. Всё остальное барахло подключать не нужно.

[Нікіта]

Почему просто не экспортировать иконку из figma?

Answer 1

[valgerofficial]

Учитывайте то, что на веб страницах, шрифт выглядит по другому, в зависимости от того какой у вас монитор / разрешение / герцовка. И как вы сгенерировали шрифт для сайта. Скажите какие форматы вы подключали? (ttf, svg, woff, eot). И через какой сервис вы их генерировали?

Comments

[Intelix]

Это шрифт Helvetica Neue
embedded-opentype, woff, truetype

думаю проблема не в мониторе, потому-что проверил на разных, 75гц, 60гц,144гц с разрешением fullhd и 2k

шрифт не менял, фон у элемента

[valgerofficial]

Попробуйте вот этот генератор. и сгенерируйте только в woff, woff2. Современные браузеры лучше понимают данный формат.

Answer 2

[olderthanyou]

Учитывайте тот факт, что Figma рендерит шрифты векторной графикой, а на сайтах растр