diff --git a/assets/css/common/post-single.css b/assets/css/common/post-single.css
index 8906c1f3..ffeea3ec 100644
--- a/assets/css/common/post-single.css
+++ b/assets/css/common/post-single.css
@@ -415,3 +415,19 @@ img.in-text {
     display: inline;
     margin: auto;
 }
+
+mark {
+    border-radius: 2px;
+    padding: 0 2px;
+}
+
+audio {
+    width: stretch;
+    max-width: 100%;
+}
+
+video {
+    border: 1px solid var(--code-bg);
+    border-radius: var(--radius);
+    max-width: 100%;
+}
diff --git a/layouts/shortcodes/audio.html b/layouts/shortcodes/audio.html
new file mode 100644
index 00000000..1497a75c
--- /dev/null
+++ b/layouts/shortcodes/audio.html
@@ -0,0 +1,2 @@
+{{ $src := (.Get "src") }}
+<audio src="{{ $src }}" controls muted></audio>
diff --git a/layouts/shortcodes/video.html b/layouts/shortcodes/video.html
new file mode 100644
index 00000000..adb917ba
--- /dev/null
+++ b/layouts/shortcodes/video.html
@@ -0,0 +1,2 @@
+{{ $src := (.Get "src") }}
+<video src="{{ $src }}" controls muted></video>