diff --git a/demo/BooleanPropTest.mjs b/demo/BooleanPropTest.mjs
new file mode 100644
index 0000000..6898cbb
--- /dev/null
+++ b/demo/BooleanPropTest.mjs
@@ -0,0 +1,17 @@
+import WebComponent from "../src/WebComponent.js";
+
+export class BooleanPropTest extends WebComponent {
+  isInline = false;
+
+  static properties = ["is-inline"];
+
+  onChanges(changes) {
+    console.log(">>> boolean prop test", changes);
+  }
+
+  get template() {
+    return `<span>${this.isInline}</span>`;
+  }
+}
+
+customElements.define("boolean-prop-test", BooleanPropTest);
diff --git a/demo/index.html b/demo/index.html
index 13c676a..3f61b0a 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -6,23 +6,22 @@
     <title>WC demo</title>
     <script type="module" src="HelloWorld.mjs"></script>
     <script type="module" src="SimpleText.mjs"></script>
+    <script type="module" src="BooleanPropTest.mjs"></script>
   </head>
   <body>
     <hello-world id="hey" data-name="Ayo" emotion="sad"></hello-world>
     <p>
       <simple-text greeting="hey"></simple-text>
     </p>
+    <p>
+      <boolean-prop-test></boolean-prop-test>
+    </p>
 
     <script type="module">
       const helloWorld = document.querySelector("hello-world");
       setTimeout(() => {
         helloWorld.setAttribute("emotion", "excited");
       }, 2500);
-
-      const clickableText = document.querySelector("simple-text");
-      setTimeout(() => {
-        clickableText.remove();
-      }, 2000);
     </script>
   </body>
 </html>
diff --git a/src/WebComponent.js b/src/WebComponent.js
index 2a32984..a31d3d4 100644
--- a/src/WebComponent.js
+++ b/src/WebComponent.js
@@ -90,8 +90,8 @@ export class WebComponent extends HTMLElement {
   attributeChangedCallback(property, previousValue, currentValue) {
     const camelCaps = this.#getCamelCaps(property);
     if (previousValue !== currentValue) {
-      this[property] = currentValue;
-      this[camelCaps] = currentValue;
+      this[property] = currentValue === "" || currentValue;
+      this[camelCaps] = currentValue === "" || currentValue;
       this.render();
       this.onChanges({ property, previousValue, currentValue });
     }
