Index: admin/images/dragndrop.svg
===================================================================
--- admin/images/dragndrop.svg	(revision 3908)
+++ admin/images/dragndrop.svg	(revision 3908)
@@ -0,0 +1,11 @@
+<svg
+  id="mask"
+  viewbox="0 0 16 16"
+  preserveAspectRatio="xMinYMin meet"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink">
+  <path d="M7.9 7.9l2.1 7.5 1.7-2.6 3.2 3.2 1.1-1.1-3.3-3.2 2.7-1.6z">
+  </path>
+  <path d="M8 12h-7v-9h12v5.4l1 0.2v-6.6h-14v11h8.2z">
+  </path>
+</svg>
Index: admin/index.php
===================================================================
--- admin/index.php	(revision 3906)
+++ admin/index.php	(revision 3908)
@@ -152,9 +152,16 @@
 if (!$core->auth->user_prefs->accessibility->nodragdrop) {
     $dragndrop =
-        '<script type="text/javascript">' . "\n" .
-            dcPage::jsVar('dotclear.dragndrop_off', __('Dashboard area\'s drag and drop is disabled')) . "\n" .
-            dcPage::jsVar('dotclear.dragndrop_on', __('Dashboard area\'s drag and drop is enabled')) . "\n" .
-        "</script>\n".
-        '<input type="checkbox" id="dragndrop" title="' . __('Dashboard area\'s drag and drop is disabled') . '" />';
+    '<script type="text/javascript">' . "\n" .
+    dcPage::jsVar('dotclear.dragndrop_off', __('Dashboard area\'s drag and drop is disabled')) . "\n" .
+    dcPage::jsVar('dotclear.dragndrop_on', __('Dashboard area\'s drag and drop is enabled')) . "\n" .
+    "</script>\n" .
+    '<input type="checkbox" id="dragndrop" class="sr-only" title="' .
+        __('Dashboard area\'s drag and drop is disabled') . '" />' .
+    '<label for="dragndrop">' .
+    '<svg aria-hidden="true" focusable="false" class="dragndrop-svg">' .
+    '<use xlink:href="images/dragndrop.svg#mask"></use>' .
+    '</svg>' .
+    '<span id="dragndrop-label" class="sr-only">' . __('Dashboard area\'s drag and drop is disabled') . '</span>' .
+    '</label>';
 }
 
Index: admin/js/_index.js
===================================================================
--- admin/js/_index.js	(revision 3906)
+++ admin/js/_index.js	(revision 3908)
@@ -253,8 +253,10 @@
         areas.forEach(element => init_positions(element[0], element[1]));
         $(this).prop('title', dotclear.dragndrop_on);
+        $('#dragndrop-label').text(dotclear.dragndrop_on);
       } else {
         // Deactivate sorting feature
         areas.forEach(element => reset_positions(element[0]));
         $(this).prop('title', dotclear.dragndrop_off);
+        $('#dragndrop-label').text(dotclear.dragndrop_off);
       }
     });
Index: admin/style/default-dark.css
===================================================================
--- admin/style/default-dark.css	(revision 3907)
+++ admin/style/default-dark.css	(revision 3908)
@@ -220,4 +220,16 @@
     width: auto;
     white-space: normal; }
+
+.sr-only {
+  border: 0;
+  clip: rect(0 0 0 0);
+  clip-path: inset(50%);
+  height: 1px;
+  margin: -1px;
+  overflow: hidden;
+  padding: 0;
+  position: absolute;
+  width: 1px;
+  white-space: nowrap; }
 
 /** --------------------------------------------------
@@ -2230,19 +2242,17 @@
 
 #dragndrop {
-  position: absolute;
-  width: 2em;
-  height: 1.5em;
-  -webkit-mask-image: url(dragndrop.svg);
-  mask-image: url(dragndrop.svg); }
+  position: absolute; }
   .no-js #dragndrop {
     display: none; }
-  #dragndrop:before {
-    content: "";
+  #dragndrop + label {
+    position: absolute;
     display: inline-block;
+    line-height: 1; }
+  #dragndrop + label .dragndrop-svg {
     width: 2em;
     height: 1.5em;
-    background: #86888c; }
-  #dragndrop:checked:before {
-    background: #bee74b; }
+    fill: #86888c; }
+  #dragndrop:checked + label .dragndrop-svg {
+    fill: #bee74b; }
 
 #media_img_title_pattern {
Index: admin/style/default.css
===================================================================
--- admin/style/default.css	(revision 3907)
+++ admin/style/default.css	(revision 3908)
@@ -220,4 +220,16 @@
     width: auto;
     white-space: normal; }
+
+.sr-only {
+  border: 0;
+  clip: rect(0 0 0 0);
+  clip-path: inset(50%);
+  height: 1px;
+  margin: -1px;
+  overflow: hidden;
+  padding: 0;
+  position: absolute;
+  width: 1px;
+  white-space: nowrap; }
 
 /** --------------------------------------------------
@@ -2230,19 +2242,17 @@
 
 #dragndrop {
-  position: absolute;
-  width: 2em;
-  height: 1.5em;
-  -webkit-mask-image: url(dragndrop.svg);
-  mask-image: url(dragndrop.svg); }
+  position: absolute; }
   .no-js #dragndrop {
     display: none; }
-  #dragndrop:before {
-    content: "";
+  #dragndrop + label {
+    position: absolute;
     display: inline-block;
+    line-height: 1; }
+  #dragndrop + label .dragndrop-svg {
     width: 2em;
     height: 1.5em;
-    background: #868686; }
-  #dragndrop:checked:before {
-    background: #137bbb; }
+    fill: #868686; }
+  #dragndrop:checked + label .dragndrop-svg {
+    fill: #137bbb; }
 
 #media_img_title_pattern {
Index: dmin/style/dragndrop.svg
===================================================================
--- admin/style/dragndrop.svg	(revision 3906)
+++ 	(revision )
@@ -1,6 +1,0 @@
-<svg viewbox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin meet">
-  <path d="M7.9 7.9l2.1 7.5 1.7-2.6 3.2 3.2 1.1-1.1-3.3-3.2 2.7-1.6z" fill="#91DC5A">
-  </path>
-  <path d="M8 12h-7v-9h12v5.4l1 0.2v-6.6h-14v11h8.2z" fill="#91DC5A">
-  </path>
-</svg>
Index: admin/style/scss/init/_rebase.scss
===================================================================
--- admin/style/scss/init/_rebase.scss	(revision 3439)
+++ admin/style/scss/init/_rebase.scss	(revision 3908)
@@ -256,2 +256,6 @@
 	}
 }
+
+.sr-only {
+  @include visually-hidden;
+}
Index: admin/style/scss/partials/_index.scss
===================================================================
--- admin/style/scss/partials/_index.scss	(revision 3907)
+++ admin/style/scss/partials/_index.scss	(revision 3908)
@@ -147,17 +147,16 @@
   }
   position: absolute;
-  width: 2em;
-  height: 1.5em;
-  -webkit-mask-image: url(dragndrop.svg);
-  mask-image: url(dragndrop.svg);
-  &:before {
-    content: "";
+  &+label {
+    position: absolute;
     display: inline-block;
+    line-height: 1;
+  }
+  &+label .dragndrop-svg {
     width: 2em;
     height: 1.5em;
-    background: $drag-n-drop-off;
+    fill: $drag-n-drop-off;
   }
-  &:checked:before {
-    background: $drag-n-drop-on;
+  &:checked+label .dragndrop-svg {
+    fill: $drag-n-drop-on;
   }
 }
