diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base.html.twig b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base.html.twig
index bc5e8e262030..1bf99d3e0ac7 100644
--- a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base.html.twig
+++ b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base.html.twig
@@ -15,7 +15,7 @@
     </head>
     <body>
         <script async>
-            document.body.classList.add(localStorage.getItem('symfony/profiler/theme'), localStorage.getItem('symfony/profiler/width'));
+            document.body.classList.add(localStorage.getItem('symfony/profiler/theme') || 'theme-light', localStorage.getItem('symfony/profiler/width') || 'width-normal');
         </script>
 
         {% block body '' %}
diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/settings.html.twig b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/settings.html.twig
index cc794e110400..fb9767c9e575 100644
--- a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/settings.html.twig
+++ b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/settings.html.twig
@@ -1,6 +1,6 @@
 <style>
 #open-settings {
-    color: var(--text-muted);
+    color: var(--color-muted);
     display: block;
     margin: 15px 15px 5px;
 }
@@ -84,6 +84,24 @@
 .modal-content .form-help + h4 {
     margin-top: 45px;
 }
+
+@media (max-width: 768px) {
+    #open-settings {
+        color: transparent;
+    }
+    #sidebar:hover #open-settings, #sidebar.expanded #open-settings {
+        color: var(--color-muted);
+    }
+    #open-settings:before {
+        content: '\2699';
+        font-weight: bold;
+        font-size: 25px;
+        color: var(--color-muted);
+    }
+    #sidebar:hover #open-settings:before, #sidebar.expanded #open-settings:before {
+        content: '';
+    }
+}
 </style>
 
 <a href="#" id="open-settings" data-triger="profiler-settings">Settings</a>
@@ -141,8 +159,8 @@
     let modalWrapper = document.getElementsByClassName('modal-wrap')[0]
 
     openModalButton.addEventListener('click', function(event) {
-        document.getElementById('settings-' + localStorage.getItem('symfony/profiler/theme')).checked = 'checked';
-        document.getElementById('settings-' + localStorage.getItem('symfony/profiler/width')).checked = 'checked';
+        document.getElementById('settings-' + (localStorage.getItem('symfony/profiler/theme') || 'theme-light')).checked = 'checked';
+        document.getElementById('settings-' + (localStorage.getItem('symfony/profiler/width') || 'width-normal')).checked = 'checked';
 
         modalWindow.classList.toggle('visible');
         event.preventDefault();
