Font Size

Control the font size of an element using the lil-text-{size} utilities.

Live Editor
<>
  <p class='lil-text-xs'>text xs</p>
  <p class='lil-text-sm'>text sm</p>
  <p class='lil-text-base'>text base</p>
  <p class='lil-text-lg'>text lg</p>
  <p class='lil-text-xl'>text xl</p>
  <p class='lil-text-2xl'>text 2xl</p>
  <p class='lil-text-3xl'>text 3xl</p>
  <p class='lil-text-4xl'>text 4xl</p>
  <p class='lil-text-5xl'>text 5xl</p>
  <p class='lil-text-6xl'>text 6xl</p>
</>
<>
  <p class='lil-text-xs'>text xs</p>
  <p class='lil-text-sm'>text sm</p>
  <p class='lil-text-base'>text base</p>
  <p class='lil-text-lg'>text lg</p>
  <p class='lil-text-xl'>text xl</p>
  <p class='lil-text-2xl'>text 2xl</p>
  <p class='lil-text-3xl'>text 3xl</p>
  <p class='lil-text-4xl'>text 4xl</p>
  <p class='lil-text-5xl'>text 5xl</p>
  <p class='lil-text-6xl'>text 6xl</p>
</>
Result
text xs
text sm
text base
text lg
text xl
text 2xl
text 3xl
text 4xl
text 5xl
text 6xl