Chrome text render bug

112 Views Asked by At

Examples of text glitch :

enter image description here

enter image description here

If hover on element the glitch is fade out.

I tried all value of -webkit-font-smoothing and text-rendering stop on this one

-webkit-font-smoothing: subpixel-antialiased;
text-rendering: geometricPrecision;

better but don't fix the problem.

font importing like this

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  src: local(''),
  url('../fonts/inter-v12-latin-900.woff2') format('woff2'),
  url('../fonts/inter-v12-latin-900.woff') format('woff'),
  url('../fonts/inter-v12-latin-900.ttf') format('truetype'),
  url('../fonts/inter-v12-latin-900.eot?#iefix') format('eot'),
  url('../fonts/inter-v12-latin-900.svg#Inter') format('svg');
}

hardware acceleration make it better but don't fix it too

0

There are 0 best solutions below