diff --git a/files/en-us/web/api/domrect/domrect/index.md b/files/en-us/web/api/domrect/domrect/index.md
index 01eb502dd82a2fd..887ca5241a45b99 100644
--- a/files/en-us/web/api/domrect/domrect/index.md
+++ b/files/en-us/web/api/domrect/domrect/index.md
@@ -18,13 +18,13 @@ new DOMRect(x, y, width, height)
 
 ### Parameters
 
-- `x`
+- {{domxref("DOMRect.x", "x")}}
   - : The `x` coordinate of the `DOMRect`'s origin.
-- `y`
+- {{domxref("DOMRect.y", "y")}}
   - : The `y` coordinate of the `DOMRect`'s origin.
-- `width`
+- {{domxref("DOMRect.width", "width")}}
   - : The width of the `DOMRect`.
-- `height`
+- {{domxref("DOMRect.height", "height")}}
   - : The height of the `DOMRect`.
 
 ### Return value
diff --git a/files/en-us/web/api/domrect/height/index.md b/files/en-us/web/api/domrect/height/index.md
new file mode 100644
index 000000000000000..3de1e0c5491b7b6
--- /dev/null
+++ b/files/en-us/web/api/domrect/height/index.md
@@ -0,0 +1,27 @@
+---
+title: "DOMRect: height property"
+short-title: height
+slug: Web/API/DOMRect/height
+page-type: web-api-instance-property
+browser-compat: api.DOMRect.height
+---
+
+{{APIRef("Geometry Interfaces")}}{{AvailableInWorkers}}
+
+The **`height`** property of the {{domxref("DOMRect")}} interface represents the height of the rectangle. The value can be negative.
+
+## Value
+
+A double.
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{domxref("DOMRectReadOnly")}}
diff --git a/files/en-us/web/api/domrect/index.md b/files/en-us/web/api/domrect/index.md
index f9b6a0b84f5061a..29b86f58f808c5f 100644
--- a/files/en-us/web/api/domrect/index.md
+++ b/files/en-us/web/api/domrect/index.md
@@ -24,13 +24,13 @@ It inherits from its parent, {{domxref("DOMRectReadOnly")}}.
 
 _`DOMRect` inherits properties from its parent, {{domxref("DOMRectReadOnly")}}. The difference is that they are not read-only anymore._
 
-- {{domxref("DOMRectReadOnly.x")}}
+- {{domxref("DOMRect.x")}}
   - : The x coordinate of the `DOMRect`'s origin (typically the top-left corner of the rectangle).
-- {{domxref("DOMRectReadOnly.y")}}
+- {{domxref("DOMRect.y")}}
   - : The y coordinate of the `DOMRect`'s origin (typically the top-left corner of the rectangle).
-- {{domxref("DOMRectReadOnly.width")}}
+- {{domxref("DOMRect.width")}}
   - : The width of the `DOMRect`.
-- {{domxref("DOMRectReadOnly.height")}}
+- {{domxref("DOMRect.height")}}
   - : The height of the `DOMRect`.
 - {{domxref("DOMRectReadOnly.top")}}
   - : Returns the top coordinate value of the `DOMRect` (has the same value as `y`, or `y + height` if `height` is negative).
diff --git a/files/en-us/web/api/domrect/width/index.md b/files/en-us/web/api/domrect/width/index.md
new file mode 100644
index 000000000000000..c6bccf91230757f
--- /dev/null
+++ b/files/en-us/web/api/domrect/width/index.md
@@ -0,0 +1,27 @@
+---
+title: "DOMRect: width property"
+short-title: width
+slug: Web/API/DOMRect/width
+page-type: web-api-instance-property
+browser-compat: api.DOMRect.width
+---
+
+{{APIRef("Geometry Interfaces")}}{{AvailableInWorkers}}
+
+The **`width`** property of the {{domxref("DOMRect")}} interface represents the width of the rectangle. The value can be negative.
+
+## Value
+
+A double.
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{domxref("DOMRectReadOnly")}}
diff --git a/files/en-us/web/api/domrect/x/index.md b/files/en-us/web/api/domrect/x/index.md
new file mode 100644
index 000000000000000..0810c777f9ef0a3
--- /dev/null
+++ b/files/en-us/web/api/domrect/x/index.md
@@ -0,0 +1,29 @@
+---
+title: "DOMRect: x property"
+short-title: x
+slug: Web/API/DOMRect/x
+page-type: web-api-instance-property
+browser-compat: api.DOMRect.x
+---
+
+{{APIRef("Geometry Interfaces")}}{{AvailableInWorkers}}
+
+The **`x`** property of the {{domxref("DOMRect")}} interface represents the x-coordinate of the rectangle, which is the horizontal distance between the viewport's left edge and the rectangle's origin.
+
+When the rectangle's width is non-negative, the rectangle's horizontal origin is the viewport's left edge. If the width is negative, the rectangle's horizontal origin is the viewport's right edge.
+
+## Value
+
+A double.
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{domxref("DOMRectReadOnly")}}
diff --git a/files/en-us/web/api/domrect/y/index.md b/files/en-us/web/api/domrect/y/index.md
new file mode 100644
index 000000000000000..400647a66cf83a1
--- /dev/null
+++ b/files/en-us/web/api/domrect/y/index.md
@@ -0,0 +1,29 @@
+---
+title: "DOMRect: y property"
+short-title: "y"
+slug: Web/API/DOMRect/y
+page-type: web-api-instance-property
+browser-compat: api.DOMRect.y
+---
+
+{{APIRef("Geometry Interfaces")}}{{AvailableInWorkers}}
+
+The **`y`** property of the {{domxref("DOMRect")}} interface represents the y-coordinate of the rectangle, which is the vertical distance between the viewport's top edge and the rectangle's origin.
+
+When the rectangle's height is non-negative, the rectangle's vertical origin is the viewport's top edge. If the height has a negative height, the rectangle's vertical origin is the viewport's bottom edge.
+
+## Value
+
+A double.
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{domxref("DOMRectReadOnly")}}