--- a/devtools/client/inspector/computed/computed.js
+++ b/devtools/client/inspector/computed/computed.js
@@ -14,16 +14,17 @@ const ToolDefinitions = require("devtool
 const {CssLogic} = require("devtools/shared/inspector/css-logic");
 const {ELEMENT_STYLE} = require("devtools/server/actors/styles");
 const promise = require("promise");
 const Services = require("Services");
 const {OutputParser} = require("devtools/client/shared/output-parser");
 const {PrefObserver, PREF_ORIG_SOURCES} = require("devtools/client/styleeditor/utils");
 const {createChild} = require("devtools/client/inspector/shared/utils");
 const {gDevTools} = require("devtools/client/framework/devtools");
+const {getCssProperties} = require("devtools/shared/fronts/css-properties");
 
 loader.lazyRequireGetter(this, "overlays",
   "devtools/client/inspector/shared/style-inspector-overlays");
 loader.lazyRequireGetter(this, "StyleInspectorMenu",
   "devtools/client/inspector/shared/style-inspector-menu");
 loader.lazyRequireGetter(this, "KeyShortcuts",
   "devtools/client/shared/key-shortcuts", true);
 
@@ -144,17 +145,18 @@ UpdateProcess.prototype = {
 function CssComputedView(inspector, document, pageStyle) {
   this.inspector = inspector;
   this.styleDocument = document;
   this.styleWindow = this.styleDocument.defaultView;
   this.pageStyle = pageStyle;
 
   this.propertyViews = [];
 
-  this._outputParser = new OutputParser(document);
+  let cssProperties = getCssProperties(inspector.toolbox);
+  this._outputParser = new OutputParser(document, cssProperties.supportsType);
 
   let chromeReg = Cc["@mozilla.org/chrome/chrome-registry;1"]
     .getService(Ci.nsIXULChromeRegistry);
   this.getRTLAttr = chromeReg.isLocaleRTL("global") ? "rtl" : "ltr";
 
   // Create bound methods.
   this.focusWindow = this.focusWindow.bind(this);
   this._onContextMenu = this._onContextMenu.bind(this);

--- a/devtools/client/inspector/rules/models/rule.js
+++ b/devtools/client/inspector/rules/models/rule.js
@@ -9,17 +9,16 @@
 const {Cc, Ci, Cu} = require("chrome");
 const promise = require("promise");
 const {CssLogic} = require("devtools/shared/inspector/css-logic");
 const {ELEMENT_STYLE} = require("devtools/server/actors/styles");
 const {TextProperty} =
       require("devtools/client/inspector/rules/models/text-property");
 const {promiseWarn} = require("devtools/client/inspector/shared/utils");
 const {parseDeclarations} = require("devtools/shared/css-parsing-utils");
-const {getCssProperties} = require("devtools/shared/fronts/css-properties");
 
 Cu.import("resource://gre/modules/XPCOMUtils.jsm");
 
 XPCOMUtils.defineLazyGetter(this, "osString", function () {
   return Cc["@mozilla.org/xre/app-info;1"].getService(Ci.nsIXULRuntime).OS;
 });
 
 /**
@@ -51,18 +50,17 @@ function Rule(elementStyle, options) {
   this.inherited = options.inherited || null;
   this.keyframes = options.keyframes || null;
   this._modificationDepth = 0;
 
   if (this.domRule && this.domRule.mediaText) {
     this.mediaText = this.domRule.mediaText;
   }
 
-  const toolbox = this.elementStyle.ruleView.inspector.toolbox;
-  this.cssProperties = getCssProperties(toolbox);
+  this.cssProperties = this.elementStyle.ruleView.cssProperties;
 
   // Populate the text properties with the style's current authoredText
   // value, and add in any disabled properties from the store.
   this.textProps = this._getTextProperties();
   this.textProps = this.textProps.concat(this._getDisabledProperties());
 }
 
 Rule.prototype = {

--- a/devtools/client/inspector/rules/rules.js
+++ b/devtools/client/inspector/rules/rules.js
@@ -11,26 +11,23 @@ const {Cc, Ci} = require("chrome");
 const promise = require("promise");
 const Services = require("Services");
 const {XPCOMUtils} = require("resource://gre/modules/XPCOMUtils.jsm");
 const {Task} = require("devtools/shared/task");
 const {Tools} = require("devtools/client/definitions");
 const {CssLogic} = require("devtools/shared/inspector/css-logic");
 const {ELEMENT_STYLE} = require("devtools/server/actors/styles");
 const {OutputParser} = require("devtools/client/shared/output-parser");
-const {PrefObserver, PREF_ORIG_SOURCES} =
-      require("devtools/client/styleeditor/utils");
-const {ElementStyle} =
-      require("devtools/client/inspector/rules/models/element-style");
+const {PrefObserver, PREF_ORIG_SOURCES} = require("devtools/client/styleeditor/utils");
+const {ElementStyle} = require("devtools/client/inspector/rules/models/element-style");
 const {Rule} = require("devtools/client/inspector/rules/models/rule");
-const {RuleEditor} =
-      require("devtools/client/inspector/rules/views/rule-editor");
-const {createChild, promiseWarn} =
-      require("devtools/client/inspector/shared/utils");
+const {RuleEditor} = require("devtools/client/inspector/rules/views/rule-editor");
+const {createChild, promiseWarn} = require("devtools/client/inspector/shared/utils");
 const {gDevTools} = require("devtools/client/framework/devtools");
+const {getCssProperties} = require("devtools/shared/fronts/css-properties");
 
 loader.lazyRequireGetter(this, "overlays",
   "devtools/client/inspector/shared/style-inspector-overlays");
 loader.lazyRequireGetter(this, "EventEmitter",
   "devtools/shared/event-emitter");
 loader.lazyRequireGetter(this, "StyleInspectorMenu",
   "devtools/client/inspector/shared/style-inspector-menu");
 loader.lazyRequireGetter(this, "KeyShortcuts",
@@ -156,17 +153,19 @@ function createDummyDocument() {
  */
 function CssRuleView(inspector, document, store, pageStyle) {
   this.inspector = inspector;
   this.styleDocument = document;
   this.styleWindow = this.styleDocument.defaultView;
   this.store = store || {};
   this.pageStyle = pageStyle;
 
-  this._outputParser = new OutputParser(document);
+  this.cssProperties = getCssProperties(inspector.toolbox);
+
+  this._outputParser = new OutputParser(document, this.cssProperties.supportsType);
 
   this._onAddRule = this._onAddRule.bind(this);
   this._onContextMenu = this._onContextMenu.bind(this);
   this._onCopy = this._onCopy.bind(this);
   this._onFilterStyles = this._onFilterStyles.bind(this);
   this._onClearSearch = this._onClearSearch.bind(this);
   this._onFilterTextboxContextMenu =
     this._onFilterTextboxContextMenu.bind(this);

--- a/devtools/client/inspector/shared/test/browser_styleinspector_output-parser.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_output-parser.js
@@ -4,17 +4,18 @@
 
 "use strict";
 
 // Test expected outputs of the output-parser's parseCssProperty function.
 
 // This is more of a unit test than a mochitest-browser test, but can't be
 // tested with an xpcshell test as the output-parser requires the DOM to work.
 
-var {OutputParser} = require("devtools/client/shared/output-parser");
+const {OutputParser} = require("devtools/client/shared/output-parser");
+const {initCssProperties, getCssProperties} = require("devtools/shared/fronts/css-properties");
 
 const COLOR_CLASS = "color-class";
 const URL_CLASS = "url-class";
 const CUBIC_BEZIER_CLASS = "bezier-class";
 const ANGLE_CLASS = "angle-class";
 
 const TEST_DATA = [
   {
@@ -291,17 +292,22 @@ const TEST_DATA = [
     value: "rgb(255, var(--g-value, 0), 192)",
     test: fragment => {
       is(fragment.textContent, "rgb(255, var(--g-value, 0), 192)");
     }
   }
 ];
 
 add_task(function* () {
-  let parser = new OutputParser(document);
+  // Mock the toolbox that initCssProperties expect so we get the fallback css properties.
+  let toolbox = {target: {client: {}, hasActor: () => false}};
+  yield initCssProperties(toolbox);
+  let cssProperties = getCssProperties(toolbox);
+
+  let parser = new OutputParser(document, cssProperties.supportsType);
   for (let i = 0; i < TEST_DATA.length; i++) {
     let data = TEST_DATA[i];
     info("Output-parser test data " + i + ". {" + data.name + " : " +
       data.value + ";}");
     data.test(parser.parseCssProperty(data.name, data.value, {
       colorClass: COLOR_CLASS,
       urlClass: URL_CLASS,
       bezierClass: CUBIC_BEZIER_CLASS,

--- a/devtools/client/shared/output-parser.js
+++ b/devtools/client/shared/output-parser.js
@@ -4,71 +4,55 @@
 
 "use strict";
 
 const {Cc, Ci} = require("chrome");
 const {angleUtils} = require("devtools/client/shared/css-angle");
 const {colorUtils} = require("devtools/client/shared/css-color");
 const {getCSSLexer} = require("devtools/shared/css-lexer");
 const EventEmitter = require("devtools/shared/event-emitter");
+const {
+  ANGLE_TAKING_FUNCTIONS,
+  BEZIER_KEYWORDS,
+  COLOR_TAKING_FUNCTIONS,
+  CSS_TYPES
+} = require("devtools/shared/css-properties-db");
 
 const HTML_NS = "http://www.w3.org/1999/xhtml";
 
-const BEZIER_KEYWORDS = ["linear", "ease-in-out", "ease-in", "ease-out",
-                         "ease"];
-
-// Functions that accept a color argument.
-const COLOR_TAKING_FUNCTIONS = ["linear-gradient",
-                                "-moz-linear-gradient",
-                                "repeating-linear-gradient",
-                                "-moz-repeating-linear-gradient",
-                                "radial-gradient",
-                                "-moz-radial-gradient",
-                                "repeating-radial-gradient",
-                                "-moz-repeating-radial-gradient",
-                                "drop-shadow"];
-
-// Functions that accept an angle argument.
-const ANGLE_TAKING_FUNCTIONS = ["linear-gradient",
-                                "-moz-linear-gradient",
-                                "repeating-linear-gradient",
-                                "-moz-repeating-linear-gradient",
-                                "rotate",
-                                "rotateX",
-                                "rotateY",
-                                "rotateZ",
-                                "rotate3d",
-                                "skew",
-                                "skewX",
-                                "skewY",
-                                "hue-rotate"];
-
 loader.lazyGetter(this, "DOMUtils", function () {
   return Cc["@mozilla.org/inspector/dom-utils;1"].getService(Ci.inIDOMUtils);
 });
 
 /**
  * This module is used to process text for output by developer tools. This means
  * linking JS files with the debugger, CSS files with the style editor, JS
  * functions with the debugger, placing color swatches next to colors and
  * adding doorhanger previews where possible (images, angles, lengths,
  * border radius, cubic-bezier etc.).
  *
  * Usage:
  *   const {require} =
  *      Cu.import("resource://devtools/shared/Loader.jsm", {});
  *   const {OutputParser} = require("devtools/client/shared/output-parser");
  *
- *   let parser = new OutputParser(document);
+ *   let parser = new OutputParser(document, supportsType);
  *
  *   parser.parseCssProperty("color", "red"); // Returns document fragment.
+ *
+ * @param {Document} document Used to create DOM nodes.
+ * @param {Function} supportsTypes A function that returns a boolean when asked if a css
+ * property name supports a given css type.
+ * The function is executed like supportsType("color", CSS_TYPES.COLOR) where CSS_TYPES is
+ * defined in devtools/shared/css-properties-db.js
  */
-function OutputParser(document) {
+function OutputParser(document, supportsType) {
   this.parsed = [];
   this.doc = document;
+  this.supportsType = supportsType;
   this.colorSwatches = new WeakMap();
   this.angleSwatches = new WeakMap();
   this._onColorSwatchMouseDown = this._onColorSwatchMouseDown.bind(this);
   this._onAngleSwatchMouseDown = this._onAngleSwatchMouseDown.bind(this);
 }
 
 exports.OutputParser = OutputParser;
 
@@ -84,22 +68,20 @@ OutputParser.prototype = {
    *         Options object. For valid options and default values see
    *         _mergeOptions().
    * @return {DocumentFragment}
    *         A document fragment containing color swatches etc.
    */
   parseCssProperty: function (name, value, options = {}) {
     options = this._mergeOptions(options);
 
-    options.expectCubicBezier =
-      safeCssPropertySupportsType(name, DOMUtils.TYPE_TIMING_FUNCTION);
+    options.expectCubicBezier = this.supportsType(name, CSS_TYPES.TIMING_FUNCTION);
     options.expectFilter = name === "filter";
-    options.supportsColor =
-      safeCssPropertySupportsType(name, DOMUtils.TYPE_COLOR) ||
-      safeCssPropertySupportsType(name, DOMUtils.TYPE_GRADIENT);
+    options.supportsColor = this.supportsType(name, CSS_TYPES.COLOR) ||
+                            this.supportsType(name, CSS_TYPES.GRADIENT);
 
     // The filter property is special in that we want to show the
     // swatch even if the value is invalid, because this way the user
     // can easily use the editor to fix it.
     if (options.expectFilter || this._cssPropertySupportsValue(name, value)) {
       return this._parse(value, options);
     }
     this._appendTextNode(value);
@@ -676,25 +658,8 @@ OutputParser.prototype = {
     };
 
     for (let item in overrides) {
       defaults[item] = overrides[item];
     }
     return defaults;
   }
 };
-
-/**
- * A wrapper for DOMUtils.cssPropertySupportsType that ignores invalid
- * properties.
- *
- * @param {String} name The property name.
- * @param {number} type The type tested for support.
- * @return {Boolean} Whether the property supports the type.
- *        If the property is unknown, false is returned.
- */
-function safeCssPropertySupportsType(name, type) {
-  try {
-    return DOMUtils.cssPropertySupportsType(name, type);
-  } catch (e) {
-    return false;
-  }
-}

--- a/devtools/client/shared/test/browser_outputparser.js
+++ b/devtools/client/shared/test/browser_outputparser.js
@@ -1,26 +1,32 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 "use strict";
 
-var {OutputParser} = require("devtools/client/shared/output-parser");
+const {OutputParser} = require("devtools/client/shared/output-parser");
+const {initCssProperties, getCssProperties} = require("devtools/shared/fronts/css-properties");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
   let [host, , doc] = yield createHost("bottom", "data:text/html," +
     "<h1>browser_outputParser.js</h1><div></div>");
 
-  let parser = new OutputParser(doc);
+  // Mock the toolbox that initCssProperties expect so we get the fallback css properties.
+  let toolbox = {target: {client: {}, hasActor: () => false}};
+  yield initCssProperties(toolbox);
+  let cssProperties = getCssProperties(toolbox);
+
+  let parser = new OutputParser(doc, cssProperties.supportsType);
   testParseCssProperty(doc, parser);
   testParseCssVar(doc, parser);
   testParseURL(doc, parser);
   testParseFilter(doc, parser);
   testParseAngle(doc, parser);
 
   host.destroy();
 }

--- a/devtools/server/actors/css-properties.js
+++ b/devtools/server/actors/css-properties.js
@@ -1,49 +1,57 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 "use strict";
 
-const { Cc, Ci, Cu } = require("chrome");
+const { Cc, Ci } = require("chrome");
 
 loader.lazyGetter(this, "DOMUtils", () => {
   return Cc["@mozilla.org/inspector/dom-utils;1"].getService(Ci.inIDOMUtils);
 });
 
 const protocol = require("devtools/shared/protocol");
 const { ActorClassWithSpec, Actor } = protocol;
 const { cssPropertiesSpec } = require("devtools/shared/specs/css-properties");
-const clientCssDatabase = require("devtools/shared/css-properties-db")
+const { CSS_PROPERTIES, CSS_TYPES } = require("devtools/shared/css-properties-db");
 
-var CssPropertiesActor = exports.CssPropertiesActor = ActorClassWithSpec(cssPropertiesSpec, {
+exports.CssPropertiesActor = ActorClassWithSpec(cssPropertiesSpec, {
   typeName: "cssProperties",
 
-  initialize: function(conn, parent) {
+  initialize(conn, parent) {
     Actor.prototype.initialize.call(this, conn);
     this.parent = parent;
   },
 
-  destroy: function() {
+  destroy() {
     Actor.prototype.destroy.call(this);
   },
 
-  getCSSDatabase: function() {
+  getCSSDatabase() {
     const db = {};
     const properties = DOMUtils.getCSSPropertyNames(DOMUtils.INCLUDE_ALIASES);
 
     properties.forEach(name => {
-      // In order to maintain any backwards compatible changes when debugging
-      // older clients, take the definition from the static database in the
-      // devtools client, and fill it in with the most recent property
-      // definition from the server.
-      const clientDefinition = clientCssDatabase[name] || {};
+      // Get the list of CSS types this property supports.
+      let supports = [];
+      for (let type in CSS_TYPES) {
+        if (safeCssPropertySupportsType(name, DOMUtils["TYPE_" + type])) {
+          supports.push(CSS_TYPES[type]);
+        }
+      }
+
+      // In order to maintain any backwards compatible changes when debugging older
+      // clients, take the definition from the static CSS properties database, and fill it
+      // in with the most recent property definition from the server.
+      const clientDefinition = CSS_PROPERTIES[name] || {};
       const serverDefinition = {
-        isInherited: DOMUtils.isInheritedProperty(name)
+        isInherited: DOMUtils.isInheritedProperty(name),
+        supports
       };
       db[name] = Object.assign(clientDefinition, serverDefinition);
     });
 
     return db;
   }
 });
 
@@ -60,9 +68,26 @@ function isCssPropertyKnown(name) {
     // be thrown; so we just ignore the return value.
     DOMUtils.cssPropertyIsShorthand(name);
     return true;
   } catch (e) {
     return false;
   }
 }
 
-exports.isCssPropertyKnown = isCssPropertyKnown
+exports.isCssPropertyKnown = isCssPropertyKnown;
+
+/**
+ * A wrapper for DOMUtils.cssPropertySupportsType that ignores invalid
+ * properties.
+ *
+ * @param {String} name The property name.
+ * @param {number} type The type tested for support.
+ * @return {Boolean} Whether the property supports the type.
+ *        If the property is unknown, false is returned.
+ */
+function safeCssPropertySupportsType(name, type) {
+  try {
+    return DOMUtils.cssPropertySupportsType(name, type);
+  } catch (e) {
+    return false;
+  }
+}

--- a/devtools/shared/css-properties-db.js
+++ b/devtools/shared/css-properties-db.js
@@ -1,1282 +1,1745 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 "use strict";
 
 /**
+ * All CSS types that properties can support.
+ */
+exports.CSS_TYPES = {
+  "ANGLE": 1,
+  "COLOR": 2,
+  "FREQUENCY": 3,
+  "GRADIENT": 4,
+  "IMAGE_RECT": 5,
+  "LENGTH": 6,
+  "NUMBER": 7,
+  "PERCENTAGE": 8,
+  "TIME": 9,
+  "TIMING_FUNCTION": 10,
+  "URL": 11,
+};
+
+/**
+ * All cubic-bezier CSS timing-function names.
+ */
+exports.BEZIER_KEYWORDS = ["linear", "ease-in-out", "ease-in", "ease-out", "ease"];
+
+/**
+ * Functions that accept a color argument.
+ */
+exports.COLOR_TAKING_FUNCTIONS = ["linear-gradient", "-moz-linear-gradient",
+                                  "repeating-linear-gradient",
+                                  "-moz-repeating-linear-gradient", "radial-gradient",
+                                  "-moz-radial-gradient", "repeating-radial-gradient",
+                                  "-moz-repeating-radial-gradient", "drop-shadow"];
+
+/**
+ * Functions that accept an angle argument.
+ */
+exports.ANGLE_TAKING_FUNCTIONS = ["linear-gradient", "-moz-linear-gradient",
+                                  "repeating-linear-gradient",
+                                  "-moz-repeating-linear-gradient", "rotate", "rotateX",
+                                  "rotateY", "rotateZ", "rotate3d", "skew", "skewX",
+                                  "skewY", "hue-rotate"];
+
+/**
  * This list is generated from the output of the CssPropertiesActor. If a server
  * does not support the actor, this is loaded as a backup. This list does not
  * guarantee that the server actually supports these CSS properties.
  */
-module.exports = {
+exports.CSS_PROPERTIES = {
   "align-content": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "align-items": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "align-self": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "animation-delay": {
-    isInherited: false
+    isInherited: false,
+    supports: [9]
   },
   "animation-direction": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "animation-duration": {
-    isInherited: false
+    isInherited: false,
+    supports: [9]
   },
   "animation-fill-mode": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "animation-iteration-count": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "animation-name": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "animation-play-state": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "animation-timing-function": {
-    isInherited: false
+    isInherited: false,
+    supports: [10]
   },
   "-moz-appearance": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "backface-visibility": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "background-attachment": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "background-blend-mode": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "background-clip": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "background-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "background-image": {
-    isInherited: false
+    isInherited: false,
+    supports: [4, 5, 11]
   },
   "background-origin": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "background-position-x": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "background-position-y": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "background-repeat": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "background-size": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-moz-binding": {
-    isInherited: false
+    isInherited: false,
+    supports: [11]
   },
   "block-size": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "border-block-end-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "border-block-end-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "border-block-end-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "border-block-start-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "border-block-start-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "border-block-start-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "border-bottom-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "-moz-border-bottom-colors": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "border-bottom-left-radius": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "border-bottom-right-radius": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "border-bottom-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "border-bottom-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "border-collapse": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "border-image-outset": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 7]
   },
   "border-image-repeat": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "border-image-slice": {
-    isInherited: false
+    isInherited: false,
+    supports: [7, 8]
   },
   "border-image-source": {
-    isInherited: false
+    isInherited: false,
+    supports: [4, 5, 11]
   },
   "border-image-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 7, 8]
   },
   "border-inline-end-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "border-inline-end-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "border-inline-end-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "border-inline-start-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "border-inline-start-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "border-inline-start-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "border-left-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "-moz-border-left-colors": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "border-left-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "border-left-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "border-right-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "-moz-border-right-colors": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "border-right-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "border-right-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "border-spacing": {
-    isInherited: true
+    isInherited: true,
+    supports: [6]
   },
   "border-top-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "-moz-border-top-colors": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "border-top-left-radius": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "border-top-right-radius": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "border-top-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "border-top-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "bottom": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-moz-box-align": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "box-decoration-break": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-box-direction": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-box-flex": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "-moz-box-ordinal-group": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "-moz-box-orient": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-box-pack": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "box-shadow": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 6]
   },
   "box-sizing": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "caption-side": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "clear": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "clip": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "clip-path": {
-    isInherited: false
+    isInherited: false,
+    supports: [11]
   },
   "clip-rule": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "color": {
-    isInherited: true
+    isInherited: true,
+    supports: [2]
   },
   "color-adjust": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "color-interpolation": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "color-interpolation-filters": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "-moz-column-count": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "-moz-column-fill": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-column-gap": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "-moz-column-rule-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "-moz-column-rule-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-column-rule-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "-moz-column-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "content": {
-    isInherited: false
+    isInherited: false,
+    supports: [11]
   },
   "-moz-control-character-visibility": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "counter-increment": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "counter-reset": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "cursor": {
-    isInherited: true
+    isInherited: true,
+    supports: [11]
   },
   "direction": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "display": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "dominant-baseline": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "empty-cells": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "fill": {
-    isInherited: true
+    isInherited: true,
+    supports: [2, 11]
   },
   "fill-opacity": {
-    isInherited: true
+    isInherited: true,
+    supports: [7]
   },
   "fill-rule": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "filter": {
-    isInherited: false
+    isInherited: false,
+    supports: [11]
   },
   "flex-basis": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "flex-direction": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "flex-grow": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "flex-shrink": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "flex-wrap": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "float": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-float-edge": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "flood-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "flood-opacity": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "font-family": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "font-feature-settings": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "font-kerning": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "font-language-override": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "font-size": {
-    isInherited: true
+    isInherited: true,
+    supports: [6, 8]
   },
   "font-size-adjust": {
-    isInherited: true
+    isInherited: true,
+    supports: [7]
   },
   "font-stretch": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "font-style": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "font-synthesis": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "font-variant-alternates": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "font-variant-caps": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "font-variant-east-asian": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "font-variant-ligatures": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "font-variant-numeric": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "font-variant-position": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "font-weight": {
-    isInherited: true
+    isInherited: true,
+    supports: [7]
   },
   "-moz-force-broken-image-icon": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "grid-auto-columns": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "grid-auto-flow": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "grid-auto-rows": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "grid-column-end": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "grid-column-gap": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "grid-column-start": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "grid-row-end": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "grid-row-gap": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "grid-row-start": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "grid-template-areas": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "grid-template-columns": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "grid-template-rows": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "height": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "hyphens": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "image-orientation": {
-    isInherited: true
+    isInherited: true,
+    supports: [1]
   },
   "-moz-image-region": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "image-rendering": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "ime-mode": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "inline-size": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "isolation": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "justify-content": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "justify-items": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "justify-self": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "left": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "letter-spacing": {
-    isInherited: true
+    isInherited: true,
+    supports: [6]
   },
   "lighting-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "line-height": {
-    isInherited: true
+    isInherited: true,
+    supports: [6, 7, 8]
   },
   "list-style-image": {
-    isInherited: true
+    isInherited: true,
+    supports: [11]
   },
   "list-style-position": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "list-style-type": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "margin-block-end": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "margin-block-start": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "margin-bottom": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "margin-inline-end": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "margin-inline-start": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "margin-left": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "margin-right": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "margin-top": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "marker-end": {
-    isInherited: true
+    isInherited: true,
+    supports: [11]
   },
   "marker-mid": {
-    isInherited: true
+    isInherited: true,
+    supports: [11]
   },
   "marker-offset": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "marker-start": {
-    isInherited: true
+    isInherited: true,
+    supports: [11]
   },
   "mask": {
-    isInherited: false
+    isInherited: false,
+    supports: [11]
   },
   "mask-type": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "max-block-size": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "max-height": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "max-inline-size": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "max-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "min-block-size": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "min-height": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "min-inline-size": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "min-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "mix-blend-mode": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "object-fit": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "object-position": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "offset-block-end": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "offset-block-start": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "offset-inline-end": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "offset-inline-start": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "opacity": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "order": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "-moz-orient": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-osx-font-smoothing": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "outline-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "outline-offset": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "-moz-outline-radius-bottomleft": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-moz-outline-radius-bottomright": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-moz-outline-radius-topleft": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-moz-outline-radius-topright": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "outline-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "outline-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "overflow-x": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "overflow-y": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "padding-block-end": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "padding-block-start": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "padding-bottom": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "padding-inline-end": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "padding-inline-start": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "padding-left": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "padding-right": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "padding-top": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "page-break-after": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "page-break-before": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "page-break-inside": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "paint-order": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "perspective": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "perspective-origin": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "pointer-events": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "position": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "quotes": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "resize": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "right": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "ruby-align": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "ruby-position": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "scroll-behavior": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "scroll-snap-coordinate": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "scroll-snap-destination": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "scroll-snap-points-x": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "scroll-snap-points-y": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "scroll-snap-type-x": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "scroll-snap-type-y": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "shape-rendering": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "-moz-stack-sizing": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "stop-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "stop-opacity": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "stroke": {
-    isInherited: true
+    isInherited: true,
+    supports: [2, 11]
   },
   "stroke-dasharray": {
-    isInherited: true
+    isInherited: true,
+    supports: [6, 7, 8]
   },
   "stroke-dashoffset": {
-    isInherited: true
+    isInherited: true,
+    supports: [6, 7, 8]
   },
   "stroke-linecap": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "stroke-linejoin": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "stroke-miterlimit": {
-    isInherited: true
+    isInherited: true,
+    supports: [7]
   },
   "stroke-opacity": {
-    isInherited: true
+    isInherited: true,
+    supports: [7]
   },
   "stroke-width": {
-    isInherited: true
+    isInherited: true,
+    supports: [6, 7, 8]
   },
   "-moz-tab-size": {
-    isInherited: true
+    isInherited: true,
+    supports: [7]
   },
   "table-layout": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "text-align": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "text-align-last": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "text-anchor": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "text-combine-upright": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "text-decoration-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "text-decoration-line": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "text-decoration-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "text-emphasis-color": {
-    isInherited: true
+    isInherited: true,
+    supports: [2]
   },
   "text-emphasis-position": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "text-emphasis-style": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "-webkit-text-fill-color": {
-    isInherited: true
+    isInherited: true,
+    supports: [2]
   },
   "text-indent": {
-    isInherited: true
+    isInherited: true,
+    supports: [6, 8]
   },
   "text-orientation": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "text-overflow": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "text-rendering": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "text-shadow": {
-    isInherited: true
+    isInherited: true,
+    supports: [2, 6]
   },
   "-moz-text-size-adjust": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "-webkit-text-stroke-color": {
-    isInherited: true
+    isInherited: true,
+    supports: [2]
   },
   "-webkit-text-stroke-width": {
-    isInherited: true
+    isInherited: true,
+    supports: [6]
   },
   "text-transform": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "top": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "transform": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "transform-box": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "transform-origin": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "transform-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "transition-delay": {
-    isInherited: false
+    isInherited: false,
+    supports: [9]
   },
   "transition-duration": {
-    isInherited: false
+    isInherited: false,
+    supports: [9]
   },
   "transition-property": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "transition-timing-function": {
-    isInherited: false
+    isInherited: false,
+    supports: [10]
   },
   "unicode-bidi": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-user-focus": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "-moz-user-input": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "-moz-user-modify": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "-moz-user-select": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "vector-effect": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "vertical-align": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "visibility": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "white-space": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "will-change": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-window-dragging": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "word-break": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "word-spacing": {
-    isInherited: true
+    isInherited: true,
+    supports: [6, 8]
   },
   "overflow-wrap": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "writing-mode": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "z-index": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "all": {
-    isInherited: false
+    isInherited: false,
+    supports: [1, 2, 4, 5, 6, 7, 8, 9, 10, 11]
   },
   "animation": {
-    isInherited: false
+    isInherited: false,
+    supports: [7, 9, 10]
   },
   "background": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 4, 5, 6, 8, 11]
   },
   "background-position": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "border": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 6]
   },
   "border-block-end": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 6]
   },
   "border-block-start": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 6]
   },
   "border-bottom": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 6]
   },
   "border-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "border-image": {
-    isInherited: false
+    isInherited: false,
+    supports: [4, 5, 6, 7, 8, 11]
   },
   "border-inline-end": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 6]
   },
   "border-inline-start": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 6]
   },
   "border-left": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 6]
   },
   "border-radius": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "border-right": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 6]
   },
   "border-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "border-top": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 6]
   },
   "border-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "-moz-column-rule": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 6]
   },
   "-moz-columns": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 7]
   },
   "flex": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 7, 8]
   },
   "flex-flow": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "font": {
-    isInherited: true
+    isInherited: true,
+    supports: [6, 7, 8]
   },
   "font-variant": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "grid": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "grid-area": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "grid-column": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "grid-gap": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "grid-row": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "grid-template": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "list-style": {
-    isInherited: true
+    isInherited: true,
+    supports: [11]
   },
   "margin": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "marker": {
-    isInherited: true
+    isInherited: true,
+    supports: [11]
   },
   "outline": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 6]
   },
   "-moz-outline-radius": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "overflow": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "padding": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "scroll-snap-type": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "text-decoration": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "text-emphasis": {
-    isInherited: true
+    isInherited: true,
+    supports: [2]
   },
   "-webkit-text-stroke": {
-    isInherited: true
+    isInherited: true,
+    supports: [2, 6]
   },
   "-moz-transform": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "transition": {
-    isInherited: false
+    isInherited: false,
+    supports: [9, 10]
   },
   "word-wrap": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "-moz-transform-origin": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-moz-perspective-origin": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-moz-perspective": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "-moz-transform-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-backface-visibility": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-border-image": {
-    isInherited: false
+    isInherited: false,
+    supports: [4, 5, 6, 7, 8, 11]
   },
   "-moz-transition": {
-    isInherited: false
+    isInherited: false,
+    supports: [9, 10]
   },
   "-moz-transition-delay": {
-    isInherited: false
+    isInherited: false,
+    supports: [9]
   },
   "-moz-transition-duration": {
-    isInherited: false
+    isInherited: false,
+    supports: [9]
   },
   "-moz-transition-property": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-transition-timing-function": {
-    isInherited: false
+    isInherited: false,
+    supports: [10]
   },
   "-moz-animation": {
-    isInherited: false
+    isInherited: false,
+    supports: [7, 9, 10]
   },
   "-moz-animation-delay": {
-    isInherited: false
+    isInherited: false,
+    supports: [9]
   },
   "-moz-animation-direction": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-animation-duration": {
-    isInherited: false
+    isInherited: false,
+    supports: [9]
   },
   "-moz-animation-fill-mode": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-animation-iteration-count": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "-moz-animation-name": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-animation-play-state": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-animation-timing-function": {
-    isInherited: false
+    isInherited: false,
+    supports: [10]
   },
   "-moz-box-sizing": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-font-feature-settings": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "-moz-font-language-override": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "-moz-padding-end": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-moz-padding-start": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-moz-margin-end": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-moz-margin-start": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-moz-border-end": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 6]
   },
   "-moz-border-end-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "-moz-border-end-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-border-end-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "-moz-border-start": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 6]
   },
   "-moz-border-start-color": {
-    isInherited: false
+    isInherited: false,
+    supports: [2]
   },
   "-moz-border-start-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-moz-border-start-width": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "-moz-hyphens": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "-moz-text-align-last": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "-webkit-animation": {
-    isInherited: false
+    isInherited: false,
+    supports: [7, 9, 10]
   },
   "-webkit-animation-delay": {
-    isInherited: false
+    isInherited: false,
+    supports: [9]
   },
   "-webkit-animation-direction": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-animation-duration": {
-    isInherited: false
+    isInherited: false,
+    supports: [9]
   },
   "-webkit-animation-fill-mode": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-animation-iteration-count": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "-webkit-animation-name": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-animation-play-state": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-animation-timing-function": {
-    isInherited: false
+    isInherited: false,
+    supports: [10]
   },
   "-webkit-filter": {
-    isInherited: false
+    isInherited: false,
+    supports: [11]
   },
   "-webkit-text-size-adjust": {
-    isInherited: true
+    isInherited: true,
+    supports: []
   },
   "-webkit-transform": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-transform-origin": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-webkit-transform-style": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-backface-visibility": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-perspective": {
-    isInherited: false
+    isInherited: false,
+    supports: [6]
   },
   "-webkit-perspective-origin": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-webkit-transition": {
-    isInherited: false
+    isInherited: false,
+    supports: [9, 10]
   },
   "-webkit-transition-delay": {
-    isInherited: false
+    isInherited: false,
+    supports: [9]
   },
   "-webkit-transition-duration": {
-    isInherited: false
+    isInherited: false,
+    supports: [9]
   },
   "-webkit-transition-property": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-transition-timing-function": {
-    isInherited: false
+    isInherited: false,
+    supports: [10]
   },
   "-webkit-border-radius": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-webkit-border-top-left-radius": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-webkit-border-top-right-radius": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-webkit-border-bottom-left-radius": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-webkit-border-bottom-right-radius": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-webkit-background-clip": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-background-origin": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-background-size": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-webkit-border-image": {
-    isInherited: false
+    isInherited: false,
+    supports: [4, 5, 6, 7, 8, 11]
   },
   "-webkit-box-shadow": {
-    isInherited: false
+    isInherited: false,
+    supports: [2, 6]
   },
   "-webkit-box-sizing": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-box-flex": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "-webkit-box-ordinal-group": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "-webkit-box-orient": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-box-direction": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-box-align": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-box-pack": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-flex-direction": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-flex-wrap": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-flex-flow": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-order": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "-webkit-flex": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 7, 8]
   },
   "-webkit-flex-grow": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "-webkit-flex-shrink": {
-    isInherited: false
+    isInherited: false,
+    supports: [7]
   },
   "-webkit-flex-basis": {
-    isInherited: false
+    isInherited: false,
+    supports: [6, 8]
   },
   "-webkit-justify-content": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-align-items": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-align-self": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-align-content": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   },
   "-webkit-user-select": {
-    isInherited: false
+    isInherited: false,
+    supports: []
   }
 };

--- a/devtools/shared/fronts/css-properties.js
+++ b/devtools/shared/fronts/css-properties.js
@@ -1,16 +1,17 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 "use strict";
 
 const { FrontClassWithSpec, Front } = require("devtools/shared/protocol");
 const { cssPropertiesSpec } = require("devtools/shared/specs/css-properties");
 const { Task } = require("devtools/shared/task");
+const { CSS_PROPERTIES } = require("devtools/shared/css-properties-db");
 
 /**
  * Build up a regular expression that matches a CSS variable token. This is an
  * ident token that starts with two dashes "--".
  *
  * https://www.w3.org/TR/css-syntax-3/#ident-token-diagram
  */
 var NON_ASCII = "[^\\x00-\\x7F]";
@@ -44,46 +45,65 @@ const CssPropertiesFront = FrontClassWit
   }
 });
 
 exports.CssPropertiesFront = CssPropertiesFront;
 
 /**
  * Ask questions to a CSS database. This class does not care how the database
  * gets loaded in, only the questions that you can ask to it.
+ * Prototype functions are bound to 'this' so they can be passed around as helper
+ * functions.
  *
  * @param {Array}  propertiesList
  *                 A list of known properties.
  * @param {Object} inheritedList
  *                 The key is the property name, the value is whether or not
  *                 that property is inherited.
  */
 function CssProperties(properties) {
   this.properties = properties;
-  // Bind isKnown and isInherited so it can be passed around to helper
-  // functions.
+
   this.isKnown = this.isKnown.bind(this);
   this.isInherited = this.isInherited.bind(this);
+  this.supportsType = this.supportsType.bind(this);
 }
 
 CssProperties.prototype = {
   /**
    * Checks to see if the property is known by the browser. This function has
    * `this` already bound so that it can be passed around by reference.
    *
-   * @param {String}   property
-   *                   The property name to be checked.
+   * @param {String} property The property name to be checked.
    * @return {Boolean}
    */
   isKnown(property) {
     return !!this.properties[property] || isCssVariable(property);
   },
 
+  /**
+   * Checks to see if the property is an inherited one.
+   *
+   * @param {String} property The property name to be checked.
+   * @return {Boolean}
+   */
   isInherited(property) {
     return this.properties[property] && this.properties[property].isInherited;
+  },
+
+  /**
+   * Checks if the property supports the given CSS type.
+   * CSS types should come from devtools/shared/css-properties-db.js' CSS_TYPES.
+   *
+   * @param {String} property The property to be checked.
+   * @param {Number} type One of the type values from CSS_TYPES.
+   * @return {Boolean}
+   */
+  supportsType(property, type) {
+    return this.properties[property] && this.properties[property].supports.includes(type);
   }
 };
 
 exports.CssProperties = CssProperties;
 
 /**
  * Create a CssProperties object with a fully loaded CSS database. The
  * CssProperties interface can be queried synchronously, but the initialization
@@ -98,25 +118,36 @@ exports.CssProperties = CssProperties;
 exports.initCssProperties = Task.async(function* (toolbox) {
   let client = toolbox.target.client;
   if (cachedCssProperties.has(client)) {
     return cachedCssProperties.get(client);
   }
 
   let db, front;
 
-  // Get the list dynamically if the cssProperties exists.
+  // Get the list dynamically if the cssProperties actor exists.
   if (toolbox.target.hasActor("cssProperties")) {
     front = CssPropertiesFront(client, toolbox.target.form);
     db = yield front.getCSSDatabase();
+
+    // Even if the target has the cssProperties actor, it may not be the latest version.
+    // So, the "supports" data may be missing.
+    // Start with the server's list (because that's the correct one), and add the supports
+    // information if required.
+    if (!db.color.supports) {
+      for (let name in db) {
+        db[name].supports = CSS_PROPERTIES[name].supports;
+      }
+    }
   } else {
-    // The target does not support this actor, so require a static list of
-    // supported properties.
-    db = require("devtools/shared/css-properties-db");
+    // The target does not support this actor, so require a static list of supported
+    // properties.
+    db = CSS_PROPERTIES;
   }
+
   const cssProperties = new CssProperties(db);
   cachedCssProperties.set(client, {cssProperties, front});
   return {cssProperties, front};
 });
 
 /**
  * Synchronously get a cached and initialized CssProperties.
  *