Rendering
Text Rendering
Utilities for fine tune optimization by suggesting to the browser as to how it should render text on the screen.
Variant
Active Checked Child-Selection Dark Mode Disabled Expand First-Last-Selection First-Letter Focus Focus-Visible Focus-Within Fullscreen Group-Focus Group-Hover Hover Landscape Light Mode Portrait Reduce-Motion Responsive Selection-Hover Visited
API
class | css |
---|---|
text-optimize-auto | text-rendering: auto; |
text-optimize-speed | text-rendering: optimizeSpeed; |
text-optimize-legibility | text-rendering: optimizeLegibility; |
text-optimize-precision | text-rendering: geometricPrecision; |
Usage
<div class="text-optimize-legibility">
...
</div>
HTML
.dummy {
@extend
.text-optimize-legibility;
}
SCSS