diff --git a/net/web/src/session/conversation/Conversation.jsx b/net/web/src/session/conversation/Conversation.jsx
index 5877fcf5..2e2908b4 100644
--- a/net/web/src/session/conversation/Conversation.jsx
+++ b/net/web/src/session/conversation/Conversation.jsx
@@ -19,6 +19,7 @@ export function Conversation({ closeConversation, openDetails, cardId, channelId
       update={(text) => actions.updateTopic(topic, text)}
       sealed={state.sealed && !state.contentKey}
       strings={state.strings}
+      colors={state.colors}
       menuStyle={state.menuStyle}
     />)
   }
diff --git a/net/web/src/session/conversation/topicItem/TopicItem.jsx b/net/web/src/session/conversation/topicItem/TopicItem.jsx
index df505ff9..73557834 100644
--- a/net/web/src/session/conversation/topicItem/TopicItem.jsx
+++ b/net/web/src/session/conversation/topicItem/TopicItem.jsx
@@ -9,7 +9,7 @@ import { ExclamationCircleOutlined, DeleteOutlined, EditOutlined, FireOutlined,
 import { Carousel } from 'carousel/Carousel';
 import { useTopicItem } from './useTopicItem.hook';
 
-export function TopicItem({ host, contentKey, sealed, topic, update, remove, strings, menuStyle }) {
+export function TopicItem({ host, contentKey, sealed, topic, update, remove, strings, colors, menuStyle }) {
 
   const [ modal, modalContext ] = Modal.useModal();
   const { state, actions } = useTopicItem(topic, contentKey);
@@ -106,7 +106,7 @@ export function TopicItem({ host, contentKey, sealed, topic, update, remove, str
             <>
               { topic.transform === 'error' && (
                 <div className="asset-placeholder">
-                  <FireOutlined style={{ fontSize: 32, color: '#ff8888' }} />
+                  <FireOutlined style={{ fontSize: 32, color: colors.alertText }} />
                 </div>
               )}
               { topic.transform === 'incomplete' && (
@@ -126,7 +126,7 @@ export function TopicItem({ host, contentKey, sealed, topic, update, remove, str
           )}
           { !sealed && !state.editing && (
             <div className="message">
-              <div style={{ color: topic.textColor, fontSize: topic.textSize }}>{ topic.clickable }</div>
+              <div style={{ color: topic.textColor ? topic.textColor : colors.mainText, fontSize: topic.textSize }}>{ topic.clickable }</div>
             </div>
           )}
           { state.editing && (
diff --git a/net/web/src/session/conversation/useConversation.hook.js b/net/web/src/session/conversation/useConversation.hook.js
index 3f533f30..c4c3a69c 100644
--- a/net/web/src/session/conversation/useConversation.hook.js
+++ b/net/web/src/session/conversation/useConversation.hook.js
@@ -239,7 +239,7 @@ export function useConversation(cardId, channelId) {
           item.assets = message.assets;
           item.text = message.text;
           item.clickable = clickableText(message.text);
-          item.textColor = message.textColor ? message.textColor : state.colors.mainText;
+          item.textColor = message.textColor ? message.textColor : null;
           item.textSize = message.textSize ? message.textSize : 14;
         }
         if (detail.dataType === 'sealedtopic' && state.contentKey) {
@@ -247,7 +247,7 @@ export function useConversation(cardId, channelId) {
           item.assets = subject.message.assets;
           item.text = subject.message.text;
           item.clickable = clickableText(subject.message.text);
-          item.textColor = subject.message.textColor ? subject.message.textColor : state.colors.mainText;
+          item.textColor = subject.message.textColor ? subject.message.textColor : null;
           item.textSize = subject.message.textSize ? subject.message.textSize : 14;
         }
       }