diff --git a/design/url-property-click.pen b/design/url-property-click.pen
new file mode 100644
index 00000000..8a60ac79
--- /dev/null
+++ b/design/url-property-click.pen
@@ -0,0 +1,173 @@
+{
+  "children": [
+    {
+      "type": "frame",
+      "id": "urlDefault",
+      "x": 0,
+      "y": 0,
+      "name": "URL Property — default state (no hover)",
+      "width": 320,
+      "height": 40,
+      "fill": "#ffffff",
+      "layout": "horizontal",
+      "alignItems": "center",
+      "padding": [6, 6],
+      "gap": 8,
+      "children": [
+        {
+          "type": "text",
+          "id": "urlDefaultLabel",
+          "name": "label",
+          "content": "URL",
+          "fontSize": 10,
+          "fontWeight": 600,
+          "letterSpacing": 1.2,
+          "textTransform": "uppercase",
+          "fill": "#6b7280"
+        },
+        {
+          "type": "frame",
+          "id": "urlDefaultValueWrap",
+          "name": "value-wrapper",
+          "width": "fill_container",
+          "layout": "horizontal",
+          "alignItems": "center",
+          "justifyContent": "end",
+          "gap": 4,
+          "children": [
+            {
+              "type": "text",
+              "id": "urlDefaultValue",
+              "name": "url-value",
+              "content": "https://example.com/article",
+              "fontSize": 13,
+              "fill": "#374151",
+              "textAlign": "right"
+            },
+            {
+              "type": "text",
+              "id": "urlDefaultEditIcon",
+              "name": "edit-icon",
+              "content": "pencil",
+              "fontSize": 12,
+              "fill": "#9ca3af",
+              "opacity": 0
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "type": "frame",
+      "id": "urlHover",
+      "x": 0,
+      "y": 60,
+      "name": "URL Property — hover state (underline + pointer cursor)",
+      "width": 320,
+      "height": 40,
+      "fill": "#f9fafb",
+      "layout": "horizontal",
+      "alignItems": "center",
+      "padding": [6, 6],
+      "gap": 8,
+      "children": [
+        {
+          "type": "text",
+          "id": "urlHoverLabel",
+          "name": "label",
+          "content": "URL",
+          "fontSize": 10,
+          "fontWeight": 600,
+          "letterSpacing": 1.2,
+          "textTransform": "uppercase",
+          "fill": "#6b7280"
+        },
+        {
+          "type": "frame",
+          "id": "urlHoverValueWrap",
+          "name": "value-wrapper",
+          "width": "fill_container",
+          "layout": "horizontal",
+          "alignItems": "center",
+          "justifyContent": "end",
+          "gap": 4,
+          "children": [
+            {
+              "type": "text",
+              "id": "urlHoverValue",
+              "name": "url-value-hovered",
+              "content": "https://example.com/article",
+              "fontSize": 13,
+              "fill": "#2563eb",
+              "textDecoration": "underline",
+              "textAlign": "right"
+            },
+            {
+              "type": "text",
+              "id": "urlHoverEditIcon",
+              "name": "edit-icon-visible",
+              "content": "pencil",
+              "fontSize": 12,
+              "fill": "#6b7280",
+              "opacity": 1
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "type": "frame",
+      "id": "urlEdit",
+      "x": 0,
+      "y": 120,
+      "name": "URL Property — edit mode (double-click or edit icon)",
+      "width": 320,
+      "height": 40,
+      "fill": "#ffffff",
+      "layout": "horizontal",
+      "alignItems": "center",
+      "padding": [6, 6],
+      "gap": 8,
+      "children": [
+        {
+          "type": "text",
+          "id": "urlEditLabel",
+          "name": "label",
+          "content": "URL",
+          "fontSize": 10,
+          "fontWeight": 600,
+          "letterSpacing": 1.2,
+          "textTransform": "uppercase",
+          "fill": "#6b7280"
+        },
+        {
+          "type": "frame",
+          "id": "urlEditInputWrap",
+          "name": "input-wrapper",
+          "width": "fill_container",
+          "height": 28,
+          "fill": "#f3f4f6",
+          "cornerRadius": 4,
+          "stroke": {
+            "align": "inside",
+            "thickness": 1,
+            "fill": "#6366f1"
+          },
+          "padding": [4, 8],
+          "alignItems": "center",
+          "children": [
+            {
+              "type": "text",
+              "id": "urlEditInput",
+              "name": "edit-input",
+              "content": "https://example.com/article",
+              "fontSize": 13,
+              "fill": "#111827"
+            }
+          ]
+        }
+      ]
+    }
+  ],
+  "variables": {}
+}
\ No newline at end of file