diff --git a/lib/Config.rakumod b/lib/Config.rakumod
index 767bd1e..9a7ec07 100644
--- a/lib/Config.rakumod
+++ b/lib/Config.rakumod
@@ -10,7 +10,6 @@ use DB::Post;
 
 unit class Config;
 
-# TODO: Support GFM admonitions
 method generate-post(Int:D $id, Post:D $post, $db) {
     my $meta = $db.meta;
     my $content = $post.render-html;
diff --git a/lib/DB.rakumod b/lib/DB.rakumod
index 190b4a3..ec89780 100644
--- a/lib/DB.rakumod
+++ b/lib/DB.rakumod
@@ -160,6 +160,7 @@ class PostDB {
        $res-dir.add('colors.css').spurt: %?RESOURCES<colors.css>.slurp;
        $res-dir.add('main.css').spurt: %?RESOURCES<main.css>.slurp;
        $res-dir.add('code.css').spurt: %?RESOURCES<code.css>.slurp;
+       $res-dir.add('admonitions.css').spurt: %?RESOURCES<admonitions.css>.slurp;
    }
 
    #| Get a list of posts sorted by date
diff --git a/lib/Render/Head.rakumod b/lib/Render/Head.rakumod
index c43c72b..c93c3ff 100644
--- a/lib/Render/Head.rakumod
+++ b/lib/Render/Head.rakumod
@@ -38,6 +38,8 @@ sub generate-head(BlogMeta:D $meta, $title?, $description?) is export {
             :href</resources/main.css>;
         link :rel<stylesheet>,
             :href</resources/code.css>;
+        link :rel<stylesheet>,
+            :href</resources/admonitions.css>;
     ]
 }
 
diff --git a/resources/admonitions.css b/resources/admonitions.css
new file mode 100644
index 0000000..801cf4d
--- /dev/null
+++ b/resources/admonitions.css
@@ -0,0 +1,84 @@
+/* Universal configuration */
+.note,
+.tip,
+.important,
+.warning,
+.caution {
+    display: flex;
+    flex-direction: row;
+    width: 66%;
+    box-sizing: border-box;
+    background-color: var(--bg-1);
+    color: var(--fg-1);
+    padding: 0.5rem;
+    border-radius: 1rem;
+    border: solid 0.5rem;
+    margin-top: var(--box-margin-vert);
+    margin-bottom: var(--box-margin-vert);
+}
+.note .title,
+.tip .title,
+.important .title,
+.warning .title,
+.caution .title {
+    align-self: center;
+}
+.note .title p,
+.tip .title p,
+.important .title p,
+.warning .title p,
+.caution .title p {
+    font-size: 0;
+    display: inline-block;
+    position: relative;
+}
+.note .title p::before,
+.tip .title p::before,
+.important .title p::before,
+.warning .title p::before,
+.caution .title p::before {
+    font-family: 'boxicons' !important;
+    font-size: 3rem;
+    display: inline-block;
+}
+
+/* Notes */
+.note {
+    border-color: var(--blue);
+}
+.note .title p::before {
+    content: "\eb21";
+    color: var(--blue);
+}
+/* Tips */
+.tip {
+    border-color: var(--green);
+}
+.tip .title p::before {
+    content: "\eb0d";
+    color: var(--green);
+}
+/* Importants */
+.important {
+    border-color: var(--violet);
+}
+.important .title p::before {
+    content: "\eb0d";
+    color: var(--violet);
+}
+/* Warnings */
+.warning {
+    border-color: var(--orange);
+}
+.warning .title p::before {
+    content: "\e9a3";
+    color: var(--orange);
+}
+/* Cautions */
+.caution {
+    border-color: var(--red);
+}
+.caution .title p::before {
+    content: "\ee87";
+    color: var(--red);
+}