diff --git a/snippets/alert.md b/snippets/alert.md
new file mode 100644
index 0000000..04ee6f7
--- /dev/null
+++ b/snippets/alert.md
@@ -0,0 +1,17 @@
+<!-- markdownlint-disable-file MD041 -->
+
+<div class="alert" style="
+  background-color: rgba(255,0,0,0.0625);
+  border: solid tomato;  /* #FF6347 */
+  margin: 1em 0;
+  padding: 1em 1em 0;
+">
+<header style="
+  font-weight: bold;
+  margin-bottom: 0.5em;
+  text-align: center;
+">🛑 Alert 🛑</header>
+
+content
+
+</div>
diff --git a/snippets/tip.md b/snippets/tip.md
new file mode 100644
index 0000000..c5a0cc4
--- /dev/null
+++ b/snippets/tip.md
@@ -0,0 +1,13 @@
+<!-- markdownlint-disable-file MD041 -->
+
+<div class="tip" style="
+  background-color: rgba(0,255,0,0.0625);
+  border: solid lightGreen;  /* #90EE90 */
+  margin: 1em 0;
+  padding: 1em 1em 0;
+">
+<header style="font-weight: bold; margin-bottom: 0.5em">Pro tip</header>
+
+content
+
+</div>
diff --git a/snippets/warning.md b/snippets/warning.md
new file mode 100644
index 0000000..dd6b36c
--- /dev/null
+++ b/snippets/warning.md
@@ -0,0 +1,13 @@
+<!-- markdownlint-disable-file MD041 -->
+
+<div class="warning" style="
+  background-color: rgba(255,255,0,0.0625);
+  border: solid yellow;  /* #FFFF00 */
+  margin: 1em 0;
+  padding: 1em 1em 0;
+">
+<header style="font-weight: bold; margin-bottom: 0.5em">⚠ Warning ⚠️</header>
+
+content
+
+</div>