Font smoothing
import { ApiTable } from "@/components/api-table.tsx"; import { Example } from "@/components/example.tsx"; import { Figure } from "@/components/figure.tsx"; import { ResponsiveDesign } from "@/components/content.tsx";
export const title = "font-smoothing"; export const description = "Utilities for controlling the font smoothing of an element.";
Examples¶
Grayscale antialiasing¶
Use the antialiased utility to render text using grayscale antialiasing:
The quick brown fox jumps over the lazy dog.
}<!-- [!code classes:antialiased] -->
<p class="antialiased ...">The quick brown fox ...</p>
Subpixel antialiasing¶
Use the subpixel-antialiased utility to render text using subpixel antialiasing:
The quick brown fox jumps over the lazy dog.
}<!-- [!code classes:subpixel-antialiased] -->
<p class="subpixel-antialiased ...">The quick brown fox ...</p>