diff --git a/client-hints/resources/2x3-svg-scaled-by-sec-ch-width.py b/client-hints/resources/2x3-svg-scaled-by-sec-ch-width.py
new file mode 100644
index 00000000000000..d53574c361213d
--- /dev/null
+++ b/client-hints/resources/2x3-svg-scaled-by-sec-ch-width.py
@@ -0,0 +1,22 @@
+def main(request, response):
+    """
+    Simple handler that responds with an SVG image with width `2 * sec-ch-width`
+    and height `3 * sec-ch-width`, or 1x1 if sec-ch-width is not present.
+    """
+
+    width = 1
+    height = 1
+
+    if b"sec-ch-width" in request.headers:
+      sec_ch_width = request.headers.get(b"sec-ch-width").decode()
+      width = 2 * int(sec_ch_width)
+      height = 3 * int(sec_ch_width)
+
+    response.headers.set(b"Content-Type", b"image/svg+xml")
+    response.content = str.encode(f"""<svg
+        xmlns="http://www.w3.org/2000/svg"
+        xmlns:xlink="http://www.w3.org/1999/xlink"
+        width="{width}"
+        height="{height}">
+      <rect width="100%" height="100%" fill="green" />
+    </svg>""")
diff --git a/client-hints/sec-ch-width.https.html b/client-hints/sec-ch-width.https.html
new file mode 100644
index 00000000000000..f44fa3bb5e1c6f
--- /dev/null
+++ b/client-hints/sec-ch-width.https.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<meta http-equiv="Delegate-CH" content="Sec-CH-Width">
+<title>Tests Sec-CH-Width</title>
+<link rel="help" href="https://wicg.github.io/responsive-image-client-hints/#sec-ch-width">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+
+<img src="resources/2x3-svg-scaled-by-sec-ch-width.py" width="50" height="50">
+
+<script>
+  promise_test(async (test) => {
+    const testImage = document.getElementsByTagName('img')[0];
+    await new Promise(resolve => testImage.onload = resolve);
+    assert_equals(testImage.naturalWidth, 100);
+    assert_equals(testImage.naturalHeight, 150);
+  }, 'Sec-CH-Width should be set');
+</script>
