Tailwind CSS Font Smoothing

Class này chấp nhận nhiều giá trị trong tailwind CSS, bao gồm tất cả các thuộc tính. Class này có dạng như một class. Nó là một lựa chọn thay thế cho thuộc tính CSS font-smooth. Class này dùng để kiểm soát làm mịn font của một phần tử.

Các class làm mịn font:

  • antialiased
  • subpixel-antialiased

Lưu ý: Class này có thể không hiển thị hiệu ứng nào.

antialiased: Utility này dùng để hiển thị văn bản sử dụng grayscale antialiasing.

Syntax:

<element class="antialiased">...</element>

Example:

HTML
<!DOCTYPE html> 
<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:

tailwind-css-font-smoothing
aliasing

subpixel-antialiased: Utility này dùng để hiển thị văn bản bằng subpixel antialiasing.

Syntax:

<element class="subpixel-antialiased">...</element>

Example:

HTML
<!DOCTYPE html> 
<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:

tailwind-css-font-smoothing
subpixel-antiialiasing

Last Updated : 20/07/2025