Skip to content

Font Smoothing

Control font smoothing

Syntax

visual="[smoothing-value]"

Values

ValueCSS OutputDescription
antialiased-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscaleAntialiased
subpixel-antialiased-webkit-font-smoothing: auto; -moz-osx-font-smoothing: autoSubpixel antialiased

Examples

html
<body visual="antialiased">Smooth fonts</body>

Preview

Font Smoothing

visual="antialiased" - Control text rendering

antialiased
subpixel
View Code
html
<div layout="flex" space="g:medium p:medium" visual="bg:neutral-100 dark:bg:neutral-900 rounded:medium">
  <div space="p:small" visual="bg:primary text:white rounded:small antialiased">antialiased</div>
  <div space="p:small" visual="bg:success text:white rounded:small subpixel-antialiased">subpixel</div>
</div>