{
"backface-visibility-property": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/properties/backface-visibility.json",
"name": "backface-visibility",
"slug": "CSS/backface-visibility",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/backface-visibility",
"summary": "The backface-visibility CSS property sets whether the back face of an element is visible when turned towards the user.",
"support": {
"chrome": [
{
"version_added": "36"
},
{
"prefix": "-webkit-",
"version_added": "12"
}
],
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": [
{
"version_added": "16"
},
{
"version_added": "49",
"prefix": "-webkit-"
},
{
"prefix": "-moz-",
"version_added": "10"
}
],
"firefox_android": "mirror",
"ie": {
"version_added": "10"
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": [
{
"version_added": "15.4"
},
{
"prefix": "-webkit-",
"version_added": "5.1"
}
],
"safari_ios": "mirror",
"samsunginternet_android": "mirror",
"webview_android": [
{
"version_added": "37"
},
{
"prefix": "-webkit-",
"version_added": "3"
}
],
"edge_blink": [
{
"version_added": "79"
},
{
"prefix": "-webkit-",
"version_added": "79"
}
]
},
"title": "backface-visibility"
}
],
"perspective-origin-property": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/properties/perspective-origin.json",
"name": "perspective-origin",
"slug": "CSS/perspective-origin",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/perspective-origin",
"summary": "The perspective-origin CSS property determines the position at which the viewer is looking. It is used as the vanishing point by the perspective property.",
"support": {
"chrome": [
{
"version_added": "36"
},
{
"prefix": "-webkit-",
"version_added": "12"
}
],
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": [
{
"version_added": "16"
},
{
"version_added": "49",
"prefix": "-webkit-"
},
{
"prefix": "-moz-",
"version_added": "10"
}
],
"firefox_android": "mirror",
"ie": {
"version_added": "10"
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": [
{
"version_added": "9"
},
{
"prefix": "-webkit-",
"version_added": "4"
}
],
"safari_ios": [
{
"version_added": "9"
},
{
"prefix": "-webkit-",
"version_added": "2"
}
],
"samsunginternet_android": "mirror",
"webview_android": [
{
"version_added": "4.4"
},
{
"prefix": "-webkit-",
"version_added": "3"
}
],
"edge_blink": [
{
"version_added": "79"
},
{
"prefix": "-webkit-",
"version_added": "79"
}
]
},
"title": "perspective-origin"
}
],
"perspective-property": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/properties/perspective.json",
"name": "perspective",
"slug": "CSS/perspective",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/perspective",
"summary": "The perspective CSS property determines the distance between the z=0 plane and the user in order to give a 3D-positioned element some perspective.",
"support": {
"chrome": [
{
"version_added": "36"
},
{
"prefix": "-webkit-",
"version_added": "12"
}
],
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": [
{
"version_added": "16"
},
{
"version_added": "49",
"prefix": "-webkit-"
},
{
"prefix": "-moz-",
"version_added": "10"
}
],
"firefox_android": "mirror",
"ie": {
"version_added": "10"
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": [
{
"version_added": "9"
},
{
"prefix": "-webkit-",
"version_added": "4"
}
],
"safari_ios": [
{
"version_added": "9"
},
{
"prefix": "-webkit-",
"version_added": "2"
}
],
"samsunginternet_android": "mirror",
"webview_android": [
{
"version_added": "4.4"
},
{
"prefix": "-webkit-",
"version_added": "3"
}
],
"edge_blink": [
{
"version_added": "79"
},
{
"prefix": "-webkit-",
"version_added": "79"
}
]
},
"title": "perspective"
}
],
"individual-transforms": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/properties/rotate.json",
"name": "rotate",
"slug": "CSS/rotate",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/rotate",
"summary": "The rotate CSS property allows you to specify rotation transforms individually and independently of the transform property. This maps better to typical user interface usage, and saves having to remember the exact order of transform functions to specify in the transform property.",
"support": {
"chrome": {
"version_added": "104"
},
"chrome_android": "mirror",
"edge": "mirror",
"firefox": {
"version_added": "72"
},
"firefox_android": "mirror",
"ie": {
"version_added": false
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": {
"version_added": "14.1"
},
"safari_ios": "mirror",
"samsunginternet_android": "mirror",
"webview_android": "mirror",
"edge_blink": {
"version_added": "104"
}
},
"title": "rotate"
},
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/properties/scale.json",
"name": "scale",
"slug": "CSS/scale",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/scale",
"summary": "The scale CSS property allows you to specify scale transforms individually and independently of the transform property. This maps better to typical user interface usage, and saves having to remember the exact order of transform functions to specify in the transform value.",
"support": {
"chrome": {
"version_added": "104"
},
"chrome_android": "mirror",
"edge": "mirror",
"firefox": {
"version_added": "72"
},
"firefox_android": "mirror",
"ie": {
"version_added": false
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": {
"version_added": "14.1"
},
"safari_ios": "mirror",
"samsunginternet_android": "mirror",
"webview_android": "mirror",
"edge_blink": {
"version_added": "104"
}
},
"title": "scale"
},
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/properties/translate.json",
"name": "translate",
"slug": "CSS/translate",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/translate",
"summary": "The translate CSS property allows you to specify translation transforms individually and independently of the transform property. This maps better to typical user interface usage, and saves having to remember the exact order of transform functions to specify in the transform value.",
"support": {
"chrome": {
"version_added": "104"
},
"chrome_android": "mirror",
"edge": "mirror",
"firefox": {
"version_added": "72"
},
"firefox_android": "mirror",
"ie": {
"version_added": false
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": {
"version_added": "14.1"
},
"safari_ios": "mirror",
"samsunginternet_android": "mirror",
"webview_android": "mirror",
"edge_blink": {
"version_added": "104"
}
},
"title": "translate"
}
],
"transform-style-property": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/properties/transform-style.json",
"name": "transform-style",
"slug": "CSS/transform-style",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/transform-style",
"summary": "The transform-style CSS property sets whether children of an element are positioned in the 3D space or are flattened in the plane of the element.",
"support": {
"chrome": [
{
"version_added": "36"
},
{
"prefix": "-webkit-",
"version_added": "12"
}
],
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": [
{
"version_added": "16"
},
{
"prefix": "-webkit-",
"version_added": "49"
},
{
"prefix": "-moz-",
"version_added": "10"
}
],
"firefox_android": "mirror",
"ie": {
"version_added": false
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": [
{
"version_added": "9"
},
{
"prefix": "-webkit-",
"version_added": "4"
}
],
"safari_ios": [
{
"version_added": "9"
},
{
"prefix": "-webkit-",
"version_added": "2"
}
],
"samsunginternet_android": "mirror",
"webview_android": [
{
"version_added": "4.4"
},
{
"prefix": "-webkit-",
"version_added": "3"
}
],
"edge_blink": [
{
"version_added": "79"
},
{
"prefix": "-webkit-",
"version_added": "79"
}
]
},
"title": "transform-style"
}
],
"transform-functions": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/properties/transform.json",
"name": "transform",
"slug": "CSS/transform",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/transform",
"summary": "The transform CSS property lets you rotate, scale, skew, or translate an element. It modifies the coordinate space of the CSS visual formatting model.",
"support": {
"chrome": [
{
"version_added": "36"
},
{
"prefix": "-webkit-",
"version_added": "1"
}
],
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": [
{
"version_added": "16"
},
{
"prefix": "-webkit-",
"version_added": "49"
}
],
"firefox_android": "mirror",
"ie": [
{
"version_added": "10",
"notes": "Internet Explorer does not support the global values initial and unset."
},
{
"prefix": "-webkit-",
"version_added": "11"
},
{
"prefix": "-ms-",
"version_added": "9",
"notes": "Internet Explorer 5.5 or later supports a proprietary Matrix Filter which can be used to achieve a similar effect."
}
],
"oculus": "mirror",
"opera": [
{
"version_added": "23"
},
{
"prefix": "-webkit-",
"version_added": "15"
},
{
"version_added": "12.1",
"version_removed": "15"
},
{
"prefix": "-o-",
"version_added": "10.5",
"version_removed": "15"
}
],
"opera_android": [
{
"version_added": "24"
},
{
"prefix": "-webkit-",
"version_added": "14"
},
{
"version_added": "12.1",
"version_removed": "14"
},
{
"prefix": "-o-",
"version_added": "11",
"version_removed": "14"
}
],
"safari": [
{
"version_added": "9"
},
{
"prefix": "-webkit-",
"version_added": "3.1"
}
],
"safari_ios": [
{
"version_added": "9"
},
{
"prefix": "-webkit-",
"version_added": "3.2"
}
],
"samsunginternet_android": "mirror",
"webview_android": [
{
"version_added": "4.4"
},
{
"prefix": "-webkit-",
"version_added": "2",
"notes": "Android 2.3 has a bug where input forms will \"jump\" when typing, if any container element has a -webkit-transform."
}
],
"edge_blink": [
{
"version_added": "79"
},
{
"prefix": "-webkit-",
"version_added": "79"
}
]
},
"title": "transform"
},
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/types/transform-function.json",
"name": "transform-function",
"slug": "CSS/transform-function",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function",
"summary": "The CSS data type represents a transformation that affects an element's appearance. Transformation functions can rotate, resize, distort, or move an element in 2D or 3D space. It is used in the transform property.",
"support": {
"chrome": {
"version_added": "1"
},
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": {
"version_added": "3.5"
},
"firefox_android": "mirror",
"ie": {
"version_added": "9",
"notes": "Internet Explorer 9 supports 2D but not 3D transforms. In version 9, mixing 2D and 3D transform functions invalidates the entire property."
},
"oculus": "mirror",
"opera": {
"version_added": "10.5"
},
"opera_android": {
"version_added": "11"
},
"safari": {
"version_added": "3.1"
},
"safari_ios": {
"version_added": "3.2"
},
"samsunginternet_android": "mirror",
"webview_android": {
"version_added": "2"
},
"edge_blink": {
"version_added": "79"
}
},
"title": ""
}
],
"funcdef-matrix3d": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/types/transform-function.json",
"name": "matrix3d",
"slug": "CSS/transform-function/matrix3d",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/matrix3d",
"summary": "The matrix3d() CSS function defines a 3D transformation as a 4x4 homogeneous matrix. Its result is a data type.",
"support": {
"chrome": {
"version_added": "12"
},
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": {
"version_added": "10",
"notes": "Before Firefox 16, the translation values of matrix3d() could be <length>s, in addition to the standard <number>."
},
"firefox_android": {
"version_added": "10"
},
"ie": {
"version_added": "10"
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": {
"version_added": "4"
},
"safari_ios": "mirror",
"samsunginternet_android": "mirror",
"webview_android": {
"version_added": "3"
},
"edge_blink": {
"version_added": "79"
}
},
"title": "matrix3d()"
}
],
"funcdef-perspective": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/types/transform-function.json",
"name": "perspective",
"slug": "CSS/transform-function/perspective",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/perspective",
"summary": "The perspective() CSS function defines a transformation that sets the distance between the user and the z=0 plane, the perspective from which the viewer would be if the 2-dimensional interface were 3-dimensional. Its result is a data type.",
"support": {
"chrome": {
"version_added": "12"
},
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": {
"version_added": "10"
},
"firefox_android": "mirror",
"ie": {
"version_added": "10"
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": {
"version_added": "4"
},
"safari_ios": "mirror",
"samsunginternet_android": "mirror",
"webview_android": {
"version_added": "3"
},
"edge_blink": {
"version_added": "79"
}
},
"title": "perspective()"
}
],
"funcdef-rotate3d": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/types/transform-function.json",
"name": "rotate3d",
"slug": "CSS/transform-function/rotate3d",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotate3d",
"summary": "The rotate3d() CSS function defines a transformation that rotates an element around a fixed axis in 3D space, without deforming it. Its result is a data type.",
"support": {
"chrome": {
"version_added": "12"
},
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": {
"version_added": "10"
},
"firefox_android": "mirror",
"ie": {
"version_added": "10"
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": {
"version_added": "4"
},
"safari_ios": "mirror",
"samsunginternet_android": "mirror",
"webview_android": {
"version_added": "3"
},
"edge_blink": {
"version_added": "79"
}
},
"title": "rotate3d()"
}
],
"funcdef-rotatex": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/types/transform-function.json",
"name": "rotateX",
"slug": "CSS/transform-function/rotateX",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotateX",
"summary": "The rotateX() CSS function defines a transformation that rotates an element around the abscissa (horizontal axis) without deforming it. Its result is a data type.",
"support": {
"chrome": {
"version_added": "12"
},
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": {
"version_added": "10"
},
"firefox_android": "mirror",
"ie": {
"version_added": "10"
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": {
"version_added": "4"
},
"safari_ios": "mirror",
"samsunginternet_android": "mirror",
"webview_android": {
"version_added": "3"
},
"edge_blink": {
"version_added": "79"
}
},
"title": "rotateX()"
}
],
"funcdef-rotatey": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/types/transform-function.json",
"name": "rotateY",
"slug": "CSS/transform-function/rotateY",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotateY",
"summary": "The rotateY() CSS function defines a transformation that rotates an element around the ordinate (vertical axis) without deforming it. Its result is a data type.",
"support": {
"chrome": {
"version_added": "12"
},
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": {
"version_added": "10"
},
"firefox_android": "mirror",
"ie": {
"version_added": "10"
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": {
"version_added": "4"
},
"safari_ios": "mirror",
"samsunginternet_android": "mirror",
"webview_android": {
"version_added": "3"
},
"edge_blink": {
"version_added": "79"
}
},
"title": "rotateY()"
}
],
"funcdef-rotatez": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/types/transform-function.json",
"name": "rotateZ",
"slug": "CSS/transform-function/rotateZ",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotateZ",
"summary": "The rotateZ() CSS function defines a transformation that rotates an element around the z-axis without deforming it. Its result is a data type.",
"support": {
"chrome": {
"version_added": "12"
},
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": {
"version_added": "10"
},
"firefox_android": "mirror",
"ie": {
"version_added": "10"
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": {
"version_added": "4"
},
"safari_ios": "mirror",
"samsunginternet_android": "mirror",
"webview_android": {
"version_added": "3"
},
"edge_blink": {
"version_added": "79"
}
},
"title": "rotateZ()"
}
],
"funcdef-scale3d": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/types/transform-function.json",
"name": "scale3d",
"slug": "CSS/transform-function/scale3d",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/scale3d",
"summary": "The scale3d() CSS function defines a transformation that resizes an element in 3D space. Because the amount of scaling is defined by a vector, it can resize different dimensions at different scales. Its result is a data type.",
"support": {
"chrome": {
"version_added": "12"
},
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": {
"version_added": "10"
},
"firefox_android": "mirror",
"ie": {
"version_added": "10"
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": {
"version_added": "4"
},
"safari_ios": "mirror",
"samsunginternet_android": "mirror",
"webview_android": {
"version_added": "3"
},
"edge_blink": {
"version_added": "79"
}
},
"title": "scale3d()"
}
],
"funcdef-scalez": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/types/transform-function.json",
"name": "scaleZ",
"slug": "CSS/transform-function/scaleZ",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/scaleZ",
"summary": "The scaleZ() CSS function defines a transformation that resizes an element along the z-axis. Its result is a data type.",
"support": {
"chrome": {
"version_added": "12"
},
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": {
"version_added": "10"
},
"firefox_android": "mirror",
"ie": {
"version_added": "10"
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": {
"version_added": "4"
},
"safari_ios": "mirror",
"samsunginternet_android": "mirror",
"webview_android": {
"version_added": "3"
},
"edge_blink": {
"version_added": "79"
}
},
"title": "scaleZ()"
}
],
"funcdef-translate3d": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/types/transform-function.json",
"name": "translate3d",
"slug": "CSS/transform-function/translate3d",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translate3d",
"summary": "The translate3d() CSS function repositions an element in 3D space. Its result is a data type.",
"support": {
"chrome": {
"version_added": "12"
},
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": {
"version_added": "10"
},
"firefox_android": "mirror",
"ie": {
"version_added": "10"
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": {
"version_added": "4"
},
"safari_ios": "mirror",
"samsunginternet_android": "mirror",
"webview_android": {
"version_added": "3"
},
"edge_blink": {
"version_added": "79"
}
},
"title": "translate3d()"
}
],
"funcdef-translatez": [
{
"engines": [
"blink",
"gecko",
"webkit"
],
"filename": "css/types/transform-function.json",
"name": "translateZ",
"slug": "CSS/transform-function/translateZ",
"mdn_url": "https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translateZ",
"summary": "The translateZ() CSS function repositions an element along the z-axis in 3D space, i.e., closer to or farther away from the viewer. Its result is a data type.",
"support": {
"chrome": {
"version_added": "12"
},
"chrome_android": "mirror",
"edge": {
"version_added": "12"
},
"firefox": {
"version_added": "10"
},
"firefox_android": "mirror",
"ie": {
"version_added": "10"
},
"oculus": "mirror",
"opera": "mirror",
"opera_android": "mirror",
"safari": {
"version_added": "4"
},
"safari_ios": "mirror",
"samsunginternet_android": "mirror",
"webview_android": {
"version_added": "3"
},
"edge_blink": {
"version_added": "79"
}
},
"title": "translateZ()"
}
]
}