diff --git a/src/components/Markdown.js b/src/components/Markdown.js
index 99604dc..b3af23e 100644
--- a/src/components/Markdown.js
+++ b/src/components/Markdown.js
@@ -49,7 +49,12 @@ function ListItem(props) {
 }
 
 function Code({ children, value }) {
-  const variant = value.startsWith("Warning:") ? "warning" : "";
+  let variant = "";
+  if (value.startsWith("Warning:")) {
+    variant = "warning";
+  } else if (value.startsWith("Note:")) {
+    variant = "note";
+  }
   return (
     <Message variant={variant} my={2} as="span" sx={{ display: "block" }}>
       {children}
diff --git a/src/docs/howTo/sharingMaps.md b/src/docs/howTo/sharingMaps.md
index 1b09d0c..91dd97b 100644
--- a/src/docs/howTo/sharingMaps.md
+++ b/src/docs/howTo/sharingMaps.md
@@ -22,7 +22,7 @@ To do this there is the Column and Row properties. Columns represents how many g
 
 `Tip: Owlbear Rodeo can automatically fill the Column and Row properties for you if you include them in the file name of the uploaded map. E.g. River [10x15] will create a map named River with 10 columns and 15 rows`
 
-`Warning: When uploading a custom map keep the file size in mind. Maps are shared between users in Owlbear Rodeo so if a map is taking too long to load for other party members consider lowering the file size.`
+`Note: When uploading a custom map keep the file size in mind. Maps are shared between users in Owlbear Rodeo so if a map is taking too long to load for other party members consider lowering the file size.`
 
 ## Custom Maps (Advanced)
 
diff --git a/src/theme.js b/src/theme.js
index 679607b..7fc647e 100644
--- a/src/theme.js
+++ b/src/theme.js
@@ -269,5 +269,9 @@ export default {
       backgroundColor: "#d65c64",
       borderLeftColor: "#ff939b",
     },
+    note: {
+      backgroundColor: "#cd9937",
+      borderLeftColor: "#ffe493",
+    },
   },
 };