Skip to content

Font Style

Utilities for applying font-size to an element.

Quick reference

ClassProperty
text-basefont-size: 16px;

Usage

Use the text-{key} class for set up the font-size.

html

<div class="text-base">
    <!-- ... -->
</div>

Applying conditionally

Breakpoints and media queries

You can also control the responsive breakpoint with variant class modifiers. For example lg:text-xs will be only apply on large screens size and above.

html

<div class="text-base lg:text-xs">
    <!-- ... -->
</div>

Customization

Extend your theme

By default, the configuration provides a handful of general purpose font-size type utilities. You can easily filter the default scales using the Sass configuration.

scss
@use "lasco" with (
    $extend: (
        "font-size": (
            "xs": "12px"
        )
    )
);

Released under the MIT License.