diff --git a/native/chat/inner-text-message.react.js b/native/chat/inner-text-message.react.js
--- a/native/chat/inner-text-message.react.js
+++ b/native/chat/inner-text-message.react.js
@@ -70,7 +70,6 @@
   const boundColors = useColors();
 
   const messageStyle = {};
-  const textStyle = {};
   let darkColor;
   if (isViewer) {
     const threadColor = item.threadInfo.color;
@@ -81,9 +80,6 @@
     messageStyle.backgroundColor = boundColors.listChatBubble;
     darkColor = activeTheme === 'dark';
   }
-  textStyle.color = darkColor
-    ? colors.dark.listForegroundLabel
-    : colors.light.listForegroundLabel;
 
   const cornerStyle = getRoundedContainerStyle(filterCorners(allCorners, item));
 
@@ -95,6 +91,19 @@
 
   const rules = useTextMessageMarkdownRules(darkColor);
 
+  const textStyle = React.useMemo(
+    () => ({
+      color: darkColor
+        ? colors.dark.listForegroundLabel
+        : colors.light.listForegroundLabel,
+    }),
+    [darkColor],
+  );
+
+  const markdownStyles = React.useMemo(() => [styles.text, textStyle], [
+    textStyle,
+  ]);
+
   const message = (
     <TouchableWithoutFeedback>
       <View>
@@ -105,7 +114,7 @@
           style={[styles.message, cornerStyle]}
           animatedStyle={messageStyle}
         >
-          <Markdown style={[styles.text, textStyle]} rules={rules}>
+          <Markdown style={markdownStyles} rules={rules}>
             {text}
           </Markdown>
         </GestureTouchableOpacity>
diff --git a/native/markdown/rules.react.js b/native/markdown/rules.react.js
--- a/native/markdown/rules.react.js
+++ b/native/markdown/rules.react.js
@@ -224,11 +224,22 @@
         node: SharedMarkdown.SingleASTNode,
         output: SharedMarkdown.Output<SharedMarkdown.ReactElement>,
         state: SharedMarkdown.State,
-      ) => (
-        <View key={state.key} style={styles.blockQuote}>
-          {output(node.content, state)}
-        </View>
-      ),
+      ) => {
+        const level = state?.level ?? 1;
+        const backgroundColor = level === 1 ? '#00000066' : '#00000000';
+
+        return (
+          <View
+            key={state.key}
+            style={{
+              ...styles.blockQuote,
+              backgroundColor,
+            }}
+          >
+            {output(node.content, { ...state, level: level + 1 })}
+          </View>
+        );
+      },
     },
     codeBlock: {
       ...SimpleMarkdown.defaultRules.codeBlock,
diff --git a/native/markdown/styles.js b/native/markdown/styles.js
--- a/native/markdown/styles.js
+++ b/native/markdown/styles.js
@@ -60,9 +60,9 @@
     fontWeight: 'bold',
   },
   blockQuote: {
-    backgroundColor: 'blockQuoteBackground',
-    borderLeftColor: 'blockQuoteBorder',
-    borderLeftWidth: 5,
+    borderLeftColor: '#00000066',
+    borderLeftWidth: 8,
+    borderRadius: 8,
     padding: 10,
     marginBottom: 6,
     marginVertical: 6,