diff --git a/Button/button2.mch b/Button/button2.mch
index da3522cab65954e501916119399ba3e148dc46ab..e66194d1ef807c5912c9fb604554e0eda55a0fcc 100644
--- a/Button/button2.mch
+++ b/Button/button2.mch
@@ -2,7 +2,8 @@ MACHINE button2
 // a version of button with just two events
 DEFINITIONS
      "LibraryMeta.def";
-      VISB_JSON_FILE == "button2.json"
+      VISB_JSON_FILE == "button2.json";
+      VISB_JSON_FILE2 == "button2_3d.json"
 VARIABLES
   button
 INVARIANT
diff --git a/Button/button2_3d.json b/Button/button2_3d.json
new file mode 100644
index 0000000000000000000000000000000000000000..b57a72b5ba11c26290a839c380456a587253e43c
--- /dev/null
+++ b/Button/button2_3d.json
@@ -0,0 +1,43 @@
+{
+  "svg": "x3dom_button.html",
+  "model": "button2.mch",
+  "model-name": "button2",
+
+  "items": [
+    {
+      "id": "button_%0",
+      "attr": "visible",
+      "value": "IF button=%0 THEN \"true\" ELSE \"false\" END",
+      "repeat": [ "TRUE", "FALSE" ]
+    },
+    {
+      "id": "box_col",
+      "attr": "diffuseColor",
+      "value": "IF button=TRUE THEN \"1 0 0\" ELSE \"0 1 0\" END"
+    }
+  ],
+  "events": [
+    {
+      "id": "button",
+      "event": "press_button",
+      "hovers": [{ "id":"hover_message",
+                    "attr":"text", "enter":"Press", "leave":""}]
+    },
+    {
+      "id": "button",
+      "event": "release_button"
+    },
+    {
+      "id": "button_TRUE",
+      "event": "",
+      "hovers": [{ "id":"hover_message",
+                    "attr":"text", "enter":"Button=TRUE", "leave":""}]
+    },
+    {
+      "id": "button_FALSE",
+      "event": "",
+      "hovers": [{ "id":"hover_message",
+                    "attr":"text", "enter":"Button=FALSE", "leave":""}]
+    }
+  ]
+}
diff --git a/Button/x3dom_button.html b/Button/x3dom_button.html
new file mode 100644
index 0000000000000000000000000000000000000000..754c92071175549f57696db39973167776623d3e
--- /dev/null
+++ b/Button/x3dom_button.html
@@ -0,0 +1,38 @@
+ <script type='text/javascript' src='https://www.x3dom.org/download/x3dom.js'> </script> 
+     <link rel='stylesheet' type='text/css' href='https://www.x3dom.org/download/x3dom.css'></link>
+     
+     <h1>Using X3DOM for VisB</h1> 
+     <p> 
+       This illustrates how one can use VisB to manipulated 3D Objects
+     </p> 
+	 <x3d width='500px' height='400px'> 
+	   <scene> 
+		<transform id="box_trans" translation='0 0 0'> 
+		<shape id="button"> 
+		   <appearance> 
+			 <material id="box_col" diffuseColor='1 0 0'></material> 
+		   </appearance> 
+		   <box></box> 
+		</shape> 
+		<transform translation='-3 0 0'> 
+		  <shape id = "button_TRUE"> 
+			 <appearance> 
+			   <material diffuseColor='0 1 0'></material> 
+			 </appearance> 
+			 <cone></cone> 
+		  </shape> 
+		</transform> 
+		<transform id="sphere_trans" translation='3 0 0'> 
+		  <shape id = "button_FALSE"> 
+			 <appearance> 
+			   <material id="sphere_col" diffuseColor='0 0 1'></material> 
+			 </appearance> 
+			 <sphere></sphere> 
+		  </shape> 
+		</transform> 
+	   </scene> 
+	</x3d> 
+<ul>
+<li>Message: <b><span id="hover_message"></span></b>
+</li>
+</ul>
\ No newline at end of file