diff --git a/ui/src/Components/MainModal/Help.js b/ui/src/Components/MainModal/Help.js
index 8c7e1618f..5f71d5dba 100644
--- a/ui/src/Components/MainModal/Help.js
+++ b/ui/src/Components/MainModal/Help.js
@@ -1,6 +1,9 @@
 import React from "react";
 import PropTypes from "prop-types";
 
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faInfoCircle } from "@fortawesome/free-solid-svg-icons/faInfoCircle";
+
 import { Accordion } from "Components/Accordion";
 
 const FilterOperatorHelp = ({ operator, description, children }) => (
@@ -23,11 +26,10 @@ const FilterOperatorHelp = ({ operator, description, children }) => (
 );
 FilterOperatorHelp.propTypes = {
   operator: PropTypes.string.isRequired,
-  description: PropTypes.string.isRequired,
-  children: PropTypes.array
+  description: PropTypes.string.isRequired
 };
 
-const QueryHelp = ({ title, operators, children }) => (
+const QueryHelp = ({ title, operators, warning, children }) => (
   <React.Fragment>
     <dt>{title}</dt>
     <dd className="mb-5">
@@ -39,6 +41,12 @@ const QueryHelp = ({ title, operators, children }) => (
           </kbd>
         ))}
       </div>
+      {warning ? (
+        <div className="my-1 alert alert-light">
+          <FontAwesomeIcon icon={faInfoCircle} className="mr-1" />
+          {warning}
+        </div>
+      ) : null}
       <div>Examples:</div>
       <ul>{children}</ul>
     </dd>
@@ -47,7 +55,7 @@ const QueryHelp = ({ title, operators, children }) => (
 QueryHelp.propTypes = {
   title: PropTypes.string.isRequired,
   operators: PropTypes.arrayOf(PropTypes.string).isRequired,
-  children: PropTypes.array
+  warning: PropTypes.node
 };
 
 const FilterExample = ({ example, children }) => (
@@ -231,11 +239,9 @@ const Help = () => (
           <QueryHelp
             title="Match alerts based on the jira linked in the silence"
             operators={["=", "!=", "=~", "!~"]}
+            warning="This is supported only if JIRA regexp are enabled and able to
+            match JIRA ids in the silence comment body."
           >
-            <div className="text-warning">
-              This is supported only if JIRA regexp are enabled and able to
-              match JIRA ids in the silence comment body.
-            </div>
             <FilterExample example="@silence_jira=PROJECT-123">
               Match silenced alerts where detected JIRA issue id is equal to{" "}
               <code>PROJECT-123</code>.
@@ -250,8 +256,11 @@ const Help = () => (
             </FilterExample>
           </QueryHelp>
 
-          <QueryHelp title="Limit number of displayed alerts" operators={["="]}>
-            <div className="text-warning">Value must be a number &gt;= 1.</div>
+          <QueryHelp
+            title="Limit number of displayed alerts"
+            operators={["="]}
+            warning="Value must be a number &gt;= 1."
+          >
             <FilterExample example="@limit=10">
               Limit number of displayed alerts to 10.
             </FilterExample>
diff --git a/ui/src/Components/MainModal/__snapshots__/Help.test.js.snap b/ui/src/Components/MainModal/__snapshots__/Help.test.js.snap
index 95733eb9e..2c212cb10 100644
--- a/ui/src/Components/MainModal/__snapshots__/Help.test.js.snap
+++ b/ui/src/Components/MainModal/__snapshots__/Help.test.js.snap
@@ -685,13 +685,27 @@ exports[`<Help /> matches snapshot 1`] = `
                 !~
               </kbd>
             </div>
+            <div class=\\"my-1 alert alert-light\\">
+              <svg aria-hidden=\\"true\\"
+                   focusable=\\"false\\"
+                   data-prefix=\\"fas\\"
+                   data-icon=\\"info-circle\\"
+                   class=\\"svg-inline--fa fa-info-circle fa-w-16 fa-null fa-rotate-null fa-pull-null mr-1\\"
+                   role=\\"img\\"
+                   xmlns=\\"http://www.w3.org/2000/svg\\"
+                   viewbox=\\"0 0 512 512\\"
+              >
+                <path fill=\\"currentColor\\"
+                      d=\\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\\"
+                >
+                </path>
+              </svg>
+              This is supported only if JIRA regexp are enabled and able to match JIRA ids in the silence comment body.
+            </div>
             <div>
               Examples:
             </div>
             <ul>
-              <div class=\\"text-warning\\">
-                This is supported only if JIRA regexp are enabled and able to match JIRA ids in the silence comment body.
-              </div>
               <li>
                 <div>
                   <span class=\\"badge badge-info\\">
@@ -746,13 +760,27 @@ exports[`<Help /> matches snapshot 1`] = `
                 =
               </kbd>
             </div>
+            <div class=\\"my-1 alert alert-light\\">
+              <svg aria-hidden=\\"true\\"
+                   focusable=\\"false\\"
+                   data-prefix=\\"fas\\"
+                   data-icon=\\"info-circle\\"
+                   class=\\"svg-inline--fa fa-info-circle fa-w-16 fa-null fa-rotate-null fa-pull-null mr-1\\"
+                   role=\\"img\\"
+                   xmlns=\\"http://www.w3.org/2000/svg\\"
+                   viewbox=\\"0 0 512 512\\"
+              >
+                <path fill=\\"currentColor\\"
+                      d=\\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\\"
+                >
+                </path>
+              </svg>
+              Value must be a number &gt;= 1.
+            </div>
             <div>
               Examples:
             </div>
             <ul>
-              <div class=\\"text-warning\\">
-                Value must be a number &gt;= 1.
-              </div>
               <li>
                 <div>
                   <span class=\\"badge badge-info\\">