diff --git a/c3simplepage/layouts/shortcodes/note.html b/c3simplepage/layouts/shortcodes/note.html
new file mode 100644
index 0000000000000000000000000000000000000000..25987da5f4b06f30560ecb34ac8d777e139455e5
--- /dev/null
+++ b/c3simplepage/layouts/shortcodes/note.html
@@ -0,0 +1,3 @@
+<p class="note">
+    {{ .Inner | markdownify }}
+</p>
diff --git a/c3simplepage/static/css/c3simplepage.css b/c3simplepage/static/css/c3simplepage.css
index 1db71d869224c7e671d5ae688af4b7e8b11f1251..d137512022f2c5035d6598c99c0d5b3dc4a5f53b 100644
--- a/c3simplepage/static/css/c3simplepage.css
+++ b/c3simplepage/static/css/c3simplepage.css
@@ -25,6 +25,13 @@ body {
     padding: 15px 20px 20px 60px;
 }
 
+.note {
+    background-image: url('/gfx/note.png');
+    background-repeat: no-repeat;
+    background-position: left;
+    padding: 15px 20px 20px 60px;
+}
+
 pre {
     background-color: lightgray;
     font-family: monospace;
@@ -32,4 +39,4 @@ pre {
 
 table tr th:empty {
     display: none;
-}
\ No newline at end of file
+}
diff --git a/c3simplepage/static/gfx/note.png b/c3simplepage/static/gfx/note.png
new file mode 100644
index 0000000000000000000000000000000000000000..df1e0a9265dc6ce7602d3da91195b2a84d278e01
Binary files /dev/null and b/c3simplepage/static/gfx/note.png differ