diff --git a/components/fieldlabel/index.css b/components/fieldlabel/index.css
index fd4b63b2f4..e092a33502 100644
--- a/components/fieldlabel/index.css
+++ b/components/fieldlabel/index.css
@@ -11,82 +11,72 @@ governing permissions and limitations under the License.
 */
 
 .spectrum-FieldLabel {
-  --spectrum-fieldlabel-min-height: var(--spectrum-component-height-75);
-  --spectrum-fieldlabel-color: var(--spectrum-neutral-subdued-content-color-default);
-
+  --spectrum-fieldlabel-min-height: var(--spectrum-component-height-100);
+  --spectrum-fieldlabel-top-to-text: var(--spectrum-component-top-to-text-100);
+  --spectrum-fieldlabel-bottom-to-text: var(--spectrum-component-bottom-to-text-100);
   --spectrum-field-label-text-to-asterisk: var(--spectrum-field-label-text-to-asterisk-medium);
 
+  --spectrum-fieldlabel-font-size: var(--spectrum-font-size-100);
   --spectrum-fieldlabel-font-weight: var(--spectrum-regular-font-weight);
   --spectrum-fieldlabel-line-height: var(--spectrum-line-height-100);
   --spectrum-fieldlabel-line-height-cjk: var(--spectrum-cjk-line-height-100);
+
+  --spectrum-fieldlabel-side-margin-block-start: var(--spectrum-field-label-top-margin-medium);
+  --spectrum-fieldlabel-side-padding-right: var(--spectrum-spacing-200);
+
+  --spectrum-fieldlabel-color: var(--spectrum-neutral-subdued-content-color-default);
 }
 
 .spectrum-FieldLabel--sizeS {
   --spectrum-fieldlabel-min-height: var(--spectrum-component-height-75);
   --spectrum-fieldlabel-top-to-text: var(--spectrum-component-top-to-text-75);
   --spectrum-fieldlabel-bottom-to-text: var(--spectrum-component-bottom-to-text-75);
-  --spectrum-fieldlabel-font-size: var(--spectrum-font-size-75);
-
-  --spectrum-fieldlabel-side-margin-block-start: var(--spectrum-field-label-top-margin-small);
-  --spectrum-fieldlabel-side-padding-right: var(--spectrum-spacing-100);
-
   --spectrum-field-label-text-to-asterisk: var(--spectrum-field-label-text-to-asterisk-small);
-}
 
-.spectrum-FieldLabel--sizeM {
-  --spectrum-fieldlabel-min-height: var(--spectrum-component-height-75);
-  --spectrum-fieldlabel-top-to-text: var(--spectrum-component-top-to-text-75);
-  --spectrum-fieldlabel-bottom-to-text: var(--spectrum-component-bottom-to-text-75);
   --spectrum-fieldlabel-font-size: var(--spectrum-font-size-75);
 
-  --spectrum-fieldlabel-side-margin-block-start: var(--spectrum-field-label-top-margin-medium);
-  --spectrum-fieldlabel-side-padding-right: var(--spectrum-spacing-200);
-
-  --spectrum-field-label-text-to-asterisk: var(--spectrum-field-label-text-to-asterisk-medium);
+  --spectrum-fieldlabel-side-margin-block-start: var(--spectrum-field-label-top-margin-small);
+  --spectrum-fieldlabel-side-padding-right: var(--spectrum-spacing-100);
 }
 
 .spectrum-FieldLabel--sizeL {
-  --spectrum-fieldlabel-min-height: var(--spectrum-component-height-100);
-  --spectrum-fieldlabel-top-to-text: var(--spectrum-component-top-to-text-100);
-  --spectrum-fieldlabel-bottom-to-text: var(--spectrum-component-bottom-to-text-100);
-  --spectrum-fieldlabel-font-size: var(--spectrum-font-size-100);
-
-  --spectrum-fieldlabel-side-margin-block-start: var(--spectrum-field-label-top-margin-large);
-  --spectrum-fieldlabel-side-padding-right: var(--spectrum-spacing-200);
-
-  --spectrum-field-label-text-to-asterisk: var(--spectrum-field-label-text-to-asterisk-large);
-}
-
-.spectrum-FieldLabel--sizeXL {
   --spectrum-fieldlabel-min-height: var(--spectrum-component-height-200);
   --spectrum-fieldlabel-top-to-text: var(--spectrum-component-top-to-text-200);
   --spectrum-fieldlabel-bottom-to-text: var(--spectrum-component-bottom-to-text-200);
+  --spectrum-field-label-text-to-asterisk: var(--spectrum-field-label-text-to-asterisk-large);
+
   --spectrum-fieldlabel-font-size: var(--spectrum-font-size-200);
 
-  --spectrum-fieldlabel-side-margin-block-start: var(--spectrum-field-label-top-margin-extra-large);
-  --spectrum-fieldlabel-side-padding-right: var(--spectrum-spacing-200);
+  --spectrum-fieldlabel-side-margin-block-start: var(--spectrum-field-label-top-margin-large);
+}
 
+.spectrum-FieldLabel--sizeXL {
+  --spectrum-fieldlabel-min-height: var(--spectrum-component-height-300);
+  --spectrum-fieldlabel-top-to-text: var(--spectrum-component-top-to-text-300);
+  --spectrum-fieldlabel-bottom-to-text: var(--spectrum-component-bottom-to-text-300);
   --spectrum-field-label-text-to-asterisk: var(--spectrum-field-label-text-to-asterisk-extra-large);
+
+  --spectrum-fieldlabel-font-size: var(--spectrum-font-size-300);
+
+  --spectrum-fieldlabel-side-margin-block-start: var(--spectrum-field-label-top-margin-extra-large);
 }
 
 .spectrum-FieldLabel {
   display: block;
+
   box-sizing: border-box;
   min-block-size: var(--mod-fieldlabel-min-height, var(--spectrum-fieldlabel-min-height));
-
   padding-block: var(--mod-field-label-top-to-text, var(--spectrum-fieldlabel-top-to-text)) var(--mod-field-label-bottom-to-text, var(--spectrum-fieldlabel-bottom-to-text));
   padding-inline: 0;
 
   font-size: var(--mod-fieldlabel-font-size, var(--spectrum-fieldlabel-font-size));
   font-weight: var(--mod-fieldlabel-font-weight, var(--spectrum-fieldlabel-font-weight));
-
   line-height: var(--mod-fieldlabel-line-height, var(--spectrum-fieldlabel-line-height));
+  color: var(--spectrum-fieldlabel-color);
 
   -webkit-font-smoothing: subpixel-antialiased;
   -moz-osx-font-smoothing: auto;
 
-  color: var(--spectrum-fieldlabel-color);
-
   /* CJK (Chinese, Japanese, and Korean) language support */
   &:lang(ja),
   &:lang(zh),
@@ -116,19 +106,25 @@ governing permissions and limitations under the License.
   text-align: end;
 }
 
+.spectrum-FieldLabel--staticBlack {
+  color: var(--spectrum-black);
+}
+
+.spectrum-FieldLabel--staticWhite {
+  color: var(--spectrum-white);
+}
+
 /********* Form *********/
 .spectrum-Form {
   --spectrum-tableform-item-block-spacing: var(--spectrum-spacing-300);
 
-  margin: 0;
   display: grid;
   grid-template-columns: var(--mod-form-grid-template-columns, auto auto);
-  inline-size: var(--mod-form-inline-size, fit-content);
+  row-gap: var(--mod-form-item-block-spacing, var(--spectrum-tableform-item-block-spacing));
   justify-content: start;
 
-  /* @deprecation --mod-tableform-item-block-spacing has been renamed to
-     --mod-form-item-block-spacing. The fallback will be removed in a future version. */
-  row-gap: var(--mod-form-item-block-spacing, var(--mod-tableform-item-block-spacing, var(--spectrum-tableform-item-block-spacing)));
+  inline-size: var(--mod-form-inline-size, fit-content);
+  margin: 0;
 }
 
 /* Row */
@@ -156,9 +152,7 @@ governing permissions and limitations under the License.
 
 /* Rows with stacked alignment */
 .spectrum-Form--labelsAbove {
-  /* @deprecation --mod-tableform-item-block-spacing-labels-above has been renamed to
-     --mod-form-item-block-spacing-labels-above. The fallback will be removed in a future version. */
-  --mod-form-item-block-spacing: var(--mod-form-item-block-spacing-labels-above, var(--mod-tableform-item-block-spacing-labels-above, var(--spectrum-spacing-200)));
+  --mod-form-item-block-spacing: var(--mod-form-item-block-spacing-labels-above, var(--spectrum-spacing-200));
   --mod-form-grid-template-columns: var(--mod-form-grid-template-columns-labels-above, auto);
 
   .spectrum-Form-item {
@@ -170,10 +164,10 @@ governing permissions and limitations under the License.
 .spectrum-FieldLabel,
 .spectrum-Form-itemLabel {
   &.is-disabled {
-    color: var(--highcontrast-disabled-content-color, var(--mod-disabled-content-color, var(--spectrum-disabled-content-color)));
+    color: var(--highcontrast-field-label-disabled-content-color, var(--mod-field-label-disabled-content-color, var(--spectrum-disabled-content-color)));
 
     .spectrum-FieldLabel-requiredIcon {
-      color: var(--highcontrast-disabled-content-color, var(--mod-disabled-content-color, var(--spectrum-disabled-content-color)));
+      color: var(--highcontrast-field-label-disabled-content-color, var(--mod-field-label-disabled-content-color, var(--spectrum-disabled-content-color)));
     }
   }
 }
@@ -181,6 +175,6 @@ governing permissions and limitations under the License.
 /********* WHCM *********/
 @media (forced-colors: active) {
   .spectrum-FieldLabel {
-    --highcontrast-disabled-content-color: GrayText;
+    --highcontrast-field-label-disabled-content-color: GrayText;
   }
 }
diff --git a/components/fieldlabel/metadata/fieldlabel.yml b/components/fieldlabel/metadata/fieldlabel.yml
index 4a1a2c3ab6..6840249ab1 100644
--- a/components/fieldlabel/metadata/fieldlabel.yml
+++ b/components/fieldlabel/metadata/fieldlabel.yml
@@ -6,7 +6,15 @@ sections:
       This component can be modified via its `--mod-*` prefixed custom properties. A list of those prefixed custom properties can be found <a class="spectrum-Link" href="https://github.com/adobe/spectrum-css/tree/main/components/fieldlabel/metadata/mods.md">here</a>.
   - name: Migration Guide
     description: |
-      ### T-shirt sizing
+      ### x/x/2024 - Version 8.0.0
+      #### Spectrum 2 release
+      Field label now uses Spectrum 2 tokens and specifications. A few notable changes and additions:
+      - The medium size styles are used by default, so the `spectrum-FieldLabel--sizeM` class is no longer necessary and has been removed.
+      - Two variant classes have been added for black and white static colors.
+      - The mod custom property `--mod-disabled-content-color` has been renamed to `--mod-field-label-disabled-content-color`.
+
+      ### 11/13/2020 - Version 3.0.0
+      #### T-shirt sizing
       Field label now supports t-shirt sizing and requires that you specify the size by adding a `.spectrum-FieldLabel--size*` class.
 examples:
   - id: fieldlabel-sizing
@@ -14,75 +22,82 @@ examples:
     markup: |
       <div class="spectrum-Examples">
         <div class="spectrum-Examples-item">
-          <h4 class="spectrum-Heading spectrum-Heading--sizeXS spectrum-Examples-itemHeading">S</h4>
+          <h4 class="spectrum-Heading spectrum-Heading--sizeXS spectrum-Examples-itemHeading">Small</h4>
 
-          <label for="lifestory" class="spectrum-FieldLabel spectrum-FieldLabel--sizeS">Life story</label>
+          <label for="lifestory-s" class="spectrum-FieldLabel spectrum-FieldLabel--sizeS">Life story</label>
           <div class="spectrum-Textfield">
-            <input id="lifestory" name="field" value="" class="spectrum-Textfield-input">
+            <input id="lifestory-s" name="field" value="" class="spectrum-Textfield-input">
           </div>
         </div>
         <div class="spectrum-Examples-item">
-          <h4 class="spectrum-Heading spectrum-Heading--sizeXS spectrum-Examples-itemHeading">M (default)</h4>
+          <h4 class="spectrum-Heading spectrum-Heading--sizeXS spectrum-Examples-itemHeading">Medium (default)</h4>
 
-          <label for="lifestory" class="spectrum-FieldLabel spectrum-FieldLabel--sizeM">Life story</label>
+          <label for="lifestory-m" class="spectrum-FieldLabel">Life story</label>
           <div class="spectrum-Textfield">
-            <input id="lifestory" name="field" value="" class="spectrum-Textfield-input">
+            <input id="lifestory-m" name="field" value="" class="spectrum-Textfield-input">
           </div>
         </div>
 
         <div class="spectrum-Examples-item">
-          <h4 class="spectrum-Heading spectrum-Heading--sizeXS spectrum-Examples-itemHeading">L</h4>
+          <h4 class="spectrum-Heading spectrum-Heading--sizeXS spectrum-Examples-itemHeading">Large</h4>
 
-          <label for="lifestory" class="spectrum-FieldLabel spectrum-FieldLabel--sizeL">Life story</label>
+          <label for="lifestory-l" class="spectrum-FieldLabel spectrum-FieldLabel--sizeL">Life story</label>
           <div class="spectrum-Textfield">
-            <input id="lifestory" name="field" value="" class="spectrum-Textfield-input">
+            <input id="lifestory-l" name="field" value="" class="spectrum-Textfield-input">
           </div>
         </div>
 
         <div class="spectrum-Examples-item">
-          <h4 class="spectrum-Heading spectrum-Heading--sizeXS spectrum-Examples-itemHeading">XL</h4>
+          <h4 class="spectrum-Heading spectrum-Heading--sizeXS spectrum-Examples-itemHeading">Extra large</h4>
 
-          <label for="lifestory" class="spectrum-FieldLabel spectrum-FieldLabel--sizeXL">Life story</label>
+          <label for="lifestory-xl" class="spectrum-FieldLabel spectrum-FieldLabel--sizeXL">Life story</label>
           <div class="spectrum-Textfield">
-            <input id="lifestory" name="field" value="" class="spectrum-Textfield-input">
+            <input id="lifestory-xl" name="field" value="" class="spectrum-Textfield-input">
           </div>
         </div>
       </div>
   - id: fieldlabel-standard
     name: Standard
     markup: |
-      <label for="lifestory" class="spectrum-FieldLabel spectrum-FieldLabel--sizeM">Life story</label>
+      <label for="lifestory" class="spectrum-FieldLabel">Life story</label>
       <div class="spectrum-Textfield">
         <input id="lifestory" name="field" value="" class="spectrum-Textfield-input">
       </div>
 
-      <label for="lifestory2" class="spectrum-FieldLabel spectrum-FieldLabel--sizeM is-disabled">Life story</label>
+      <label for="lifestory2" class="spectrum-FieldLabel is-disabled">Life story</label>
       <div class="spectrum-Textfield is-disabled">
         <input id="lifestory2" name="field" value="" class="spectrum-Textfield-input" disabled>
       </div>
   - id: fieldlabel-side-left
-    name: Left
-    description: A left aligned Field label.
+    name: Side label with left aligned text
+    description: Labels with either the `spectrum-FieldLabel--left` or `spectrum-FieldLabel--right` class are for positioning the label to the side (inline start) of the form field. The left class sets the text alignment to left.
     markup: |
-      <label for="lifestory3" class="spectrum-FieldLabel spectrum-FieldLabel--sizeM spectrum-FieldLabel--left" style="width: 72px">Life story</label>
+      <label for="lifestory3" class="spectrum-FieldLabel spectrum-FieldLabel--left" style="width: 72px">Life story</label>
 
       <div class="spectrum-Textfield spectrum-Textfield--multiline">
         <textarea id="lifestory3" name="field" value="" class="spectrum-Textfield-input"></textarea>
       </div>
   - id: fieldlabel-side-right
-    name: Right
-    description: A right aligned Field label.
+    name: Side label with right aligned text
+    description: With `spectrum-FieldLabel--right`, the side label is still positioned similarly to the left class, but with the text alignment set to right.
     markup: |
-      <label for="lifestory4" class="spectrum-FieldLabel spectrum-FieldLabel--sizeM spectrum-FieldLabel--right" style="width: 72px">Life story</label>
+      <label for="lifestory4" class="spectrum-FieldLabel spectrum-FieldLabel--right" style="width: 72px">Life story</label>
 
       <div class="spectrum-Textfield spectrum-Textfield--multiline">
         <textarea id="lifestory4" name="field" value="" class="spectrum-Textfield-input"></textarea>
       </div>
   - id: fieldlabel-required
     name: Required
-    description: A Field label for a required field can display either the text "(required)", or an asterisk. If using the asterisk icon, do not leave any space between the label text and the start of the `<svg>` element in the markup, so extra space is not added in addition to the inline margin.
+    description: |
+      A Field label for a required field can display either the text "(required)", or an asterisk.
+      
+      If using the asterisk icon, do not leave any space between the label text and the start of the `<svg>` element in the markup, so extra space is not added in addition to the inline margin. The following UI icon sizes are used for the asterisk:
+        - Asterisk100: Small and medium
+        - Asterisk200: Large
+        - Asterisk300: Extra large
+      
     markup: |
-      <label for="lifestory5" class="spectrum-FieldLabel spectrum-FieldLabel--sizeM">
+      <label for="lifestory5" class="spectrum-FieldLabel">
         Life story<svg
           class="spectrum-Icon spectrum-UIIcon-Asterisk100 spectrum-FieldLabel-requiredIcon" focusable="false" aria-hidden="true">
           <use xlink:href="#spectrum-css-icon-Asterisk100" />
@@ -92,7 +107,7 @@ examples:
         <input id="lifestory5" name="field" value="" class="spectrum-Textfield-input">
       </div>
 
-      <label for="lifestory6" class="spectrum-FieldLabel spectrum-FieldLabel--sizeM">Life story (required)</label>
+      <label for="lifestory6" class="spectrum-FieldLabel">Life story (required)</label>
       <div class="spectrum-Textfield">
         <input id="lifestory6" name="field" value="" class="spectrum-Textfield-input">
       </div>
@@ -100,7 +115,7 @@ examples:
       <br/>
       <br/>
 
-      <label for="lifestory7" class="spectrum-FieldLabel spectrum-FieldLabel--sizeM spectrum-FieldLabel--left">
+      <label for="lifestory7" class="spectrum-FieldLabel spectrum-FieldLabel--left">
         Life story<svg
           class="spectrum-Icon spectrum-UIIcon-Asterisk100 spectrum-FieldLabel-requiredIcon" focusable="false" aria-hidden="true">
           <use xlink:href="#spectrum-css-icon-Asterisk100" />
@@ -110,7 +125,7 @@ examples:
         <textarea id="lifestory7" name="field" value="" class="spectrum-Textfield-input"></textarea>
       </div>
 
-      <label for="lifestory8" class="spectrum-FieldLabel spectrum-FieldLabel--sizeM is-disabled">
+      <label for="lifestory8" class="spectrum-FieldLabel is-disabled">
         Life story<svg
           class="spectrum-Icon spectrum-UIIcon-Asterisk100 spectrum-FieldLabel-requiredIcon" focusable="false" aria-hidden="true">
           <use xlink:href="#spectrum-css-icon-Asterisk100" />
@@ -119,3 +134,29 @@ examples:
       <div class="spectrum-Textfield is-disabled">
         <input id="lifestory8" name="field" value="" class="spectrum-Textfield-input" disabled>
       </div>
+
+  - id: fieldlabel-static-colors
+    name: Static colors
+    markup: |
+      <div style="background-color: rgb(181, 209, 211); color: rgb(181, 209, 211); padding: 15px 20px;">
+        <label for="lifestory6" class="spectrum-FieldLabel spectrum-FieldLabel--staticBlack">
+          Static black label with example background<svg
+            class="spectrum-Icon spectrum-UIIcon-Asterisk100 spectrum-FieldLabel-requiredIcon" focusable="false" aria-hidden="true">
+            <use xlink:href="#spectrum-css-icon-Asterisk100" />
+          </svg>
+        </label>
+        <div class="spectrum-Textfield">
+          <input id="lifestory6" name="field" value="" class="spectrum-Textfield-input">
+        </div>
+      </div>
+      <div style="background-color: rgb(15, 121, 125); color: rgb(15, 121, 125); padding: 15px 20px;">
+        <label for="lifestory7" class="spectrum-FieldLabel spectrum-FieldLabel--staticWhite">
+          Static white label with example background<svg
+            class="spectrum-Icon spectrum-UIIcon-Asterisk100 spectrum-FieldLabel-requiredIcon" focusable="false" aria-hidden="true">
+            <use xlink:href="#spectrum-css-icon-Asterisk100" />
+          </svg>
+        </label>
+        <div class="spectrum-Textfield">
+          <input id="lifestory7" name="field" value="" class="spectrum-Textfield-input">
+        </div>
+      </div>
diff --git a/components/fieldlabel/metadata/form.yml b/components/fieldlabel/metadata/form.yml
index 92375a2152..268c686e10 100644
--- a/components/fieldlabel/metadata/form.yml
+++ b/components/fieldlabel/metadata/form.yml
@@ -1,5 +1,16 @@
 name: Form
 description: Form provides structure and spacing for your form fields.
+sections:
+  - name: Custom Properties API
+    description: |
+      This component can be modified via its `--mod-*` prefixed custom properties. A list of those prefixed custom properties can be found <a class="spectrum-Link" href="https://github.com/adobe/spectrum-css/tree/main/components/fieldlabel/metadata/mods.md">here</a>.
+  - name: Migration Guide
+    description: |
+      ### x/x/2024 - Version 8.0.0
+      #### Spectrum 2 release
+      The renamed mod properties previously marked as deprecated have been removed:
+      - `--mod-tableform-item-block-spacing` has been renamed to `--mod-form-item-block-spacing`
+      - `--mod-tableform-item-block-spacing-labels-above` has been renamed to `--mod-form-item-block-spacing-labels-above`
 examples:
   - id: form-labels-left
     name: Standard - left-aligned text
diff --git a/components/fieldlabel/metadata/mods.md b/components/fieldlabel/metadata/mods.md
index 7d1daa362b..858134dce5 100644
--- a/components/fieldlabel/metadata/mods.md
+++ b/components/fieldlabel/metadata/mods.md
@@ -1,21 +1,19 @@
-| Modifiable custom properties                      |
-| ------------------------------------------------- |
-| `--mod-disabled-content-color`                    |
-| `--mod-field-label-asterisk-vertical-align`       |
-| `--mod-field-label-bottom-to-text`                |
-| `--mod-field-label-text-to-asterisk`              |
-| `--mod-field-label-top-to-text`                   |
-| `--mod-fieldlabel-font-size`                      |
-| `--mod-fieldlabel-font-weight`                    |
-| `--mod-fieldlabel-line-height`                    |
-| `--mod-fieldlabel-line-height-cjk`                |
-| `--mod-fieldlabel-min-height`                     |
-| `--mod-fieldlabel-side-margin-block-start`        |
-| `--mod-fieldlabel-side-padding-right`             |
-| `--mod-form-grid-template-columns`                |
-| `--mod-form-grid-template-columns-labels-above`   |
-| `--mod-form-inline-size`                          |
-| `--mod-form-item-block-spacing`                   |
-| `--mod-form-item-block-spacing-labels-above`      |
-| `--mod-tableform-item-block-spacing`              |
-| `--mod-tableform-item-block-spacing-labels-above` |
+| Modifiable custom properties                    |
+| ----------------------------------------------- |
+| `--mod-field-label-asterisk-vertical-align`     |
+| `--mod-field-label-bottom-to-text`              |
+| `--mod-field-label-disabled-content-color`      |
+| `--mod-field-label-text-to-asterisk`            |
+| `--mod-field-label-top-to-text`                 |
+| `--mod-fieldlabel-font-size`                    |
+| `--mod-fieldlabel-font-weight`                  |
+| `--mod-fieldlabel-line-height`                  |
+| `--mod-fieldlabel-line-height-cjk`              |
+| `--mod-fieldlabel-min-height`                   |
+| `--mod-fieldlabel-side-margin-block-start`      |
+| `--mod-fieldlabel-side-padding-right`           |
+| `--mod-form-grid-template-columns`              |
+| `--mod-form-grid-template-columns-labels-above` |
+| `--mod-form-inline-size`                        |
+| `--mod-form-item-block-spacing`                 |
+| `--mod-form-item-block-spacing-labels-above`    |
diff --git a/components/fieldlabel/package.json b/components/fieldlabel/package.json
index c5c46c0bc4..7c4a2b7173 100644
--- a/components/fieldlabel/package.json
+++ b/components/fieldlabel/package.json
@@ -16,7 +16,7 @@
   "main": "dist/index.css",
   "peerDependencies": {
     "@spectrum-css/icon": ">=4",
-    "@spectrum-css/tokens": ">=13"
+    "@spectrum-css/tokens": "^14.0.0-next.0"
   },
   "devDependencies": {
     "@spectrum-css/component-builder-simple": "^5.0.4"
diff --git a/components/fieldlabel/stories/fieldlabel.stories.js b/components/fieldlabel/stories/fieldlabel.stories.js
index be21243b3e..7bbd533c24 100644
--- a/components/fieldlabel/stories/fieldlabel.stories.js
+++ b/components/fieldlabel/stories/fieldlabel.stories.js
@@ -1,4 +1,4 @@
-// Import the component markup template
+import { html } from "lit";
 import { Template } from "./template";
 
 export default {
@@ -54,6 +54,17 @@ export default {
 			},
 			control: "boolean",
 		},
+		staticColor: {
+			name: "Static color",
+			description: "Variants that can be used when a Field label needs to be placed on top of a colored background or a visual.",
+			type: { name: "string" },
+			table: {
+				type: { summary: "string" },
+				category: "Component",
+			},
+			options: ["black", "white"],
+			control: "select",
+		},
 	},
 	args: {
 		rootClass: "spectrum-FieldLabel",
@@ -100,4 +111,22 @@ WrappingAndRequired.args = {
 	alignment: "left",
 	isRequired: true,
 	style: { width: "200px" },
+};
+
+export const StaticColors = (args) => html`
+	${Template({
+		...args,
+		label: "The black static color class used on a label marked as required",
+		staticColor: "black",
+	})}
+	${Template({
+		...args,
+		label: "The white static color class used on a label marked as required",
+		staticColor: "white",
+	})}
+`;
+StaticColors.storyName = "Static colors";
+StaticColors.args = {
+	alignment: "left",
+	isRequired: true,
 };
\ No newline at end of file
diff --git a/components/fieldlabel/stories/template.js b/components/fieldlabel/stories/template.js
index d92a10156d..6a1ff04b23 100644
--- a/components/fieldlabel/stories/template.js
+++ b/components/fieldlabel/stories/template.js
@@ -1,7 +1,8 @@
 import { html } from "lit";
 import { classMap } from "lit/directives/class-map.js";
-import { styleMap } from "lit/directives/style-map.js";
 import { ifDefined } from "lit/directives/if-defined.js";
+import { styleMap } from "lit/directives/style-map.js";
+import { capitalize, lowerCase } from "lodash-es";
 
 import { Template as Icon } from "@spectrum-css/icon/stories/template.js";
 
@@ -17,6 +18,7 @@ export const Template = ({
 	alignment,
 	isDisabled,
 	isRequired,
+	staticColor,
 	style = {},
 	...globals
 }) => {
@@ -40,13 +42,14 @@ export const Template = ({
 			iconName = "Asterisk100";
 	}
 
-	return html`
+	const labelMarkup = html`
 		<label
 			class=${classMap({
 				[rootClass]: true,
 				[`${rootClass}--size${size?.toUpperCase()}`]:
 					typeof size !== "undefined",
 				[`${rootClass}--${alignment}`]: typeof alignment !== "undefined",
+				[`${rootClass}--static${capitalize(lowerCase(staticColor))}`]: typeof staticColor !== "undefined",
 				"is-disabled": isDisabled,
 				...customClasses.reduce((a, c) => ({ ...a, [c]: true }), {}),
 			})}
@@ -64,4 +67,18 @@ export const Template = ({
 				: ""}
 		</label>
 	`;
+
+	// When using the static color variants, wrap the label in an example element with a background color.
+	return !staticColor
+		? labelMarkup
+		: html`
+			<div
+				style=${styleMap({
+					padding: "1rem",
+					backgroundColor: staticColor === "white" ? "rgb(15, 121, 125)" : staticColor === "black" ? "rgb(181, 209, 211)" : undefined,
+				})}
+			</div>
+				${labelMarkup}
+			</div>
+		`;
 };