diff --git a/.changeset/animate-attribute-removal.md b/.changeset/animate-attribute-removal.md
new file mode 100644
index 000000000..48aa95ed5
--- /dev/null
+++ b/.changeset/animate-attribute-removal.md
@@ -0,0 +1,5 @@
+---
+'@react-spring/web': patch
+---
+
+fix: support removing attributes from animated elements
diff --git a/targets/web/src/applyAnimatedValues.ts b/targets/web/src/applyAnimatedValues.ts
index e05b84bf6..b78bf9ad9 100644
--- a/targets/web/src/applyAnimatedValues.ts
+++ b/targets/web/src/applyAnimatedValues.ts
@@ -22,7 +22,11 @@ const attributeCache: Lookup<string> = {}
 type Instance = HTMLDivElement & { style?: Lookup }
 
 export function applyAnimatedValues(instance: Instance, props: Lookup) {
-  if (!instance.nodeType || !instance.setAttribute) {
+  if (
+    !instance.nodeType ||
+    !instance.setAttribute ||
+    !instance.removeAttribute
+  ) {
     return false
   }
 
@@ -52,7 +56,7 @@ export function applyAnimatedValues(instance: Instance, props: Lookup) {
         ))
   )
 
-  if (children !== void 0) {
+  if (props.hasOwnProperty('children')) {
     instance.textContent = children
   }
 
@@ -70,7 +74,12 @@ export function applyAnimatedValues(instance: Instance, props: Lookup) {
 
   // Apply DOM attributes
   names.forEach((name, i) => {
-    instance.setAttribute(name, values[i])
+    const value = values[i]
+    if (value !== void 0) {
+      instance.setAttribute(name, value)
+    } else {
+      instance.removeAttribute(name)
+    }
   })
 
   if (className !== void 0) {
@@ -82,8 +91,12 @@ export function applyAnimatedValues(instance: Instance, props: Lookup) {
   if (scrollLeft !== void 0) {
     instance.scrollLeft = scrollLeft
   }
-  if (viewBox !== void 0) {
-    instance.setAttribute('viewBox', viewBox)
+  if (props.hasOwnProperty('viewBox')) {
+    if (viewBox !== void 0) {
+      instance.setAttribute('viewBox', viewBox)
+    } else {
+      instance.removeAttribute('viewBox')
+    }
   }
 }