This class accepts lots of value in tailwind CSS in which all the properties are covered as in class form. It is the alternative to the CSS font-smooth property. This class is used for controlling the font smoothing of an element.
Font smoothing classes:
- antialiased
- subpixel-antialiased
Note: This class does not show any effect.
antialiased: This utility is to render text using grayscale antialiasing.
Syntax:
<element class="antialiased">...</element>
Example:
HTML
<!DOCTYPE html> <head>
<link href=
"https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet">
</head>
<body class="text-center mx-4 space-y-2">
<h1 class="text-green-600 text-5xl font-bold">
GeeksforGeeks
</h1>
<b>Tailwind CSS Font Size Class</b>
<div class="mx-24 bg-green-200">
<p class="text-lg p-4 antialiased">
Geeksforgeeks: A Computer
Science portal for Geeks
</p>
</div>
</body>
</html>
|
Output:
aliasing
subpixel-antialiased: This utility is to render text using subpixel antialiasing.
Syntax:
<element class="subpixel-antialiased">...</element>
Example:
HTML
<!DOCTYPE html> <head>
<link href=
"https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet">
</head>
<body class="text-center mx-4 space-y-2">
<h1 class="text-green-600 text-5xl font-bold">
GeeksforGeeks
</h1>
<b>Tailwind CSS Font Size Class</b>
<div class="mx-24 bg-green-200">
<p class="text-lg p-4 subpixel-antialiased">
Geeksforgeeks: A Computer
Science portal for Geeks
</p>
</div>
</body>
</html>
|
Output:
subpixel-antiialiasing