diff --git a/files/en-us/web/api/cssfontfeaturevaluesmap/clear/index.md b/files/en-us/web/api/cssfontfeaturevaluesmap/clear/index.md
new file mode 100644
index 000000000000000..ef9f0f632462651
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesmap/clear/index.md
@@ -0,0 +1,64 @@
+---
+title: "CSSFontFeatureValuesMap: clear() method"
+short-title: clear()
+slug: Web/API/CSSFontFeatureValuesMap/clear
+page-type: web-api-instance-method
+browser-compat: api.CSSFontFeatureValuesMap.clear
+---
+
+{{APIRef("CSSOM")}}
+
+The **`clear()`** method of the {{domxref("CSSFontFeatureValuesMap")}} interface removes all declarations in the `CSSFontFeatureValuesMap`.
+
+## Syntax
+
+```js-nolint
+clear()
+```
+
+### Parameters
+
+None.
+
+### Return value
+
+None ({{jsxref("undefined")}}).
+
+## Examples
+
+### Basic usage
+
+The following example removes all the declarations within the [`@swash`](/en-US/docs/Web/CSS/Reference/At-rules/@font-feature-values#swash) feature block. This example is using `@swash` but also works with other [feature value blocks](/en-US/docs/Web/CSS/Reference/At-rules/@font-feature-values#feature_value_blocks).
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @swash {
+    swishy: 1;
+    swashy: 2;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// get the rules
+const myRule = document.styleSheets[0].cssRules[0];
+console.log(myRule.swash.size); // logs 2
+myRule.swash.clear();
+console.log(myRule.swash.size); // logs 0
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- [Map.prototype.clear()](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/clear)
diff --git a/files/en-us/web/api/cssfontfeaturevaluesmap/delete/index.md b/files/en-us/web/api/cssfontfeaturevaluesmap/delete/index.md
new file mode 100644
index 000000000000000..2d5b39085b17b44
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesmap/delete/index.md
@@ -0,0 +1,65 @@
+---
+title: "CSSFontFeatureValuesMap: delete() method"
+short-title: delete()
+slug: Web/API/CSSFontFeatureValuesMap/delete
+page-type: web-api-instance-method
+browser-compat: api.CSSFontFeatureValuesMap.delete
+---
+
+{{APIRef("CSSOM")}}
+
+The **`delete()`** method of the {{domxref("CSSFontFeatureValuesMap")}} interface removes the CSS declaration with the given property in the `CSSFontFeatureValuesMap`.
+
+## Syntax
+
+```js-nolint
+delete(property)
+```
+
+### Parameters
+
+- `property`
+  - : An identifier indicating the declaration to remove.
+
+### Return value
+
+None ({{jsxref("undefined")}}).
+
+## Examples
+
+### Basic usage
+
+The following example deletes the first declaration within the [`@swash`](/en-US/docs/Web/CSS/Reference/At-rules/@font-feature-values#swash) feature block. This example is using `@swash` but also works with other [feature value blocks](/en-US/docs/Web/CSS/Reference/At-rules/@font-feature-values#feature_value_blocks).
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @swash {
+    swishy: 1;
+    swashy: 2;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// get the rules
+const myRule = document.styleSheets[0].cssRules[0];
+console.log(myRule.swash.has("swishy")); // logs true
+myRule.swash.delete("swishy");
+console.log(myRule.swash.has("swishy")); // logs false
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- [Map.prototype.delete()](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/delete)
diff --git a/files/en-us/web/api/cssfontfeaturevaluesmap/entries/index.md b/files/en-us/web/api/cssfontfeaturevaluesmap/entries/index.md
new file mode 100644
index 000000000000000..025fa7788f9e5df
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesmap/entries/index.md
@@ -0,0 +1,65 @@
+---
+title: "CSSFontFeatureValuesMap: entries() method"
+short-title: entries()
+slug: Web/API/CSSFontFeatureValuesMap/entries
+page-type: web-api-instance-method
+browser-compat: api.CSSFontFeatureValuesMap.entries
+---
+
+{{APIRef("CSSOM")}}
+
+The **`entries()`** method of {{domxref("CSSFontFeatureValuesMap")}} instances returns a new [map iterator](/en-US/docs/Web/API/CSSFontFeatureValuesMap/Symbol.iterator) object that contains the `[key, value]` pairs for each declaration in this `CSSFontFeatureValuesMap` in insertion order.
+
+## Syntax
+
+```js-nolint
+entries()
+```
+
+### Parameters
+
+None.
+
+### Return value
+
+A new iterable [iterator object](/en-US/docs/Web/API/CSSFontFeatureValuesMap/Symbol.iterator).
+
+## Examples
+
+### Basic usage
+
+The following example assigns the entries to the `swashes` variable and then logs the first two values. This example is using `@swash` but also works with other [feature value blocks](/en-US/docs/Web/CSS/Reference/At-rules/@font-feature-values#feature_value_blocks).
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @swash {
+    swishy: 1;
+    swashy: 2;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// get the rules
+const myRule = document.styleSheets[0].cssRules[0];
+// get the entries of swash
+const swashes = myRule.swash.entries();
+console.log(swashes.next().value); // logs ["swishy", [1]]
+console.log(swashes.next().value); // logs ["swashy", [2]]
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- [Map.prototype.entries()](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/entries)
diff --git a/files/en-us/web/api/cssfontfeaturevaluesmap/foreach/index.md b/files/en-us/web/api/cssfontfeaturevaluesmap/foreach/index.md
new file mode 100644
index 000000000000000..dbebadbced1d2b6
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesmap/foreach/index.md
@@ -0,0 +1,79 @@
+---
+title: "CSSFontFeatureValuesMap: forEach() method"
+short-title: forEach()
+slug: Web/API/CSSFontFeatureValuesMap/forEach
+page-type: web-api-instance-method
+browser-compat: api.CSSFontFeatureValuesMap.forEach
+---
+
+{{APIRef("CSSOM")}}
+
+The **`forEach()`** method of {{domxref("CSSFontFeatureValuesMap")}} instances executes a provided function once per each key/value pair in this map, in insertion order.
+
+## Syntax
+
+```js-nolint
+forEach(callbackFn)
+forEach(callbackFn, thisArg)
+```
+
+### Parameters
+
+- `callbackFn`
+  - : A function to execute for each entry in the map. The function is called with the following arguments:
+    - `value`
+      - : Value of each iteration.
+    - `key`
+      - : Key of each iteration.
+    - `map`
+      - : The map being iterated.
+- `thisArg` {{optional_inline}}
+  - : A value to use as `this` when executing `callbackFn`.
+
+### Return value
+
+None ({{jsxref("undefined")}}).
+
+## Examples
+
+### Basic usage
+
+The following example logs the `key` and `value` for each entry in the `@swash` rule. This example is using `@swash` but also works with other [feature value blocks](/en-US/docs/Web/CSS/Reference/At-rules/@font-feature-values#feature_value_blocks).
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @swash {
+    swishy: 1;
+    swashy: 2;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// function to be used as callback
+function logSwashes(value, key, map) {
+  console.log(`('${key}') = ${value}`);
+}
+// get the rules
+const myRule = document.styleSheets[0].cssRules[0];
+myRule.swash.forEach(logSwashes);
+// logs:
+// "('swishy') = 1"
+// "('swashy') = 2"
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- [Map.prototype.forEach()](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/forEach)
diff --git a/files/en-us/web/api/cssfontfeaturevaluesmap/get/index.md b/files/en-us/web/api/cssfontfeaturevaluesmap/get/index.md
new file mode 100644
index 000000000000000..68ec3bfe6ca4fb1
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesmap/get/index.md
@@ -0,0 +1,64 @@
+---
+title: "CSSFontFeatureValuesMap: get() method"
+short-title: get()
+slug: Web/API/CSSFontFeatureValuesMap/get
+page-type: web-api-instance-method
+browser-compat: api.CSSFontFeatureValuesMap.get
+---
+
+{{APIRef("CSSOM")}}
+
+The **`get()`** method of the {{domxref("CSSFontFeatureValuesMap")}} interface returns value corresponding to the key in this `CSSFontFeatureValuesMap`, or `undefined` if there is none.
+
+## Syntax
+
+```js-nolint
+get(property)
+```
+
+### Parameters
+
+- `key`
+  - : The key of the value to return from the `CSSFontFeatureValuesMap` object.
+
+### Return value
+
+Returns `true` if an entry with the specified key exists in the `CSSFontFeatureValuesMap` object; otherwise `false`.
+
+## Examples
+
+### Basic usage
+
+The following example gets the values that match the `key`s in the `@swash` rule. This example is using `@swash` but also works with other [feature value blocks](/en-US/docs/Web/CSS/Reference/At-rules/@font-feature-values#feature_value_blocks).
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @swash {
+    swishy: 1;
+    swashy: 2;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// get the rules
+const myRule = document.styleSheets[0].cssRules[0];
+console.log(myRule.swash.get("swishy")); // logs [1]
+console.log(myRule.swash.get("swashy")); // logs [2]
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- [Map.prototype.get()](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/get)
diff --git a/files/en-us/web/api/cssfontfeaturevaluesmap/has/index.md b/files/en-us/web/api/cssfontfeaturevaluesmap/has/index.md
new file mode 100644
index 000000000000000..dce81473eee88c1
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesmap/has/index.md
@@ -0,0 +1,64 @@
+---
+title: "CSSFontFeatureValuesMap: has() method"
+short-title: has()
+slug: Web/API/CSSFontFeatureValuesMap/has
+page-type: web-api-instance-method
+browser-compat: api.CSSFontFeatureValuesMap.has
+---
+
+{{APIRef("CSSOM")}}
+
+The **`has()`** method of the {{domxref("CSSFontFeatureValuesMap")}} interface returns a boolean indicating whether an entry with the specified key exists in this `CSSFontFeatureValuesMap` or not.
+
+## Syntax
+
+```js-nolint
+has(property)
+```
+
+### Parameters
+
+- `key`
+  - : The key of the value to return from the `CSSFontFeatureValuesMap` object.
+
+### Return value
+
+The value associated with the specified key in the `CSSFontFeatureValuesMap` object. If the key can't be found, [undefined](/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined) is returned.
+
+## Examples
+
+### Basic usage
+
+The following example returns `true` or `false` if the `@swash` rule contains the `key`. This example is using `@swash` but also works with other [feature value blocks](/en-US/docs/Web/CSS/Reference/At-rules/@font-feature-values#feature_value_blocks).
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @swash {
+    swishy: 1;
+    swashy: 2;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// get the rules
+const myRule = document.styleSheets[0].cssRules[0];
+console.log(myRule.swash.has("swishy")); // logs true
+console.log(myRule.swash.has("swooshy")); // logs false
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- [Map.prototype.has()](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/has)
diff --git a/files/en-us/web/api/cssfontfeaturevaluesmap/index.md b/files/en-us/web/api/cssfontfeaturevaluesmap/index.md
new file mode 100644
index 000000000000000..77c04b8f98fd979
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesmap/index.md
@@ -0,0 +1,143 @@
+---
+title: CSSFontFeatureValuesMap
+slug: Web/API/CSSFontFeatureValuesMap
+page-type: web-api-interface
+browser-compat: api.CSSFontFeatureValuesMap
+---
+
+{{APIRef("CSSOM")}}
+
+The **`CSSFontFeatureValuesMap`** interface of the [CSS Object Model (CSSOM)](/en-US/docs/Web/API/CSS_Object_Model) represents an iterable and read-only set of the [CSSFontFeatureValuesRule](/en-US/docs/Web/API/CSSFontFeatureValuesRule) properties, such as [`swash`](/en-US/docs/Web/API/CSSFontFeatureValuesRule/swash), [`annotation`](/en-US/docs/Web/API/CSSFontFeatureValuesRule/annotation), [`ornaments`](/en-US/docs/Web/API/CSSFontFeatureValuesRule/ornaments), etc.
+
+An `CSSFontFeatureValuesMap` instance is a read-only [Map-like object](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map#map-like_browser_apis), in which each key is the user-defined name used to reference a font feature, and the corresponding value is the index for the font feature within the font.
+
+## Instance property
+
+- {{domxref('CSSFontFeatureValuesMap.size')}}
+  - : Returns a positive integer containing the size of the `CSSFontFeatureValuesMap` object.
+
+## Instance Method
+
+- {{domxref('CSSFontFeatureValuesMap.clear()')}}
+  - : Removes all declarations in the `CSSFontFeatureValuesMap`.
+- {{domxref('CSSFontFeatureValuesMap.delete()')}}
+  - : Removes the CSS declaration with the given property in the `CSSFontFeatureValuesMap`.
+- {{domxref('CSSFontFeatureValuesMap.entries()')}}
+  - : Returns a new [map iterator](/en-US/docs/Web/API/CSSFontFeatureValuesMap/Symbol.iterator) object that contains the `[key, value]` pairs for each declaration in this `CSSFontFeatureValuesMap` in insertion order.
+- {{domxref('CSSFontFeatureValuesMap.forEach()')}}
+  - : Executes a provided function once per each key/value pair in this `CSSFontFeatureValuesMap` in insertion order.
+- {{domxref('CSSFontFeatureValuesMap.get()')}}
+  - : Returns value corresponding to the key in this `CSSFontFeatureValuesMap`, or `undefined` if there is none.
+- {{domxref('CSSFontFeatureValuesMap.has()')}}
+  - : Returns a boolean indicating whether an entry with the specified key exists in this `CSSFontFeatureValuesMap` or not.
+- {{domxref('CSSFontFeatureValuesMap.keys()')}}
+  - : Returns a new [map iterator](/en-US/docs/Web/API/CSSFontFeatureValuesMap/Symbol.iterator) object that contains the `key` for each declaration in this `CSSFontFeatureValuesMap` in insertion order.
+- {{domxref('CSSFontFeatureValuesMap.set()')}}
+  - : Adds a new entry with a specified key and value to this `CSSFontFeatureValuesMap`, or updates an existing entry if the key already exists.
+- {{domxref('CSSFontFeatureValuesMap.values()')}}
+  - : Returns a new [map iterator](/en-US/docs/Web/API/CSSFontFeatureValuesMap/Symbol.iterator) object that contains the `value` for each declaration in this `CSSFontFeatureValuesMap` in insertion order.
+- [`CSSFontFeatureValuesMap.[Symbol.iterator]()`](/en-US/docs/Web/API/CSSFontFeatureValuesMap/Symbol.iterator)
+  - : Returns the iterator object itself. This allows iterator objects to also be iterable.
+
+## Examples
+
+### Logging user-defined names
+
+This example shows how you can log the user-defined names (and their mapped index) stored in a `CSSFontFeatureValuesMap` (for particular `CSSFontFeatureValuesRule` properties).
+
+#### CSS
+
+First we declare a {{cssxref("@font-feature-values")}} for the _Font One_ font family.
+This includes the declaration of the names "nice-style" and "odd-style" that can be used to represent the `styleset` alternate glyphs for _Font One_ and specify the index values for those alternates.
+It also includes the declaration of the name "swishy" that can be used to represent the `swash` alternate glyphs for _Font One_ and specify the index for that alternate.
+
+The "nice-style" alternate glpyhs are then applied for any `.nice-look` class, using {{CSSXRef("font-variant-alternates")}} property and passing the name to the [`styleset()`](/en-US/docs/Web/CSS/Reference/Properties/font-variant-alternates#styleset) function.
+The same is done for the name "swishy" for the `swash` alternate glyphs, which is then passed to the [`swash()`](/en-US/docs/Web/CSS/Reference/Properties/font-variant-alternates#swash) function.
+The "odd-style" glyphs are not used (they are just added to demonstrate that multiple values may be defined in the map.)
+
+```css
+/* At-rule for "nice-style", "odd-style", and "swishy" in Font One */
+@font-feature-values Font One {
+  @styleset {
+    nice-style: 12; /* name used to represent the alternate set of glyphs at index 12 */
+    odd-style: 10; /* name used to represent the alternate set of glyphs at index 10 */
+  }
+  @swash {
+    swishy: 1; /* name used to represent the alternate set of glyphs at index 1 */
+  }
+}
+
+/* Apply the at-rules to the appropriate selectors */
+.nice-look {
+  font-variant-alternates: styleset(nice-style);
+}
+.swoosh {
+  font-variant-alternates: swash(swishy);
+}
+```
+
+```html hidden
+<pre id="log"></pre>
+```
+
+```css hidden
+#log {
+  height: 100px;
+  overflow: scroll;
+  padding: 0.5rem;
+  border: 1px solid black;
+}
+```
+
+#### JavaScript
+
+The code below finds the corresponding `CSSFontFeatureValuesRule` for the CSS `@font-feature-values` at-rule added above.
+It then iterates the values of the `styleset` and `swash` properties, which are represented by `CSSFontFeatureValuesMap` instances, using the [`forEach()`](/en-US/docs/Web/API/CSSFontFeatureValuesMap/forEach) method.
+On each step it logs the user-defined names and index values.
+
+```js
+const logElement = document.querySelector("#log");
+function log(text) {
+  logElement.innerText = `${logElement.innerText}${text}\n`;
+  logElement.scrollTop = logElement.scrollHeight;
+}
+```
+
+```js
+const rules = document.querySelector("#css-output").sheet.cssRules;
+const fontOne = rules[0]; // A CSSFontFeatureValuesRule
+if (fontOne.styleset) {
+  // styleset property is supported
+  log(
+    "The user has defined the following name(s)/index(s) for CSSFontFeatureValuesRule.styleset:",
+  );
+  fontOne.styleset.forEach((value, key) => log(` ${key} : ${value}`));
+} else {
+  log("Browser does not support CSSFontFeatureValuesMap.styleset property.");
+}
+
+if (fontOne.swash) {
+  log(
+    "The user has defined the following name(s)/index(s) for CSSFontFeatureValuesRule.swash:",
+  );
+  fontOne.swash.forEach((value, key) => log(` ${key} : ${value}`));
+} else {
+  log("Browser does not support CSSFontFeatureValuesMap.swash property.");
+}
+```
+
+#### Result
+
+{{EmbedLiveSample("Logging user-defined names", "100%", "200px")}}
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{cssxref("@font-feature-values")}}
diff --git a/files/en-us/web/api/cssfontfeaturevaluesmap/keys/index.md b/files/en-us/web/api/cssfontfeaturevaluesmap/keys/index.md
new file mode 100644
index 000000000000000..e6b687cfcbb78e4
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesmap/keys/index.md
@@ -0,0 +1,65 @@
+---
+title: "CSSFontFeatureValuesMap: keys() method"
+short-title: keys()
+slug: Web/API/CSSFontFeatureValuesMap/keys
+page-type: web-api-instance-method
+browser-compat: api.CSSFontFeatureValuesMap.keys
+---
+
+{{APIRef("CSSOM")}}
+
+The **`keys()`** method of {{domxref("CSSFontFeatureValuesMap")}} instances returns a new [map iterator](/en-US/docs/Web/API/CSSFontFeatureValuesMap/Symbol.iterator) object that contains the `[key, value]` pairs for each declaration in this `CSSFontFeatureValuesMap` in insertion order.
+
+## Syntax
+
+```js-nolint
+keys()
+```
+
+### Parameters
+
+None.
+
+### Return value
+
+A new iterable [iterator object](/en-US/docs/Web/API/CSSFontFeatureValuesMap/Symbol.iterator).
+
+## Examples
+
+### Basic usage
+
+The following example assigns the keys to the `swashKeys` variable and then logs the first two values. This example is using `@swash` but also works with other [feature value blocks](/en-US/docs/Web/CSS/Reference/At-rules/@font-feature-values#feature_value_blocks).
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @swash {
+    swishy: 1;
+    swashy: 2;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// get the rules
+const myRule = document.styleSheets[0].cssRules[0];
+// get the keys of swash
+const swashKeys = myRule.swash.keys();
+console.log(swashKeys.next().value); // logs "swishy"
+console.log(swashKeys.next().value); // logs "swashy"
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- [Map.prototype.keys()](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/keys)
diff --git a/files/en-us/web/api/cssfontfeaturevaluesmap/set/index.md b/files/en-us/web/api/cssfontfeaturevaluesmap/set/index.md
new file mode 100644
index 000000000000000..af31052dda31069
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesmap/set/index.md
@@ -0,0 +1,77 @@
+---
+title: "CSSFontFeatureValuesMap: set() method"
+short-title: set()
+slug: Web/API/CSSFontFeatureValuesMap/set
+page-type: web-api-instance-method
+browser-compat: api.CSSFontFeatureValuesMap.set
+---
+
+{{APIRef("CSSOM")}}
+
+The **`set()`** method of {{domxref("CSSFontFeatureValuesMap")}} instances adds a new entry with a specified key and value to this `CSSFontFeatureValuesMap`, or updates an existing entry if the key already exists.
+
+## Syntax
+
+```js-nolint
+set(key, value)
+```
+
+### Parameters
+
+- `key`
+  - : The key of the entry to add to or modify within the `CSSFontFeatureValuesMap` object. Can be any value.
+- `value`
+  - : The value of the entry to add to or modify within the `CSSFontFeatureValuesMap` object. Must be an integer that matches the `index` of the alternative font feature.
+
+### Return value
+
+The `CSSFontFeatureValuesMap` object.
+
+## Examples
+
+### Basic usage
+
+The following example updates the value for `swashy` and adds a third declaration. This example is using `@swash` but also works with other [feature value blocks](/en-US/docs/Web/CSS/Reference/At-rules/@font-feature-values#feature_value_blocks).
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @swash {
+    swishy: 1;
+    swashy: 2;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+function logSwashes(value, key) {
+  console.log(`('${key}') = ${value}`);
+}
+// get the rules
+const myRule = document.styleSheets[0].cssRules[0];
+// log current swashes
+myRule.swash.forEach(logSwashes); // logs "('swishy') = 1", "('swashy') = 2"
+
+// update swash with the key swashy
+myRule.swash.set("swashy", 3);
+myRule.swash.forEach(logSwashes); // logs "('swishy') = 1", "('swashy') = 3"
+
+// add new swash with the key swooshy
+myRule.swash.set("swooshy", 2);
+myRule.swash.forEach(logSwashes); // logs "('swishy') = 1", "('swooshy') = 2", "('swashy') = 3"
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- [Map.prototype.keys()](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/set)
diff --git a/files/en-us/web/api/cssfontfeaturevaluesmap/size/index.md b/files/en-us/web/api/cssfontfeaturevaluesmap/size/index.md
new file mode 100644
index 000000000000000..39bc267ae9c6171
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesmap/size/index.md
@@ -0,0 +1,48 @@
+---
+title: "CSSFontFeatureValuesMap: size property"
+short-title: size
+slug: Web/API/CSSFontFeatureValuesMap/size
+page-type: web-api-instance-property
+browser-compat: api.CSSFontFeatureValuesMap.size
+---
+
+{{APIRef("CSSOM")}}
+
+The **`size`** read-only property of the {{domxref("CSSFontFeatureValuesMap")}} interface returns a positive integer containing the size of the `CSSFontFeatureValuesMap` object.
+
+## Value
+
+A positive integer.
+
+## Examples
+
+### Basic usage
+
+The following example outputs an integer of the number of the declarations within the [`@swash`](/en-US/docs/Web/CSS/Reference/At-rules/@font-feature-values#swash) feature block. This example is using `@swash` but also works with other [feature value blocks](/en-US/docs/Web/CSS/Reference/At-rules/@font-feature-values#feature_value_blocks).
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @swash {
+    swishy: 1;
+    swashy: 2;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// get the rules
+const myRule = document.styleSheets[0].cssRules[0];
+console.log(myRule.swash.size); // logs 2
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
diff --git a/files/en-us/web/api/cssfontfeaturevaluesmap/symbol.iterator/index.md b/files/en-us/web/api/cssfontfeaturevaluesmap/symbol.iterator/index.md
new file mode 100644
index 000000000000000..0ad362b493fb735
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesmap/symbol.iterator/index.md
@@ -0,0 +1,66 @@
+---
+title: "CSSFontFeatureValuesMap: [Symbol.iterator]() method"
+short-title: "[Symbol.iterator]()"
+slug: Web/API/CSSFontFeatureValuesMap/Symbol.iterator
+page-type: web-api-instance-method
+browser-compat: api.CSSFontFeatureValuesMap.@@iterator
+---
+
+{{APIRef("CSSOM")}}
+
+The **`[Symbol.iterator]()`** method of {{domxref("CSSFontFeatureValuesMap")}} interface implements the [iterable protocol](/en-US/docs/Web/JavaScript/Reference/Iteration_protocols) and allows built-in iterators to be consumed by most syntaxes expecting iterables, such as the [spread syntax](/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax) and {{jsxref("Statements/for...of", "for...of")}} loops. It returns the value of [`this`](/en-US/docs/Web/JavaScript/Reference/Operators/this), which is the iterator object itself.
+
+## Syntax
+
+```js-nolint
+iterator[Symbol.iterator]()
+```
+
+### Parameters
+
+None.
+
+### Return value
+
+The value of [`this`](/en-US/docs/Web/JavaScript/Reference/Operators/this), which is the iterator object itself.
+
+## Examples
+
+### Basic usage
+
+The following example uses the built-in iterator of `CSSFontFeatureValuesMap` to log the values using a `for...of` loop. This example is using `@swash` but also works with other [feature value blocks](/en-US/docs/Web/CSS/Reference/At-rules/@font-feature-values#feature_value_blocks).
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @swash {
+    swishy: 1;
+    swashy: 2;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// get the rules
+const myRule = document.styleSheets[0].cssRules[0];
+for (const value of myRule.swash.keys()) {
+  console.log(value);
+}
+// Logs: "swishy", "swashy"
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- [`Iterator.prototype[Symbol.iterator]()`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Iterator/Symbol.iterator)
+- {{jsxref("Iterator")}}
diff --git a/files/en-us/web/api/cssfontfeaturevaluesmap/values/index.md b/files/en-us/web/api/cssfontfeaturevaluesmap/values/index.md
new file mode 100644
index 000000000000000..d978507625a12d9
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesmap/values/index.md
@@ -0,0 +1,65 @@
+---
+title: "CSSFontFeatureValuesMap: values() method"
+short-title: values()
+slug: Web/API/CSSFontFeatureValuesMap/values
+page-type: web-api-instance-method
+browser-compat: api.CSSFontFeatureValuesMap.values
+---
+
+{{APIRef("CSSOM")}}
+
+The **`values()`** method of {{domxref("CSSFontFeatureValuesMap")}} instances returns a new [map iterator](/en-US/docs/Web/API/CSSFontFeatureValuesMap/Symbol.iterator) object that contains the `[key, value]` pairs for each declaration in this `CSSFontFeatureValuesMap` in insertion order.
+
+## Syntax
+
+```js-nolint
+values()
+```
+
+### Parameters
+
+None.
+
+### Return value
+
+A new iterable [iterator object](/en-US/docs/Web/API/CSSFontFeatureValuesMap/Symbol.iterator).
+
+## Examples
+
+### Basic usage
+
+The following example assigns the values to the `swashValues` variable and then logs the first two values. This example is using `@swash` but also works with other [feature value blocks](/en-US/docs/Web/CSS/Reference/At-rules/@font-feature-values#feature_value_blocks).
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @swash {
+    swishy: 1;
+    swashy: 2;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// get the rules
+const myRule = document.styleSheets[0].cssRules[0];
+// get the values of swash
+const swashValues = myRule.swash.values();
+console.log(swashValues.next().value); // logs [1]
+console.log(swashValues.next().value); // logs [2]
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- [Map.prototype.values()](/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/values)
diff --git a/files/en-us/web/api/cssfontfeaturevaluesrule/annotation/index.md b/files/en-us/web/api/cssfontfeaturevaluesrule/annotation/index.md
new file mode 100644
index 000000000000000..679fbbafc50f365
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesrule/annotation/index.md
@@ -0,0 +1,56 @@
+---
+title: "CSSFontFeatureValuesRule: annotation property"
+short-title: annotation
+slug: Web/API/CSSFontFeatureValuesRule/annotation
+page-type: web-api-instance-property
+browser-compat: api.CSSFontFeatureValuesRule.annotation
+---
+
+{{ APIRef("CSSOM") }}
+
+The read-only **annotation** property of the {{domXRef("CSSFontFeatureValuesRule")}} interface contains a {{domXRef("CSSFontFeatureValuesMap")}} object representing the [user-defined-ident](/en-US/docs/Web/CSS/Reference/Values/custom-ident) and [feature index](/en-US/docs/Web/CSS/Reference/Properties/font-feature-settings#optional_value) for a variable font which supports {{CSSXRef("font-variant-alternates", "annotation()", "#annotation")}}.
+
+## Value
+
+A {{domxref("CSSFontFeatureValuesMap")}} object.
+
+Although the `annotation` property itself is read-only in the sense that you can't replace the `CSSFontFeatureValuesMap` object, you can still assign to the `annotation` property directly. You can also modify the values of the `annotation` using the [`CSSFontFeatureValuesMap` instance methods](/en-US/docs/Web/API/CSSFontFeatureValuesMap#instance_methods).
+
+## Examples
+
+### Basic usage
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @annotation {
+    my-annotations: 1;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// look for the first stylesheet and the first cssRule in that sheet
+const myRule = document.styleSheets[0].cssRules[0];
+// check
+if (myRule instanceof CSSFontFeatureValuesRule && myRule.annotation.size) {
+  // do something with the annotation
+}
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{cssxRef("@font-feature-values","@annotation","#annotation")}}
+- {{cssxRef("font-variant-alternates","annotation()","#annotation")}} functional notation
+- {{domxref("CSSFontFeatureValuesMap")}}
diff --git a/files/en-us/web/api/cssfontfeaturevaluesrule/charactervariant/index.md b/files/en-us/web/api/cssfontfeaturevaluesrule/charactervariant/index.md
new file mode 100644
index 000000000000000..28567c777210ee3
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesrule/charactervariant/index.md
@@ -0,0 +1,59 @@
+---
+title: "CSSFontFeatureValuesRule: characterVariant property"
+short-title: characterVariant
+slug: Web/API/CSSFontFeatureValuesRule/characterVariant
+page-type: web-api-instance-property
+browser-compat: api.CSSFontFeatureValuesRule.characterVariant
+---
+
+{{ APIRef("CSSOM") }}
+
+The read-only **characterVariant** property of the {{domXRef("CSSFontFeatureValuesRule")}} interface contains a {{domXRef("CSSFontFeatureValuesMap")}} object representing the [user-defined-ident](/en-US/docs/Web/CSS/Reference/Values/custom-ident) and [feature index](/en-US/docs/Web/CSS/Reference/Properties/font-feature-settings#optional_value) for a variable font which supports {{CSSXRef("font-variant-alternates", "characterVariant()", "#characterVariant")}}.
+
+## Value
+
+A {{domxref("CSSFontFeatureValuesMap")}} object.
+
+Although the `characterVariant` property itself is read-only in the sense that you can't replace the `CSSFontFeatureValuesMap` object, you can still assign to the `characterVariant` property directly. You can also modify the values of the `characterVariant` using the [`CSSFontFeatureValuesMap` instance methods](/en-US/docs/Web/API/CSSFontFeatureValuesMap#instance_methods).
+
+## Examples
+
+### Basic usage
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @charactervariant {
+    my-charactervariant: 1;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// look for the first stylesheet and the first cssRule in that sheet
+const myRule = document.styleSheets[0].cssRules[0];
+// check
+if (
+  myRule instanceof CSSFontFeatureValuesRule &&
+  myRule.characterVariant.size
+) {
+  // do something with the characterVariant
+}
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{cssxRef("@font-feature-values","@character-variant","#character-variant")}}
+- {{cssxRef("font-variant-alternates","character-variant()","#character-variant")}} functional notation
+- {{domxref("CSSFontFeatureValuesMap")}}
diff --git a/files/en-us/web/api/cssfontfeaturevaluesrule/fontfamily/index.md b/files/en-us/web/api/cssfontfeaturevaluesrule/fontfamily/index.md
index ac89749c2e59b17..2b8e4d64be3fb4c 100644
--- a/files/en-us/web/api/cssfontfeaturevaluesrule/fontfamily/index.md
+++ b/files/en-us/web/api/cssfontfeaturevaluesrule/fontfamily/index.md
@@ -8,7 +8,7 @@ browser-compat: api.CSSFontFeatureValuesRule.fontFamily
 
 {{ APIRef("CSSOM") }}
 
-The **`fontFamily`** property of the {{domxref("CSSConditionRule")}} interface represents the name of the font family it applies to.
+The **`fontFamily`** property of the {{domxref("CSSFontFeatureValuesRule")}} interface represents the name of the font family it applies to.
 
 ## Value
 
diff --git a/files/en-us/web/api/cssfontfeaturevaluesrule/index.md b/files/en-us/web/api/cssfontfeaturevaluesrule/index.md
index 3692ffb9db07773..c1c3ec54178023a 100644
--- a/files/en-us/web/api/cssfontfeaturevaluesrule/index.md
+++ b/files/en-us/web/api/cssfontfeaturevaluesrule/index.md
@@ -7,7 +7,11 @@ browser-compat: api.CSSFontFeatureValuesRule
 
 {{APIRef("CSSOM")}}
 
-The **`CSSFontFeatureValuesRule`** interface represents an {{cssxref("@font-feature-values")}} [at-rule](/en-US/docs/Web/CSS/Guides/Syntax/At-rules), letting developers assign for each font face a common name to specify features indices to be used in {{cssxref("font-variant-alternates")}}.
+The **`CSSFontFeatureValuesRule`** interface represents an {{cssxref("@font-feature-values")}} [at-rule](/en-US/docs/Web/CSS/Guides/Syntax/At-rules). The values of its instance properties can be accessed with the [`CSSFontFeatureValuesMap`](/en-US/docs/Web/API/CSSFontFeatureValuesMap)interface.
+
+`@font-feature-values` allows developers to associate, for a given font face, a human-readable name with a numeric index that controls a particular [OpenType font feature](/en-US/docs/Web/CSS/Guides/Fonts/OpenType_fonts).
+For features that select alternative glyphs (stylistic, styleset, character-variant, swash, ornament or annotation), the {{cssxref("font-variant-alternates")}} property can then reference the human-readable name in order to apply the associated feature.
+This is convenient, because it allows the same name to be used of represent a set of alternative glyphs across a number of fonts.
 
 {{InheritanceDiagram}}
 
@@ -15,8 +19,20 @@ The **`CSSFontFeatureValuesRule`** interface represents an {{cssxref("@font-feat
 
 _Inherits properties from its ancestor {{domxref("CSSRule")}}._
 
+- {{domxref("CSSFontFeatureValuesRule.annotation")}}
+  - : A user defined value definition and value that applies an alternate annotation of the font.
+- {{domxref("CSSFontFeatureValuesRule.characterVariant")}}
+  - : A user defined value definition and value that applies a stylistic alternatives for characters of the font.
 - {{domxref("CSSFontFeatureValuesRule.fontFamily")}}
   - : A string that identifies the font family this rule applies to.
+- {{domxref("CSSFontFeatureValuesRule.ornaments")}}
+  - : A user defined value definition and value that applies alternative ornaments of the font.
+- {{domxref("CSSFontFeatureValuesRule.styleset")}}
+  - : A user defined value definition and value that applies alternate style sets of the font.
+- {{domxref("CSSFontFeatureValuesRule.stylistic")}}
+  - : A user defined value definition and value that applies alternative glyphs of the font.
+- {{domxref("CSSFontFeatureValuesRule.swash")}}
+  - : A user defined value definition and value that applies alternative swashes of the font.
 
 ## Instance methods
 
@@ -26,13 +42,11 @@ _Inherits methods from its ancestor {{domxref("CSSRule")}}._
 
 ### Read font family
 
-In this example, we declare two {{cssxref("@font-feature-values")}} one for the _Font One_ font family, and the other for _Font Two_. We then use the CSSOM to read these font families, displaying them into the log.
-
-#### HTML
+In this example, we declare two {{cssxref("@font-feature-values")}} one for the _Font One_ font family, and the other for _Font Two_.
+In both declarations we define that the name "nice-style" can be used to represent the styleset alternate glyphs for both of the fonts, specifying the index for that alternate in each font family.
+The alternate glpyhs are then applied for any `.nice-look` class, using {{cssxref("font-variant-alternates")}} and passing the name to the [`styleset()`](/en-US/docs/Web/CSS/Reference/Properties/font-variant-alternates#styleset) function.
 
-```html
-<pre id="log"></pre>
-```
+We then use the CSSOM to read these declaration as `CSSFontFeatureValuesRule` instances, displaying them into the log.
 
 #### CSS
 
@@ -40,7 +54,7 @@ In this example, we declare two {{cssxref("@font-feature-values")}} one for the
 /* At-rule for "nice-style" in Font One */
 @font-feature-values Font One {
   @styleset {
-    nice-style: 12;
+    nice-style: 12; /* name used to represent the alternate set of glyphs at index 12 */
   }
 }
 
@@ -53,24 +67,46 @@ In this example, we declare two {{cssxref("@font-feature-values")}} one for the
 
 /* Apply the at-rules with a single declaration */
 .nice-look {
-  font-variant-alternates: styleset(nice-style);
+  font-variant-alternates: styleset(
+    nice-style
+  ); /* name selects different index for same alternate in different fonts */
+}
+```
+
+```html hidden
+<pre id="log"></pre>
+```
+
+```css hidden
+#log {
+  height: 40px;
+  overflow: scroll;
+  padding: 0.5rem;
+  border: 1px solid black;
 }
 ```
 
 #### JavaScript
 
 ```js
-const log = document.getElementById("log");
+const logElement = document.querySelector("#log");
+function log(text) {
+  logElement.innerText = `${logElement.innerText}${text}\n`;
+  logElement.scrollTop = logElement.scrollHeight;
+}
+```
+
+```js
 const rules = document.getElementById("css-output").sheet.cssRules;
 
 const fontOne = rules[0]; // A CSSFontFeatureValuesRule
-log.textContent = `The 1st '@font-feature-values' family: "${fontOne.fontFamily}".\n`;
+log(`The 1st '@font-feature-values' family: "${fontOne.fontFamily}".`);
 
 const fontTwo = rules[1]; // Another CSSFontFeatureValuesRule
-log.textContent += `The 2nd '@font-feature-values' family: "${fontTwo.fontFamily}".`;
+log(`The 2nd '@font-feature-values' family: "${fontTwo.fontFamily}"`);
 ```
 
-{{EmbedLiveSample("read_font_family", "100%", "75px")}}
+{{EmbedLiveSample("read_font_family", "100%", "100px")}}
 
 ## Specifications
 
diff --git a/files/en-us/web/api/cssfontfeaturevaluesrule/ornaments/index.md b/files/en-us/web/api/cssfontfeaturevaluesrule/ornaments/index.md
new file mode 100644
index 000000000000000..2baf4bec6da6d8f
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesrule/ornaments/index.md
@@ -0,0 +1,56 @@
+---
+title: "CSSFontFeatureValuesRule: ornaments property"
+short-title: ornaments
+slug: Web/API/CSSFontFeatureValuesRule/ornaments
+page-type: web-api-instance-property
+browser-compat: api.CSSFontFeatureValuesRule.ornaments
+---
+
+{{ APIRef("CSSOM") }}
+
+The read-only **ornaments** property of the {{domXRef("CSSFontFeatureValuesRule")}} interface contains a {{domXRef("CSSFontFeatureValuesMap")}} object representing the [user-defined-ident](/en-US/docs/Web/CSS/Reference/Values/custom-ident) and [feature index](/en-US/docs/Web/CSS/Reference/Properties/font-feature-settings#optional_value) for a variable font which supports {{CSSXRef("font-variant-alternates", "ornaments()", "#ornaments")}}.
+
+## Value
+
+A {{domxref("CSSFontFeatureValuesMap")}} object.
+
+Although the `ornaments` property itself is read-only in the sense that you can't replace the `CSSFontFeatureValuesMap` object, you can still assign to the `ornaments` property directly. You can also modify the values of the `ornaments` using the [`CSSFontFeatureValuesMap` instance methods](/en-US/docs/Web/API/CSSFontFeatureValuesMap#instance_methods).
+
+## Example
+
+### Basic usage
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @ornaments {
+    my-ornaments: 1;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// look for the first stylesheet and the first cssRule in that sheet
+const myRule = document.styleSheets[0].cssRules[0];
+// check
+if (myRule instanceof CSSFontFeatureValuesRule && myRule.ornaments.size) {
+  // do something with the ornaments
+}
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{cssxRef("@font-feature-values","@ornaments","#ornaments")}}
+- {{cssxRef("font-variant-alternates","ornaments()","#ornaments")}} functional notation
+- {{domxref("CSSFontFeatureValuesMap")}}
diff --git a/files/en-us/web/api/cssfontfeaturevaluesrule/styleset/index.md b/files/en-us/web/api/cssfontfeaturevaluesrule/styleset/index.md
new file mode 100644
index 000000000000000..5c77d871a6785c0
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesrule/styleset/index.md
@@ -0,0 +1,56 @@
+---
+title: "CSSFontFeatureValuesRule: styleset property"
+short-title: styleset
+slug: Web/API/CSSFontFeatureValuesRule/styleset
+page-type: web-api-instance-property
+browser-compat: api.CSSFontFeatureValuesRule.styleset
+---
+
+{{ APIRef("CSSOM") }}
+
+The read-only **styleset** property of the {{domXRef("CSSFontFeatureValuesRule")}} interface contains a {{domXRef("CSSFontFeatureValuesMap")}} object representing the [user-defined-ident](/en-US/docs/Web/CSS/Reference/Values/custom-ident) and [feature index](/en-US/docs/Web/CSS/Reference/Properties/font-feature-settings#optional_value) for a variable font which supports {{CSSXRef("font-variant-alternates", "styleset()", "#styleset")}}.
+
+## Value
+
+A {{domxref("CSSFontFeatureValuesMap")}} object.
+
+Although the `styleset` property itself is read-only in the sense that you can't replace the `CSSFontFeatureValuesMap` object, you can still assign to the `styleset` property directly. You can also modify the values of the `styleset` using the [`CSSFontFeatureValuesMap` instance methods](/en-US/docs/Web/API/CSSFontFeatureValuesMap#instance_methods).
+
+## Example
+
+### Basic usage
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @styleset {
+    my-stylesets: 1;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// look for the first stylesheet and the first cssRule in that sheet
+const myRule = document.styleSheets[0].cssRules[0];
+// check
+if (myRule instanceof CSSFontFeatureValuesRule && myRule.styleset.size) {
+  // do something with the styleset
+}
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{cssxRef("@font-feature-values","@styleset","#styleset")}}
+- {{cssxRef("font-variant-alternates","styleset()","#styleset")}} functional notation
+- {{domxref("CSSFontFeatureValuesMap")}}
diff --git a/files/en-us/web/api/cssfontfeaturevaluesrule/stylistic/index.md b/files/en-us/web/api/cssfontfeaturevaluesrule/stylistic/index.md
new file mode 100644
index 000000000000000..e43b0cbe54c94c3
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesrule/stylistic/index.md
@@ -0,0 +1,56 @@
+---
+title: "CSSFontFeatureValuesRule: stylistic property"
+short-title: stylistic
+slug: Web/API/CSSFontFeatureValuesRule/stylistic
+page-type: web-api-instance-property
+browser-compat: api.CSSFontFeatureValuesRule.stylistic
+---
+
+{{ APIRef("CSSOM") }}
+
+The read-only **stylistic** property of the {{domXRef("CSSFontFeatureValuesRule")}} interface contains a {{domXRef("CSSFontFeatureValuesMap")}} object representing the [user-defined-ident](/en-US/docs/Web/CSS/Reference/Values/custom-ident) and [feature index](/en-US/docs/Web/CSS/Reference/Properties/font-feature-settings#optional_value) for a variable font which supports {{CSSXRef("font-variant-alternates", "stylistic()", "#stylistic")}}.
+
+## Value
+
+A {{domxref("CSSFontFeatureValuesMap")}} object.
+
+Although the `stylistic` property itself is read-only in the sense that you can't replace the `CSSFontFeatureValuesMap` object, you can still assign to the `stylistic` property directly. You can also modify the values of the `stylistic` using the [`CSSFontFeatureValuesMap` instance methods](/en-US/docs/Web/API/CSSFontFeatureValuesMap#instance_methods).
+
+## Example
+
+### Basic usage
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @stylistic {
+    my-stylistics: 1;
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// look for the first stylesheet and the first cssRule in that sheet
+const myRule = document.styleSheets[0].cssRules[0];
+// check
+if (myRule instanceof CSSFontFeatureValuesRule && myRule.stylistic.size) {
+  // do something with the stylistic
+}
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{cssxRef("@font-feature-values","@stylistic","#stylistic")}}
+- {{cssxRef("font-variant-alternates","stylistic()","#stylistic")}} functional notation
+- {{domxref("CSSFontFeatureValuesMap")}}
diff --git a/files/en-us/web/api/cssfontfeaturevaluesrule/swash/index.md b/files/en-us/web/api/cssfontfeaturevaluesrule/swash/index.md
new file mode 100644
index 000000000000000..3213d4be3389188
--- /dev/null
+++ b/files/en-us/web/api/cssfontfeaturevaluesrule/swash/index.md
@@ -0,0 +1,56 @@
+---
+title: "CSSFontFeatureValuesRule: swash property"
+short-title: swash
+slug: Web/API/CSSFontFeatureValuesRule/swash
+page-type: web-api-instance-property
+browser-compat: api.CSSFontFeatureValuesRule.swash
+---
+
+{{ APIRef("CSSOM") }}
+
+The read-only **swash** property of the {{domXRef("CSSFontFeatureValuesRule")}} interface contains a {{domXRef("CSSFontFeatureValuesMap")}} object representing the [developer-provided name](/en-US/docs/Web/CSS/Reference/Values/custom-ident) and [feature index](/en-US/docs/Web/CSS/Reference/Properties/font-feature-settings#optional_value) for a variable font which supports {{CSSXRef("font-variant-alternates", "swash()", "#swash")}}.
+
+## Value
+
+A {{domxref("CSSFontFeatureValuesMap")}} object.
+
+Although the `swash` property itself is read-only in the sense that you can't replace the `CSSFontFeatureValuesMap` object, you can still assign to the `swash` property directly. You can also modify the values of the `swash` using the [`CSSFontFeatureValuesMap` instance methods](/en-US/docs/Web/API/CSSFontFeatureValuesMap#instance_methods).
+
+## Example
+
+### Basic usage
+
+#### CSS
+
+```css
+@font-feature-values "MonteCarlo" {
+  @swash {
+    my-swashes: 1; /* Custom name for a particular set of swash alternate glyphs */
+  }
+}
+```
+
+#### JavaScript
+
+```js
+// look for the first stylesheet and the first cssRule in that sheet
+const myRule = document.styleSheets[0].cssRules[0];
+// check
+if (myRule instanceof CSSFontFeatureValuesRule && myRule.swash.size) {
+  // do something with the swash
+}
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{cssxRef("@font-feature-values","@swash","#swash")}}
+- {{cssxRef("font-variant-alternates","swash()","#swash")}} functional notation
+- {{domxref("CSSFontFeatureValuesMap")}}
diff --git a/files/en-us/web/css/guides/cascade/shorthand_properties/index.md b/files/en-us/web/css/guides/cascade/shorthand_properties/index.md
index 4265e17516a4c4a..98c53318a584594 100644
--- a/files/en-us/web/css/guides/cascade/shorthand_properties/index.md
+++ b/files/en-us/web/css/guides/cascade/shorthand_properties/index.md
@@ -5,7 +5,7 @@ page-type: guide
 sidebar: cssref
 ---
 
-**_Shorthand properties_** are CSS properties that let you set the values of multiple other CSS properties simultaneously. Using a shorthand property, you can write more concise (and often more readable) style sheets, saving time and energy.
+**_Shorthand properties_** are CSS properties that let you set the values of multiple other CSS properties in one declaration. Using a shorthand property, you can write more concise (and often more readable) style sheets, saving time and energy.
 
 The CSS specification defines shorthand properties to group the definition of common properties acting on the same theme. For instance, the CSS {{cssxref("background")}} property is a shorthand property that's able to define the values of {{cssxref("background-color")}}, {{cssxref("background-image")}}, {{cssxref("background-repeat")}}, and {{cssxref("background-position")}}. Similarly, the most common font-related properties can be defined using the shorthand {{cssxref("font")}}, and the different margins around a box can be defined using the {{cssxref("margin")}} shorthand.
 
diff --git a/files/en-us/web/css/reference/properties/font-feature-settings/index.md b/files/en-us/web/css/reference/properties/font-feature-settings/index.md
index 70a1e2a7fb16d1b..306b368b8538f32 100644
--- a/files/en-us/web/css/reference/properties/font-feature-settings/index.md
+++ b/files/en-us/web/css/reference/properties/font-feature-settings/index.md
@@ -107,10 +107,10 @@ This property is specified as either the keyword `normal` or as a comma-separate
   - : Indicates that text is laid out using default font settings. This is the default value.
 - `<feature-tag-value>`
   - : Represents a space-separated tuple consisting of a tag name and an optional value.
-
-    The tag name is always a {{cssxref("&lt;string&gt;")}} of four {{Glossary("ASCII")}} characters. If the tag name has more or fewer characters or if it contains characters outside the `U+20` – `U+7E` code point range, the descriptor is invalid.
-
-    The optional value can be a positive integer or the keyword `on` or `off`. The keywords `on` and `off` are synonyms for the values `1` and `0`, respectively. If no value is set, the default is `1`. For non-boolean OpenType features (e.g., [stylistic alternates](https://learn.microsoft.com/en-ca/typography/opentype/spec/features_pt#tag-salt)), the value implies a particular glyph to be selected; for boolean features, the value turns the feature on or off.
+    - Tag name
+      - : The tag name is always a {{cssxref("&lt;string&gt;")}} of four {{Glossary("ASCII")}} characters. If the tag name has more or fewer characters or if it contains characters outside the `U+20` – `U+7E` code point range, the descriptor is invalid.
+    - Optional value
+      - : The optional value can be a positive integer or the keyword `on` or `off`. The keywords `on` and `off` are synonyms for the values `1` and `0`, respectively. If no value is set, the default is `1`. For non-boolean OpenType features (e.g., [stylistic alternates](https://learn.microsoft.com/en-ca/typography/opentype/spec/features_pt#tag-salt)), the value implies a particular glyph to be selected; for boolean features, the value turns the feature on or off.
 
 ## Formal definition
 
diff --git a/files/en-us/web/javascript/reference/global_objects/map/index.md b/files/en-us/web/javascript/reference/global_objects/map/index.md
index 6708b04239affca..f822e4d451fae70 100644
--- a/files/en-us/web/javascript/reference/global_objects/map/index.md
+++ b/files/en-us/web/javascript/reference/global_objects/map/index.md
@@ -309,11 +309,12 @@ The methods and properties have the same behavior as the equivalent entities in
 The following are examples of read-only `Map`-like browser objects:
 
 - {{domxref("AudioParamMap")}}
-- {{domxref("RTCStatsReport")}}
+- {{domxref("CSSFontFeatureValuesMap")}}
 - {{domxref("EventCounts")}}
 - {{domxref("KeyboardLayoutMap")}}
 - {{domxref("MIDIInputMap")}}
 - {{domxref("MIDIOutputMap")}}
+- {{domxref("RTCStatsReport")}}
 
 ## Constructor
 
diff --git a/files/jsondata/GroupData.json b/files/jsondata/GroupData.json
index 17a6808445c4391..f132d77a9315aab 100644
--- a/files/jsondata/GroupData.json
+++ b/files/jsondata/GroupData.json
@@ -341,6 +341,7 @@
         "CSSNamespaceRule",
         "CSSPageRule",
         "CSSPageDescriptors",
+        "CSSFontFeatureValuesMap",
         "CSSFontFeatureValuesRule",
         "CSSFontPaletteValuesRule",
         "CSSPropertyRule",
diff --git a/package-lock.json b/package-lock.json
index 0fe8f49b7e11f7c..03ce2b3ff2b8d0b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -32,7 +32,7 @@
         "imagemin-svgo": "^11.0.1",
         "is-svg": "^6.1.0",
         "lefthook": "^2.1.1",
-        "markdownlint-cli2": "0.20.0",
+        "markdownlint-cli2": "0.21.0",
         "markdownlint-rule-search-replace": "1.2.0",
         "node-html-parser": "^7.0.2",
         "parse-diff": "^0.11.1",
@@ -4879,18 +4879,18 @@
       }
     },
     "node_modules/globby": {
-      "version": "15.0.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-15.0.0.tgz",
-      "integrity": "sha512-oB4vkQGqlMl682wL1IlWd02tXCbquGWM4voPEI85QmNKCaw8zGTm1f1rubFgkg3Eli2PtKlFgrnmUqasbQWlkw==",
+      "version": "16.1.0",
+      "resolved": "https://registry.npmjs.org/globby/-/globby-16.1.0.tgz",
+      "integrity": "sha512-+A4Hq7m7Ze592k9gZRy4gJ27DrXRNnC1vPjxTt1qQxEY8RxagBkBxivkCwg7FxSTG0iLLEMaUx13oOr0R2/qcQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@sindresorhus/merge-streams": "^4.0.0",
         "fast-glob": "^3.3.3",
         "ignore": "^7.0.5",
-        "path-type": "^6.0.0",
+        "is-path-inside": "^4.0.0",
         "slash": "^5.1.0",
-        "unicorn-magic": "^0.3.0"
+        "unicorn-magic": "^0.4.0"
       },
       "engines": {
         "node": ">=20"
@@ -4899,14 +4899,17 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/globby/node_modules/ignore": {
-      "version": "7.0.5",
-      "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz",
-      "integrity": "sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==",
+    "node_modules/globby/node_modules/unicorn-magic": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/unicorn-magic/-/unicorn-magic-0.4.0.tgz",
+      "integrity": "sha512-wH590V9VNgYH9g3lH9wWjTrUoKsjLF6sGLjhR4sH1LWpLmCOH0Zf7PukhDA8BiS7KHe4oPNkcTHqYkj7SOGUOw==",
       "dev": true,
       "license": "MIT",
       "engines": {
-        "node": ">= 4"
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
     "node_modules/gopd": {
@@ -5247,9 +5250,9 @@
       "license": "BSD-3-Clause"
     },
     "node_modules/ignore": {
-      "version": "7.0.4",
-      "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.4.tgz",
-      "integrity": "sha512-gJzzk+PQNznz8ysRrC0aOkBNVRBDtE1n53IqyqEf3PXrYwomFs5q4pGMizBMJF+ykh03insJ27hB8gSrD2Hn8A==",
+      "version": "7.0.5",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz",
+      "integrity": "sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -6044,6 +6047,19 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/is-path-inside": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-4.0.0.tgz",
+      "integrity": "sha512-lJJV/5dYS+RcL8uQdBDW9c9uWFLLBNRyFhnAKXw5tVqLlKZ4RMGZKv+YQ/IA3OhD+RpbJa1LLFM1FQPGyIXvOA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/is-plain-obj": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz",
@@ -6626,9 +6642,9 @@
       }
     },
     "node_modules/markdown-it": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-14.1.0.tgz",
-      "integrity": "sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==",
+      "version": "14.1.1",
+      "resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-14.1.1.tgz",
+      "integrity": "sha512-BuU2qnTti9YKgK5N+IeMubp14ZUKUUw7yeJbkjtosvHiP0AZ5c8IAgEMk79D0eC8F23r4Ac/q8cAIFdm2FtyoA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6668,17 +6684,17 @@
       }
     },
     "node_modules/markdownlint-cli2": {
-      "version": "0.20.0",
-      "resolved": "https://registry.npmjs.org/markdownlint-cli2/-/markdownlint-cli2-0.20.0.tgz",
-      "integrity": "sha512-esPk+8Qvx/f0bzI7YelUeZp+jCtFOk3KjZ7s9iBQZ6HlymSXoTtWGiIRZP05/9Oy2ehIoIjenVwndxGtxOIJYQ==",
+      "version": "0.21.0",
+      "resolved": "https://registry.npmjs.org/markdownlint-cli2/-/markdownlint-cli2-0.21.0.tgz",
+      "integrity": "sha512-DzzmbqfMW3EzHsunP66x556oZDzjcdjjlL2bHG4PubwnL58ZPAfz07px4GqteZkoCGnBYi779Y2mg7+vgNCwbw==",
       "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
-        "globby": "15.0.0",
+        "globby": "16.1.0",
         "js-yaml": "4.1.1",
         "jsonc-parser": "3.3.1",
-        "markdown-it": "14.1.0",
+        "markdown-it": "14.1.1",
         "markdownlint": "0.40.0",
         "markdownlint-cli2-formatter-default": "0.0.6",
         "micromatch": "4.0.8"
diff --git a/package.json b/package.json
index 479c44abfcf1934..79a35afba5caea3 100644
--- a/package.json
+++ b/package.json
@@ -66,7 +66,7 @@
     "imagemin-svgo": "^11.0.1",
     "is-svg": "^6.1.0",
     "lefthook": "^2.1.1",
-    "markdownlint-cli2": "0.20.0",
+    "markdownlint-cli2": "0.21.0",
     "markdownlint-rule-search-replace": "1.2.0",
     "node-html-parser": "^7.0.2",
     "parse-diff": "^0.11.1",