font-smoothing.html   [plain text]


<!DOCTYPE html>

<html>
  <style type="text/css" media="screen">
    div {
      margin: 20px;
      font-size: 24pt;
    }

    .composited {
      -webkit-transform: translateZ(0);
      background-color: white;
    }
    
    .smoothed {
      -webkit-font-smoothing: subpixel-antialiased;
    }
  </style>
<head>
</head>
<body>
  <div class="composited">
    This text should be antialiased, but not smoothed.
  </div>

  <div class="smoothed composited">
    This text should be antialiased and smoothed.
  </div>

  <div>
    This text should be antialiased and smoothed in the browser, and antialiased in pixel results.
  </div>
</body>
</html>