Fixed #36386 -- Added styles and icons for INFO and DEBUG messages in the admin.

7 files changed, 74 insertions, 2 deletions

diff --git a/django/contrib/admin/static/admin/css/base.css b/django/contrib/admin/static/admin/css/base.css
index 62fe9868b7..79ea073bda 100644
--- a/django/contrib/admin/static/admin/css/base.css
+++ b/django/contrib/admin/static/admin/css/base.css
@@ -34,6 +34,10 @@ html[data-theme="light"],
 
     --error-fg: #ba2121;
 
+    --message-debug-bg: #efefef;
+    --message-debug-icon: url(../img/icon-debug.svg);
+    --message-info-bg: #ccefff;
+    --message-info-icon: url(../img/icon-info.svg);
     --message-success-bg: #dfd;
     --message-success-icon: url(../img/icon-yes.svg);
     --message-warning-bg: #ffc;
@@ -642,13 +646,28 @@ ul.messagelist li {
     margin: 0 0 10px 0;
     color: var(--body-fg);
     word-break: break-word;
-    background-color: var(--message-success-bg);
-    background-image: var(--message-success-icon);
+    background-color: var(--message-info-bg);
+    background-image: var(--message-info-icon);
     background-position: 40px 12px;
     background-repeat: no-repeat;
     background-size: 16px auto;
 }
 
+ul.messagelist li.debug {
+    background-color: var(--message-debug-bg);
+    background-image: var(--message-debug-icon);
+}
+
+ul.messagelist li.info {
+    background-color: var(--message-info-bg);
+    background-image: var(--message-info-icon);
+}
+
+ul.messagelist li.success {
+    background-color: var(--message-success-bg);
+    background-image: var(--message-success-icon);
+}
+
 ul.messagelist li.warning {
     background-color: var(--message-warning-bg);
     background-image: var(--message-warning-icon);
diff --git a/django/contrib/admin/static/admin/css/dark_mode.css b/django/contrib/admin/static/admin/css/dark_mode.css
index 50f11affc0..76cbf170a7 100644
--- a/django/contrib/admin/static/admin/css/dark_mode.css
+++ b/django/contrib/admin/static/admin/css/dark_mode.css
@@ -20,6 +20,11 @@
       --border-color: #353535;
   
       --error-fg: #e35f5f;
+
+      --message-debug-bg: #4e4e4e;
+      --message-debug-icon: url(../img/icon-debug-dark.svg);
+      --message-info-bg: #265895;
+      --message-info-icon: url(../img/icon-info-dark.svg);
       --message-success-bg: #006b1b;
       --message-success-icon: url(../img/icon-yes-dark.svg);
       --message-warning-bg: #583305;
@@ -60,6 +65,11 @@ html[data-theme="dark"] {
     --border-color: #353535;
 
     --error-fg: #e35f5f;
+
+    --message-debug-bg: #4e4e4e;
+    --message-debug-icon: url(../img/icon-debug-dark.svg);
+    --message-info-bg: #265895;
+    --message-info-icon: url(../img/icon-info-dark.svg);
     --message-success-bg: #006b1b;
     --message-success-icon: url(../img/icon-yes-dark.svg);
     --message-warning-bg: #583305;
diff --git a/django/contrib/admin/static/admin/img/icon-debug-dark.svg b/django/contrib/admin/static/admin/img/icon-debug-dark.svg
new file mode 100644
index 0000000000..ad76594823
--- /dev/null
+++ b/django/contrib/admin/static/admin/img/icon-debug-dark.svg
@@ -0,0 +1,9 @@
+<svg width="13" height="13" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+  <!--
+    Icon Name: bug
+    Icon Family: classic
+    Icon Style: solid
+  -->
+  <path fill="#bfbfbf" d="M256 0c53 0 96 43 96 96l0 3.6c0 15.7-12.7 28.4-28.4 28.4l-135.1 0c-15.7 0-28.4-12.7-28.4-28.4l0-3.6c0-53 43-96 96-96zM41.4 105.4c12.5-12.5 32.8-12.5 45.3 0l64 64c.7 .7 1.3 1.4 1.9 2.1c14.2-7.3 30.4-11.4 47.5-11.4l112 0c17.1 0 33.2 4.1 47.5 11.4c.6-.7 1.2-1.4 1.9-2.1l64-64c12.5-12.5 32.8-12.5 45.3 0s12.5 32.8 0 45.3l-64 64c-.7 .7-1.4 1.3-2.1 1.9c6.2 12 10.1 25.3 11.1 39.5l64.3 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-64 0c0 24.6-5.5 47.8-15.4 68.6c2.2 1.3 4.2 2.9 6 4.8l64 64c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0l-63.1-63.1c-24.5 21.8-55.8 36.2-90.3 39.6L272 240c0-8.8-7.2-16-16-16s-16 7.2-16 16l0 239.2c-34.5-3.4-65.8-17.8-90.3-39.6L86.6 502.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l64-64c1.9-1.9 3.9-3.4 6-4.8C101.5 367.8 96 344.6 96 320l-64 0c-17.7 0-32-14.3-32-32s14.3-32 32-32l64.3 0c1.1-14.1 5-27.5 11.1-39.5c-.7-.6-1.4-1.2-2.1-1.9l-64-64c-12.5-12.5-12.5-32.8 0-45.3z" />
+</svg>
diff --git a/django/contrib/admin/static/admin/img/icon-debug.svg b/django/contrib/admin/static/admin/img/icon-debug.svg
new file mode 100644
index 0000000000..c57d9190a7
--- /dev/null
+++ b/django/contrib/admin/static/admin/img/icon-debug.svg
@@ -0,0 +1,9 @@
+<svg width="13" height="13" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+  <!--
+    Icon Name: bug
+    Icon Family: classic
+    Icon Style: solid
+  -->
+  <path fill="#808080" d="M256 0c53 0 96 43 96 96l0 3.6c0 15.7-12.7 28.4-28.4 28.4l-135.1 0c-15.7 0-28.4-12.7-28.4-28.4l0-3.6c0-53 43-96 96-96zM41.4 105.4c12.5-12.5 32.8-12.5 45.3 0l64 64c.7 .7 1.3 1.4 1.9 2.1c14.2-7.3 30.4-11.4 47.5-11.4l112 0c17.1 0 33.2 4.1 47.5 11.4c.6-.7 1.2-1.4 1.9-2.1l64-64c12.5-12.5 32.8-12.5 45.3 0s12.5 32.8 0 45.3l-64 64c-.7 .7-1.4 1.3-2.1 1.9c6.2 12 10.1 25.3 11.1 39.5l64.3 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-64 0c0 24.6-5.5 47.8-15.4 68.6c2.2 1.3 4.2 2.9 6 4.8l64 64c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0l-63.1-63.1c-24.5 21.8-55.8 36.2-90.3 39.6L272 240c0-8.8-7.2-16-16-16s-16 7.2-16 16l0 239.2c-34.5-3.4-65.8-17.8-90.3-39.6L86.6 502.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l64-64c1.9-1.9 3.9-3.4 6-4.8C101.5 367.8 96 344.6 96 320l-64 0c-17.7 0-32-14.3-32-32s14.3-32 32-32l64.3 0c1.1-14.1 5-27.5 11.1-39.5c-.7-.6-1.4-1.2-2.1-1.9l-64-64c-12.5-12.5-12.5-32.8 0-45.3z" />
+</svg>
diff --git a/django/contrib/admin/static/admin/img/icon-info-dark.svg b/django/contrib/admin/static/admin/img/icon-info-dark.svg
new file mode 100644
index 0000000000..76fc14279c
--- /dev/null
+++ b/django/contrib/admin/static/admin/img/icon-info-dark.svg
@@ -0,0 +1,9 @@
+<svg width="13" height="13" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+  <!--
+    Icon Name: circle-info
+    Icon Family: classic
+    Icon Style: solid
+  -->
+  <path fill="#63b4eb" d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336l24 0 0-64-24 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l48 0c13.3 0 24 10.7 24 24l0 88 8 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-80 0c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z" />
+</svg>
diff --git a/django/contrib/admin/static/admin/img/icon-info.svg b/django/contrib/admin/static/admin/img/icon-info.svg
new file mode 100644
index 0000000000..0a240ea175
--- /dev/null
+++ b/django/contrib/admin/static/admin/img/icon-info.svg
@@ -0,0 +1,9 @@
+<svg width="13" height="13" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. -->
+  <!--
+    Icon Name: circle-info
+    Icon Family: classic
+    Icon Style: solid
+  -->
+  <path fill="#3f8cc1" d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336l24 0 0-64-24 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l48 0c13.3 0 24 10.7 24 24l0 88 8 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-80 0c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z" />
+</svg>
diff --git a/docs/releases/6.0.txt b/docs/releases/6.0.txt
index e653884163..848f792bc0 100644
--- a/docs/releases/6.0.txt
+++ b/docs/releases/6.0.txt
@@ -348,6 +348,13 @@ Miscellaneous
   or their templates, you may need to :ref:`update them
   <geometry-widgets-customization>` to match the new layout.
 
+* Message levels ``messages.DEBUG`` and ``messages.INFO`` now have distinct
+  icons and CSS styling in the admin. Previously, these used the same icon and
+  styling as the ``messages.SUCCESS`` level. Since
+  :meth:`.ModelAdmin.message_user` uses the ``messages.INFO`` level by default,
+  set the level to ``messages.SUCCESS`` to retain the previous icon and
+  styling.
+
 .. _deprecated-features-6.0:
 
 Features deprecated in 6.0