diff --git a/packages/app/src/components/PostCard/components/content/index.jsx b/packages/app/src/components/PostCard/components/content/index.jsx
index 5436dbe7..6ff8ac2b 100755
--- a/packages/app/src/components/PostCard/components/content/index.jsx
+++ b/packages/app/src/components/PostCard/components/content/index.jsx
@@ -1,6 +1,7 @@
 import React from "react"
 import * as antd from "antd"
 import Plyr from "plyr-react"
+import classnames from "classnames"
 
 import { processString } from "utils"
 
@@ -110,7 +111,7 @@ export default React.memo((props) => {
     }
 
     return <div
-        className="post_content"
+        className={classnames("post_content", { ["nsfw"]: isNSFW && !nsfwAccepted })}
     >
         {isNSFW && !nsfwAccepted &&
             <div className="nsfw_alert">
diff --git a/packages/app/src/components/PostCard/components/content/index.less b/packages/app/src/components/PostCard/components/content/index.less
index 4378fc3b..09557ba8 100755
--- a/packages/app/src/components/PostCard/components/content/index.less
+++ b/packages/app/src/components/PostCard/components/content/index.less
@@ -26,6 +26,16 @@
         color: var(--text-color);
     }
 
+    &.nsfw {
+        .message {
+            filter: blur(10px);
+        }
+
+        .post_attachments {
+            filter: blur(25px);
+        }
+    }
+
     .nsfw_alert {
         position: absolute;
 
@@ -40,8 +50,9 @@
         width: 100%;
         height: 100%;
 
-        backdrop-filter: blur(25px);
-        background-color: rgba(0, 0, 0, 0.5);
+        // -webkit-backdrop-filter: blur(25px);
+        // backdrop-filter: blur(25px);
+        //background-color: rgba(0, 0, 0, 0.5);
 
         border-radius: 8px;