JavaScript Document selectedStyleSheetSet Property

Beginner
5 min read
Updated: Nov 2026
3 examples
Property

Definition

Document.selectedStyleSheetSet indicates the style sheet set currently in use (MDN). You can also assign a set name to switch sheets in supporting browsers.

Read the notes below before you get or set this property. Prefer feature detection when support is limited.

Syntax

Use document.selectedStyleSheetSet. Start with this line.

JavaScript
document.selectedStyleSheetSet
CallWhat it does
document.selectedStyleSheetSetPrimary signature.

Built into the browser. Read or assign document.selectedStyleSheetSet — no import required.

Library declarations
JavaScript
document.selectedStyleSheetSet

Parameters

ParameterDescription
Modern pathRequired. Class / CSS / adoptedStyleSheets

Return Value

Return ValueDescription
*The current value of document.selectedStyleSheetSet.

JavaScript Examples

Example 1 — Read selectedStyleSheetSet

MDN-style log of the currently active style sheet set name.

JavaScript
if ("selectedStyleSheetSet" in document) {
  console.log(
    "Current style sheet set: " + document.selectedStyleSheetSet
  );
} else {
  console.log("API not available");
}
Try It Yourself

How It Works

  1. Feature-detect first. The API is non-standard and often missing.
  2. Read the getter. Returns the set name currently in use (MDN).
  3. Legacy only. Useful for auditing old alternate-stylesheet pages.
  4. Expect blanks. Modern pages usually have no titled set groups.

Example 2 — Feature Detect Safely

Always check existence before reading or assigning.

JavaScript
const supported = "selectedStyleSheetSet" in document;
console.log(supported);

if (supported) {
  console.log(JSON.stringify(document.selectedStyleSheetSet));
} else {
  console.log("API not available");
}
Try It Yourself

How It Works

  1. Use in. Safer than reading a missing property.
  2. Branch. Log the value only when the property exists.
  3. Expect gaps. Deprecated non-standard APIs are often incomplete.
  4. Do not polyfill. Migrate themes instead of shimming this API.

Example 3 — Prefer a Modern Theme Toggle

Simple replacement pattern for light/dark themes without style sheet sets.

JavaScript
// Prefer this over selectedStyleSheetSet for new apps
document.documentElement.classList.toggle("dark");
console.log(
  document.documentElement.classList.contains("dark")
);
Try It Yourself

How It Works

  1. Toggle a class. Put theme styles under .dark (or similar).
  2. Target documentElement. The <html> root is the usual place.
  3. Standard APIs. Works everywhere without alternate stylesheet menus.
  4. Pair with CSS. Custom properties and prefers-color-scheme complete the story.

Browser Support

Document.selectedStyleSheetSet is Deprecated and Non-standard (MDN). Support is incomplete — feature-detect, and do not ship new features on it.

✓ Deprecated · Non-standard

Document.selectedStyleSheetSet

Legacy current style sheet set name — avoid in new apps.

Legacy Avoid in new apps
Google Chrome Supported · Desktop & Mobile
Full support
Mozilla Firefox Supported · Desktop & Mobile
Full support
Apple Safari Supported · macOS & iOS
Full support
Microsoft Edge Supported · Chromium
Full support
Internet Explorer No native support · Use a polyfill
Polyfill
Opera Supported · Modern versions
Full support
Samsung Internet Supported · Android
Full support
Android WebView Supported · Modern WebView
Full support
selectedStyleSheetSet Deprecated

Bottom line: Safe to recognize in old code. For themes: documentElement classes, CSS variables, prefers-color-scheme, or adoptedStyleSheets.

Frequently Asked Questions

The name of the style sheet set currently in use (MDN). It reflects which alternate stylesheet group is active.
Yes. MDN marks Document.selectedStyleSheetSet as Deprecated and Non-standard. Do not use it in new projects.
Yes in supporting browsers. MDN: setting it is equivalent to calling document.enableStyleSheetsForSet() with that name, then setting lastStyleSheetSet to the same value.
Yes. MDN notes the attribute value is live — changing the disabled attribute on stylesheets affects selectedStyleSheetSet.
preferredStyleSheetSet is the author default (read-only, often ""). selectedStyleSheetSet is the currently active set and can be read or written by scripts (MDN).
Prefer a class on document.documentElement, CSS custom properties, prefers-color-scheme, or adoptedStyleSheets. Avoid the alternate style sheet set DOM API for new work.

Next: styleSheetSets

Learn the list of available style sheet set names.

styleSheetSets tutorial →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

11 people found this page helpful