Font Smoothing

    Use the utility to render text using subpixel antialiasing.

    Use the .antialiased utility to render text using grayscale antialiasing.

    Font Smoothing - 图2

    To control the font smoothing of an element at a specific breakpoint, add a {screen}: prefix to any existing font smoothing utility. For example, use to apply the antialiased utility at only medium screen sizes and above.

    For more information about Tailwind’s responsive design features, check out the Responsive Design documentation.

    all

    sm

    Font Smoothing - 图5

    md

    Font Smoothing - 图7

    xl

    The quick brown fox jumped over the lazy dog.

    By default, only responsive variants are generated for font smoothing utilities.

    You can control which variants are generated for the font smoothing utilities by modifying the fontSmoothing property in the section of your tailwind.config.js file.

    For example, this config will also generate hover and focus variants:

    Disabling


    ← Font Size