Typography

Letter Spacing

Utilities for sets the spacing between letters.

Class

classcss
gap-tighterletter-spacing: -0.05emText
gap-tightletter-spacing: -0.025emText
gap-normalletter-spacing: 0Text
gap-wideletter-spacing: 0.025emText
gap-widerletter-spacing: 0.05emText
gap-widestletter-spacing: 0.1emText

Usage

<!-- Example -->
<y class="gap-tight">
  ...
</y>

Customize More

// @file: `src/_plugins.scss`
@include plugin(
  (
    utility: 'gap',
    //variant: 'responsive',
    property: 'letter-spacing',
    modifier: (
      'super': '.5em',
      'ultra': '1em'
      ...
    )
  )
)

Variant

VariantEnabledResponsive
DefaultYesYes
Dark Theme
hover
group-hover
focus
focus-within
active
visited
checked
disabled