diff --git a/.changeset/add_highlithing_to_to_be_replied.md b/.changeset/add_highlithing_to_to_be_replied.md
new file mode 100644
index 000000000..2b868f80c
--- /dev/null
+++ b/.changeset/add_highlithing_to_to_be_replied.md
@@ -0,0 +1,5 @@
+---
+default: minor
+---
+
+Highlight message that you are about to reply to!
diff --git a/src/app/components/message/layout/Base.tsx b/src/app/components/message/layout/Base.tsx
index edcf609a7..ca7e8c95a 100644
--- a/src/app/components/message/layout/Base.tsx
+++ b/src/app/components/message/layout/Base.tsx
@@ -4,12 +4,30 @@ import * as css from './layout.css';
 
 export const MessageBase = as<'div', css.MessageBaseVariants>(
   (
-    { className, highlight, notifyHighlight, selected, collapse, autoCollapse, space, ...props },
+    {
+      className,
+      highlight,
+      notifyHighlight,
+      selected,
+      isMarked,
+      collapse,
+      autoCollapse,
+      space,
+      ...props
+    },
     ref
   ) => (
     <div
       className={classNames(
-        css.MessageBase({ highlight, notifyHighlight, selected, collapse, autoCollapse, space }),
+        css.MessageBase({
+          highlight,
+          notifyHighlight,
+          isMarked,
+          selected,
+          collapse,
+          autoCollapse,
+          space,
+        }),
         className
       )}
       {...props}
diff --git a/src/app/components/message/layout/layout.css.ts b/src/app/components/message/layout/layout.css.ts
index 3d1368d20..ac6cd5620 100644
--- a/src/app/components/message/layout/layout.css.ts
+++ b/src/app/components/message/layout/layout.css.ts
@@ -85,6 +85,11 @@ const SelectedVariant = styleVariants({
     backgroundColor: color.Surface.ContainerActive,
   },
 });
+const MarkedVariant = styleVariants({
+  true: {
+    backgroundColor: color.Other.Overlay,
+  },
+});
 
 const AutoCollapse = style({
   selectors: {
@@ -118,6 +123,7 @@ export const MessageBase = recipe({
     highlight: HighlightVariant,
     notifyHighlight: NotifyHighlightVariant,
     selected: SelectedVariant,
+    isMarked: MarkedVariant,
   },
   defaultVariants: {
     space: '400',
diff --git a/src/app/features/room/message/Message.tsx b/src/app/features/room/message/Message.tsx
index ca1517de8..f952c4c9c 100644
--- a/src/app/features/room/message/Message.tsx
+++ b/src/app/features/room/message/Message.tsx
@@ -220,6 +220,7 @@ export type MessageProps = {
   collapse: boolean;
   highlight: boolean;
   notifyHighlight?: 'silent' | 'loud';
+  isMarked?: boolean;
   edit?: boolean;
   canDelete?: boolean;
   canSendReaction?: boolean;
@@ -333,6 +334,7 @@ function MessageInternal(
     collapse,
     highlight,
     notifyHighlight,
+    isMarked,
     edit,
     canDelete,
     canSendReaction,
@@ -876,6 +878,7 @@ function MessageInternal(
       highlight={highlight}
       notifyHighlight={highlightMentions ? notifyHighlight : undefined}
       selected={!!menuAnchor || !!emojiBoardAnchor}
+      isMarked={isMarked}
       {...props}
       {...hoverProps}
       {...focusWithinProps}
@@ -1275,6 +1278,7 @@ export type EventProps = {
   mEvent: MatrixEvent;
   highlight: boolean;
   notifyHighlight?: 'silent' | 'loud';
+  isMarked?: boolean;
   canDelete?: boolean;
   onReplyClick: (
     ev: Parameters<MouseEventHandler<HTMLButtonElement>>[0],
@@ -1293,6 +1297,7 @@ export const Event = as<'div', EventProps>(
       mEvent,
       highlight,
       notifyHighlight,
+      isMarked,
       collapse,
       canDelete,
       onReplyClick,
@@ -1388,6 +1393,7 @@ export const Event = as<'div', EventProps>(
         highlight={highlight}
         notifyHighlight={highlightMentions ? notifyHighlight : undefined}
         selected={!!menuAnchor}
+        isMarked={isMarked}
         {...props}
         {...hoverProps}
         {...focusWithinProps}
diff --git a/src/app/hooks/timeline/useTimelineEventRenderer.tsx b/src/app/hooks/timeline/useTimelineEventRenderer.tsx
index eb301257b..201d5ebe9 100644
--- a/src/app/hooks/timeline/useTimelineEventRenderer.tsx
+++ b/src/app/hooks/timeline/useTimelineEventRenderer.tsx
@@ -374,6 +374,7 @@ export function useTimelineEventRenderer({
         const reactions = reactionRelations?.getSortedAnnotationsByKey();
         const hasReactions = reactions && reactions.length > 0;
         const highlighted = focusItem?.index === item && focusItem.highlight;
+        const marked = activeReplyId === mEventId;
 
         const pushActions = pushProcessor.actionsForEvent(mEvent);
         let notifyHighlight: 'silent' | 'loud' | undefined;
@@ -429,6 +430,7 @@ export function useTimelineEventRenderer({
             messageSpacing={messageSpacing}
             messageLayout={messageLayout}
             highlight={highlighted}
+            isMarked={marked}
             notifyHighlight={notifyHighlight}
             edit={editId === mEventId}
             canDelete={canRedact || (canDeleteOwn && senderId === mx.getUserId())}
@@ -533,6 +535,7 @@ export function useTimelineEventRenderer({
         const reactions = reactionRelations?.getSortedAnnotationsByKey();
         const hasReactions = reactions && reactions.length > 0;
         const highlighted = focusItem?.index === item && focusItem.highlight;
+        const marked = activeReplyId === mEventId;
         const senderId = mEvent.getSender() ?? '';
         const senderDisplayName =
           getMemberDisplayName(room, senderId, nicknames) ?? getMxIdLocalPart(senderId) ?? senderId;
@@ -553,6 +556,7 @@ export function useTimelineEventRenderer({
             messageSpacing={messageSpacing}
             messageLayout={messageLayout}
             highlight={highlighted}
+            isMarked={marked}
             notifyHighlight={notifyHighlight}
             edit={editId === mEventId}
             canDelete={canRedact || (canDeleteOwn && senderId === mx.getUserId())}
@@ -703,6 +707,7 @@ export function useTimelineEventRenderer({
         const reactions = reactionRelations?.getSortedAnnotationsByKey();
         const hasReactions = reactions && reactions.length > 0;
         const highlighted = focusItem?.index === item && focusItem.highlight;
+        const marked = activeReplyId === mEventId;
         const senderId = mEvent.getSender() ?? '';
         const senderDisplayName =
           getMemberDisplayName(room, senderId, nicknames) ?? getMxIdLocalPart(senderId) ?? senderId;
@@ -718,6 +723,7 @@ export function useTimelineEventRenderer({
             messageSpacing={messageSpacing}
             messageLayout={messageLayout}
             highlight={highlighted}
+            isMarked={marked}
             canDelete={canRedact || (canDeleteOwn && senderId === mx.getUserId())}
             canSendReaction={canSendReaction}
             canPinEvent={canPinEvent}
@@ -814,6 +820,7 @@ export function useTimelineEventRenderer({
         if (!membershipChanged && hideNickAvatarEvents) return null;
 
         const highlighted = focusItem?.index === item && focusItem.highlight;
+        const marked = activeReplyId === mEventId;
         const parsed = parseMemberEvent(mEvent);
 
         const timeJSX = (
@@ -833,6 +840,7 @@ export function useTimelineEventRenderer({
             room={room}
             mEvent={mEvent}
             highlight={highlighted}
+            isMarked={marked}
             collapse={collapse}
             canDelete={canRedact || mEvent.getSender() === mx.getUserId()}
             onReplyClick={onReplyClick}
@@ -857,6 +865,7 @@ export function useTimelineEventRenderer({
       },
       [EventType.RoomName]: (mEventId, mEvent, item, timelineSet, collapse) => {
         const highlighted = focusItem?.index === item && focusItem.highlight;
+        const marked = activeReplyId === mEventId;
         const senderId = mEvent.getSender() ?? '';
         const senderName =
           getMemberDisplayName(room, senderId, nicknames) || getMxIdLocalPart(senderId);
@@ -877,6 +886,7 @@ export function useTimelineEventRenderer({
             room={room}
             mEvent={mEvent}
             highlight={highlighted}
+            isMarked={marked}
             collapse={collapse}
             canDelete={canRedact || senderId === mx.getUserId()}
             onReplyClick={onReplyClick}
@@ -902,6 +912,7 @@ export function useTimelineEventRenderer({
       },
       [EventType.RoomTopic]: (mEventId, mEvent, item, timelineSet, collapse) => {
         const highlighted = focusItem?.index === item && focusItem.highlight;
+        const marked = activeReplyId === mEventId;
         const senderId = mEvent.getSender() ?? '';
         const senderName =
           getMemberDisplayName(room, senderId, nicknames) || getMxIdLocalPart(senderId);
@@ -923,6 +934,7 @@ export function useTimelineEventRenderer({
             room={room}
             mEvent={mEvent}
             highlight={highlighted}
+            isMarked={marked}
             collapse={collapse}
             canDelete={canRedact || senderId === mx.getUserId()}
             onReplyClick={onReplyClick}
@@ -948,6 +960,7 @@ export function useTimelineEventRenderer({
       },
       [EventType.RoomAvatar]: (mEventId, mEvent, item, timelineSet, collapse) => {
         const highlighted = focusItem?.index === item && focusItem.highlight;
+        const marked = activeReplyId === mEventId;
         const senderId = mEvent.getSender() ?? '';
         const senderName =
           getMemberDisplayName(room, senderId, nicknames) || getMxIdLocalPart(senderId);
@@ -969,6 +982,7 @@ export function useTimelineEventRenderer({
             room={room}
             mEvent={mEvent}
             highlight={highlighted}
+            isMarked={marked}
             collapse={collapse}
             canDelete={canRedact || senderId === mx.getUserId()}
             onReplyClick={onReplyClick}
@@ -994,6 +1008,7 @@ export function useTimelineEventRenderer({
       },
       [EventType.GroupCallMemberPrefix]: (mEventId, mEvent, item, timelineSet, collapse) => {
         const highlighted = focusItem?.index === item && focusItem.highlight;
+        const marked = activeReplyId === mEventId;
         const senderId = mEvent.getSender() ?? '';
         const senderName = getMemberDisplayName(room, senderId) || getMxIdLocalPart(senderId);
 
@@ -1022,6 +1037,7 @@ export function useTimelineEventRenderer({
             room={room}
             mEvent={mEvent}
             highlight={highlighted}
+            isMarked={marked}
             collapse={collapse}
             canDelete={canRedact || senderId === mx.getUserId()}
             hideReadReceipts={hideReads}
@@ -1048,6 +1064,7 @@ export function useTimelineEventRenderer({
       [EventType.RoomPinnedEvents]: (mEventId, mEvent, item, timelineSet, collapse) => {
         if (!showHiddenEvents) return null;
         const highlighted = focusItem?.index === item && focusItem.highlight;
+        const marked = activeReplyId === mEventId;
         const senderId = mEvent.getSender() ?? '';
         const senderName =
           getMemberDisplayName(room, senderId, nicknames) || getMxIdLocalPart(senderId);
@@ -1080,6 +1097,7 @@ export function useTimelineEventRenderer({
             room={room}
             mEvent={mEvent}
             highlight={highlighted}
+            isMarked={marked}
             collapse={collapse}
             canDelete={canRedact || senderId === mx.getUserId()}
             onReplyClick={onReplyClick}
@@ -1133,6 +1151,7 @@ export function useTimelineEventRenderer({
     (mEventId, mEvent, item, timelineSet, collapse) => {
       if (!showHiddenEvents) return null;
       const highlighted = focusItem?.index === item && focusItem.highlight;
+      const marked = activeReplyId === mEventId;
       const senderId = mEvent.getSender() ?? '';
       const senderName =
         getMemberDisplayName(room, senderId, nicknames) || getMxIdLocalPart(senderId);
@@ -1154,6 +1173,7 @@ export function useTimelineEventRenderer({
           room={room}
           mEvent={mEvent}
           highlight={highlighted}
+          isMarked={marked}
           collapse={collapse}
           canDelete={canRedact || senderId === mx.getUserId()}
           onReplyClick={onReplyClick}
@@ -1186,6 +1206,7 @@ export function useTimelineEventRenderer({
       if (mEvent.isRedaction()) return null;
 
       const highlighted = focusItem?.index === item && focusItem.highlight;
+      const marked = activeReplyId === mEventId;
       const senderId = mEvent.getSender() ?? '';
       const senderName =
         getMemberDisplayName(room, senderId, nicknames) || getMxIdLocalPart(senderId);
@@ -1207,6 +1228,7 @@ export function useTimelineEventRenderer({
           room={room}
           mEvent={mEvent}
           highlight={highlighted}
+          isMarked={marked}
           collapse={collapse}
           canDelete={canRedact || senderId === mx.getUserId()}
           onReplyClick={onReplyClick}