v5: Add .fs-* utilities for font-size

- Adds new font-sizes Sass map
- Generates six new classes for setting only font-size
- Updates docs to mention this, including a scss-docs reference

Author: mdo

scss/_utilities.scss

@@ -358,6 +358,11 @@ $utilities: map-merge(
       values: $spacers
     ),
     // Text
+    "font-size": (
+      property: font-size,
+      class: fs,
+      values: $font-sizes
+    ),
     "font-weight": (
       property: font-weight,
       values: (

scss/_variables.scss

@@ -398,6 +398,17 @@ $h4-font-size:                $font-size-base * 1.5 !default;
 $h5-font-size:                $font-size-base * 1.25 !default;
 $h6-font-size:                $font-size-base !default;
 
+// scss-docs-start font-sizes
+$font-sizes: (
+  1: $h1-font-size,
+  2: $h2-font-size,
+  3: $h3-font-size,
+  4: $h4-font-size,
+  5: $h5-font-size,
+  6: $h6-font-size
+) !default;
+// scss-docs-end font-sizes
+
 $headings-margin-bottom:      $spacer / 2 !default;
 $headings-font-family:        null !default;
 $headings-font-style:         null !default;

site/content/docs/4.3/utilities/text.md

@@ -63,6 +63,23 @@ Transform text in components with text capitalization classes.
 
 Note how `.text-capitalize` only changes the first letter of each word, leaving the case of any other letters unaffected.
 
+## Font size
+
+Quickly change the `font-size` of text. While our heading classes (e.g., `.h1`–`.h6`) apply `font-size`, `font-weight`, and `line-height`, these utilities _only_ apply `font-size`.
+
+{{< example >}}
+<p class="fs-1">.fs-1 text</p>
+<p class="fs-2">.fs-2 text</p>
+<p class="fs-3">.fs-3 text</p>
+<p class="fs-4">.fs-4 text</p>
+<p class="fs-5">.fs-5 text</p>
+<p class="fs-6">.fs-6 text</p>
+{{< /example >}}
+
+Customize your available `font-size`s by modifying the `$font-sizes` Sass map.
+
+{{< scss-docs name="font-sizes" file="scss/_variables.scss" >}}
+
 ## Font weight and italics
 
 Quickly change the weight (boldness) of text or italicize text.