Back to Content

CSSFontFeatureValuesRule: swash property

files/en-us/web/api/cssfontfeaturevaluesrule/swash/index.md

latest1.6 KB
Original Source

{{ APIRef("CSSOM") }}{{SeeCompatTable}}

The read-only swash property of the {{domXRef("CSSFontFeatureValuesRule")}} interface contains a {{domXRef("CSSFontFeatureValuesMap")}} object representing the developer-provided name and feature index 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.

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")}}