diff --git a/example/pubspec.lock b/example/pubspec.lock
index 09194e4..611c6eb 100644
--- a/example/pubspec.lock
+++ b/example/pubspec.lock
@@ -203,10 +203,10 @@ packages:
     dependency: transitive
     description:
       name: meta
-      sha256: e3641ec5d63ebf0d9b41bd43201a66e3fc79a65db5f61fc181f04cd27aab950c
+      sha256: "23f08335362185a5ea2ad3a4e597f1375e78bce8a040df5c600c8d3552ef2394"
       url: "https://pub.dev"
     source: hosted
-    version: "1.16.0"
+    version: "1.17.0"
   path:
     dependency: transitive
     description:
@@ -280,10 +280,10 @@ packages:
     dependency: transitive
     description:
       name: test_api
-      sha256: "522f00f556e73044315fa4585ec3270f1808a4b186c936e612cab0b565ff1e00"
+      sha256: ab2726c1a94d3176a45960b6234466ec367179b87dd74f1611adb1f3b5fb9d55
       url: "https://pub.dev"
     source: hosted
-    version: "0.7.6"
+    version: "0.7.7"
   typed_data:
     dependency: transitive
     description:
diff --git a/lib/cli_commands.dart b/lib/cli_commands.dart
old mode 100644
new mode 100755
index 1779ef1..0e58ee5
--- a/lib/cli_commands.dart
+++ b/lib/cli_commands.dart
@@ -6,6 +6,7 @@ library;
 import 'dart:isolate';
 
 import 'package:ansicolor/ansicolor.dart';
+import 'package:html/dom.dart';
 import 'package:html/parser.dart' as html_parser;
 import 'package:image/image.dart';
 import 'package:meta/meta.dart';
diff --git a/lib/templates.dart b/lib/templates.dart
old mode 100644
new mode 100755
index 010baed..8a14807
--- a/lib/templates.dart
+++ b/lib/templates.dart
@@ -406,7 +406,7 @@ const String _iOSBrandingRightBottomConstraints = '''
 
 /// Web related templates
 const String _webCss = '''
-  <style id="splash-screen-style">
+<style id="splash-screen-style">
     html {
       height: 100%
     }
@@ -478,7 +478,7 @@ const String _webCssDark = '''
 
 // XML's insertBefore can't have a newline at the end:
 const String _indexHtmlPicture = '''
-  <picture id="splash">
+<picture id="splash">
       <source srcset="splash/img/light-1x.[IMAGEEXTENSION] 1x, splash/img/light-2x.[IMAGEEXTENSION] 2x, splash/img/light-3x.[IMAGEEXTENSION] 3x, splash/img/light-4x.[IMAGEEXTENSION] 4x" media="(prefers-color-scheme: light)">
       <source srcset="splash/img/dark-1x.[IMAGEEXTENSION] 1x, splash/img/dark-2x.[IMAGEEXTENSION] 2x, splash/img/dark-3x.[IMAGEEXTENSION] 3x, splash/img/dark-4x.[IMAGEEXTENSION] 4x" media="(prefers-color-scheme: dark)">
       <img class="[IMAGEMODE]" aria-hidden="true" src="splash/img/light-1x.[IMAGEEXTENSION]" alt=""/>
@@ -486,18 +486,17 @@ const String _indexHtmlPicture = '''
 
 // XML's insertBefore can't have a newline at the end:
 const String _indexHtmlBrandingPicture = '''
-  <picture id="splash-branding">
+<picture id="splash-branding">
     <source srcset="splash/img/branding-1x.[BRANDINGEXTENSION] 1x, splash/img/branding-2x.[BRANDINGEXTENSION] 2x, splash/img/branding-3x.[BRANDINGEXTENSION] 3x, splash/img/branding-4x.[BRANDINGEXTENSION] 4x" media="(prefers-color-scheme: light)">
     <source srcset="splash/img/branding-dark-1x.[BRANDINGEXTENSION] 1x, splash/img/branding-dark-2x.[BRANDINGEXTENSION] 2x, splash/img/branding-dark-3x.[BRANDINGEXTENSION] 3x, splash/img/branding-dark-4x.[BRANDINGEXTENSION] 4x" media="(prefers-color-scheme: dark)">
     <img class="[BRANDINGMODE]" aria-hidden="true" src="splash/img/branding-1x.[BRANDINGEXTENSION]" alt=""/>
   </picture>''';
 
 const String _webJS = '''
-  <script id="splash-screen-script">
+<script id="splash-screen-script">
     function removeSplashFromWeb() {
       document.getElementById("splash")?.remove();
       document.getElementById("splash-branding")?.remove();
       document.body.style.background = "transparent";
     }
-  </script>
-''';
+  </script>''';
diff --git a/lib/web.dart b/lib/web.dart
old mode 100644
new mode 100755
index b8a9377..ed2cce8
--- a/lib/web.dart
+++ b/lib/web.dart
@@ -52,8 +52,6 @@ void _createWebSplash({
         )
         ?.remove();
     document.querySelector('script[src="splash/splash.js"]')?.remove();
-    document.querySelector('picture#splash')?.remove();
-    document.querySelector('picture#splash-branding')?.remove();
     document.querySelector('div#splash')?.remove();
     webIndex.writeAsStringSync(document.outerHtml);
     return;
@@ -296,18 +294,26 @@ void _createSplashCss({
     );
   }
 
-  cssContent += '  </style>\n';
+  cssContent += '  </style>';
 
   // Add css as an inline style in head tag
   final webIndex = File(_webIndex);
   final document = html_parser.parse(webIndex.readAsStringSync());
 
   // Update splash css style tag
-  document.head
-    ?..querySelector('style#splash-screen-style')?.remove()
-    ..append(
-      html_parser.parseFragment(cssContent, container: ''),
-    );
+  Element? splashScreenStyle =
+      document.querySelector('style#splash-screen-style');
+  if (splashScreenStyle == null) {
+    document.head?.append(html_parser.parseFragment(
+      "\n  $cssContent",
+      container: '',
+    ));
+  } else {
+    splashScreenStyle.replaceWith(html_parser.parseFragment(
+      cssContent,
+      container: '',
+    ));
+  }
 
   // Write the updated index.html
   webIndex.writeAsStringSync(document.outerHtml);
@@ -319,11 +325,19 @@ void _createSplashJs() {
   final document = html_parser.parse(webIndex.readAsStringSync());
 
   // Update splash js script tag
-  document.head
-    ?..querySelector('script#splash-screen-script')?.remove()
-    ..append(
-      html_parser.parseFragment(_webJS, container: ''),
-    );
+  Element? splashScreenScript =
+      document.querySelector('script#splash-screen-script');
+  if (splashScreenScript == null) {
+    document.head?.append(html_parser.parseFragment(
+      "\n\n  $_webJS\n",
+      container: '',
+    ));
+  } else {
+    splashScreenScript.replaceWith(html_parser.parseFragment(
+      _webJS,
+      container: '',
+    ));
+  }
 
   // Write the updated index.html
   webIndex.writeAsStringSync(document.outerHtml);
@@ -365,40 +379,64 @@ void _updateHtml({
       ?.remove();
 
   // Update splash image
-  document.querySelector('picture#splash')?.remove();
-  document.querySelector('div#splash')?.remove();
-  if (imagePath != null) {
-    document.body?.insertBefore(
-      html_parser.parseFragment(
-        '\n${_indexHtmlPicture.replaceAll(
-              '[IMAGEMODE]',
-              imageMode,
-            ).replaceAll(
-              '[IMAGEEXTENSION]',
-              imagePath.endsWith('.gif') ? 'gif' : 'png',
-            )}',
+  Element? splashPicture = document.querySelector('picture#splash');
+  if (imagePath == null) {
+    splashPicture?.remove();
+  } else {
+    final fragmentContent = _indexHtmlPicture
+        .replaceAll(
+          '[IMAGEMODE]',
+          imageMode,
+        )
+        .replaceAll(
+          '[IMAGEEXTENSION]',
+          imagePath.endsWith('.gif') ? 'gif' : 'png',
+        );
+    if (splashPicture == null) {
+      document.body?.insertBefore(
+        html_parser.parseFragment(
+          "\n  $fragmentContent\n",
+          container: '',
+        ),
+        document.body?.firstChild,
+      );
+    } else {
+      splashPicture.replaceWith(html_parser.parseFragment(
+        fragmentContent,
         container: '',
-      ),
-      document.body?.firstChild,
-    );
+      ));
+    }
   }
 
   // Update branding image
-  document.querySelector('picture#splash-branding')?.remove();
-  if (brandingImagePath != null) {
-    document.body?.insertBefore(
-      html_parser.parseFragment(
-        '\n${_indexHtmlBrandingPicture.replaceAll(
-              '[BRANDINGMODE]',
-              brandingMode,
-            ).replaceAll(
-              '[BRANDINGEXTENSION]',
-              brandingImagePath.endsWith('.gif') ? 'gif' : 'png',
-            )}',
+  Element? splashBrandingPicture =
+      document.querySelector('picture#splash-branding');
+  if (brandingImagePath == null) {
+    splashBrandingPicture?.remove();
+  } else {
+    final fragmentContent = _indexHtmlBrandingPicture
+        .replaceAll(
+          '[BRANDINGMODE]',
+          brandingMode,
+        )
+        .replaceAll(
+          '[BRANDINGEXTENSION]',
+          brandingImagePath.endsWith('.gif') ? 'gif' : 'png',
+        );
+    if (splashBrandingPicture == null) {
+      document.body?.insertBefore(
+        html_parser.parseFragment(
+          "\n  $fragmentContent\n",
+          container: '',
+        ),
+        document.body?.firstChild,
+      );
+    } else {
+      splashBrandingPicture.replaceWith(html_parser.parseFragment(
+        fragmentContent,
         container: '',
-      ),
-      document.body?.firstChild,
-    );
+      ));
+    }
   }
 
   // Write the updated index.html