CloudHub-Social · Just-Insane · Jun 14, 2026 · Jun 14, 2026
diff --git a/.changeset/resize-room-notification-icons.md b/.changeset/resize-room-notification-icons.md
@@ -0,0 +1,5 @@
+---
+default: patch
+---
+
+Refine message action and room notification icons after the Phosphor migration.
diff --git a/src/app/components/SwipeableMessageWrapper.tsx b/src/app/components/SwipeableMessageWrapper.tsx
@@ -4,7 +4,7 @@ import type { ReactNode } from 'react';
 import { useMemo, useState } from 'react';
 import { useAtomValue } from 'jotai';
 import { config } from 'folds';
-import { ArrowBendUpRightIcon, PHOSPHOR_SIZE } from '$components/icons/phosphor';
+import { ArrowBendUpLeftIcon, PHOSPHOR_SIZE } from '$components/icons/phosphor';
 import { mobileOrTablet } from '$utils/user-agent';
 import { RightSwipeAction, settingsAtom } from '$state/settings';
 
@@ -50,7 +50,7 @@ function ActiveSwipeWrapper({ children, onReply }: { children: ReactNode; onRepl
         }}
       >
         <motion.div style={{ opacity: iconOpacity }}>
-          <ArrowBendUpRightIcon
+          <ArrowBendUpLeftIcon
             size={PHOSPHOR_SIZE.toolbar}
             style={{
               color: isReady

diff --git a/src/app/components/event-history/EventHistory.tsx b/src/app/components/event-history/EventHistory.tsx
@@ -25,8 +25,8 @@ import { nicknamesAtom } from '$state/nicknames';
 import { UserAvatar } from '$components/user-avatar';
 import {
   userFallbackIcon,
-  ArrowBendUpRightIcon,
-  ChatTeardropDots,
+  ArrowBendUpLeftIcon,
+  ChatsCircle,
   composerIcon,
   menuIcon,
   Trash,
@@ -138,7 +138,7 @@ export const EventHistory = as<'div', EventHistoryProps>(
         <Menu className={css.MenuOptions}>
           <MenuItem
             size="300"
-            after={menuIcon(ArrowBendUpRightIcon)}
+            after={menuIcon(ArrowBendUpLeftIcon)}
             radii="300"
             fill="None"
             variant="Secondary"
@@ -153,7 +153,7 @@ export const EventHistory = as<'div', EventHistoryProps>(
           />
           <MenuItem
             size="300"
-            after={menuIcon(ChatTeardropDots)}
+            after={menuIcon(ChatsCircle)}
             radii="300"
             fill="None"
             variant="Secondary"

diff --git a/src/app/components/icons/phosphor.tsx b/src/app/components/icons/phosphor.tsx
@@ -1,6 +1,7 @@
 import type { IconProps } from '@phosphor-icons/react';
 import {
   ArrowsDownUpIcon,
+  ArrowBendUpLeftIcon,
   ArrowBendUpRightIcon,
   ArrowDownIcon,
   ArrowLeftIcon,
@@ -12,6 +13,7 @@ import {
   BasketballIcon,
   BellIcon,
   BellRingingIcon,
+  BellSimpleIcon,
   BellSlashIcon,
   BookmarkIcon,
   CaretDownIcon,
@@ -20,6 +22,7 @@ import {
   CaretUpIcon,
   ChatCircleIcon,
   ChatCircleDotsIcon,
+  ChatsCircleIcon,
   ChatsIcon,
   ChatTeardropDotsIcon,
   CheckIcon,
@@ -28,6 +31,7 @@ import {
   ClockCounterClockwiseIcon,
   CodeIcon,
   CodeBlockIcon,
+  ClipboardTextIcon,
   CoffeeIcon,
   CompassIcon,
   DatabaseIcon,
@@ -232,6 +236,7 @@ export function userFallbackIcon(size: UserFallbackSize = 'md', props?: IconProp
 
 export {
   ArrowsDownUpIcon as ArrowsDownUp,
+  ArrowBendUpLeftIcon,
   ArrowBendUpRightIcon,
   ArrowDownIcon as ArrowDown,
   ArrowLeftIcon as ArrowLeft,
@@ -243,6 +248,7 @@ export {
   BasketballIcon as Basketball,
   BellIcon as Bell,
   BellRingingIcon as BellRinging,
+  BellSimpleIcon as BellSimple,
   BellSlashIcon as BellSlash,
   BookmarkIcon as Bookmark,
   CaretDownIcon as CaretDown,
@@ -251,6 +257,7 @@ export {
   CaretUpIcon as CaretUp,
   ChatCircleIcon as ChatCircle,
   ChatCircleDotsIcon as ChatCircleDots,
+  ChatsCircleIcon as ChatsCircle,
   ChatsIcon as Chats,
   ChatTeardropDotsIcon as ChatTeardropDots,
   CheckIcon as Check,
@@ -259,6 +266,7 @@ export {
   ClockCounterClockwiseIcon as ClockCounterClockwise,
   CodeIcon as Code,
   CodeBlockIcon as CodeBlock,
+  ClipboardTextIcon as ClipboardText,
   CoffeeIcon as Coffee,
   CompassIcon as Compass,
   DatabaseIcon as Database,

diff --git a/src/app/features/room/message/Message.tsx b/src/app/features/room/message/Message.tsx
@@ -61,8 +61,9 @@ import type { StateEvents } from '$types/matrix-sdk';
 
 import { PowerIcon } from '$components/power';
 import {
-  ArrowBendUpRightIcon,
-  ChatCircleDots,
+  ArrowBendUpLeftIcon,
+  ChatsCircle,
+  ClipboardText,
   DotsThreeOutlineVerticalIcon,
   Info,
   Link,
@@ -199,7 +200,7 @@ export const MessageCopyTextItem = as<
   return (
     <MenuItem
       size="300"
-      after={<Icon size="100" src={Icons.Alphabet} />}
+      after={menuIcon(ClipboardText)}
       radii="300"
       onClick={handleCopy}
       {...props}
@@ -1151,7 +1152,7 @@ function MessageInternal(
                 size="300"
                 radii="300"
               >
-                {menuIcon(ArrowBendUpRightIcon)}
+                {menuIcon(ArrowBendUpLeftIcon)}
               </IconButton>
               {!isThreadedMessage && (
                 <IconButton
@@ -1167,7 +1168,7 @@ function MessageInternal(
                   size="300"
                   radii="300"
                 >
-                  {menuIcon(ChatCircleDots)}
+                  {menuIcon(ChatsCircle)}
                 </IconButton>
               )}
               {canEditEvent(mx, mEvent) && onEditId && (
@@ -1258,7 +1259,7 @@ function MessageInternal(
                         {relations && <MessageAllReactionItem room={room} relations={relations} />}
                         <MenuItem
                           size="300"
-                          after={menuIcon(ArrowBendUpRightIcon)}
+                          after={menuIcon(ArrowBendUpLeftIcon)}
                           radii="300"
                           data-event-id={mEvent.getId()}
                           onClick={(evt: React.MouseEvent) => {
@@ -1275,7 +1276,7 @@ function MessageInternal(
                         {!isThreadedMessage && (
                           <MenuItem
                             size="300"
-                            after={menuIcon(ChatCircleDots)}
+                            after={menuIcon(ChatsCircle)}
                             radii="300"
                             data-event-id={mEvent.getId()}
                             onClick={(evt: React.MouseEvent) => {
@@ -1654,7 +1655,7 @@ export const Event = as<'div', EventProps>(
                           <Box direction="Column" gap="100" className={css.MessageMenuGroup}>
                             <MenuItem
                               size="300"
-                              after={menuIcon(ArrowBendUpRightIcon)}
+                              after={menuIcon(ArrowBendUpLeftIcon)}
                               radii="300"
                               data-event-id={mEvent.getId()}
                               onClick={(evt: React.MouseEvent) => {
@@ -1724,7 +1725,7 @@ export const Event = as<'div', EventProps>(
                       size="300"
                       radii="300"
                     >
-                      {menuIcon(ArrowBendUpRightIcon)}
+                      {menuIcon(ArrowBendUpLeftIcon)}
                     </IconButton>
                     <IconButton
                       variant="SurfaceVariant"

diff --git a/src/app/features/room/message/MobileMessageMenu.tsx b/src/app/features/room/message/MobileMessageMenu.tsx
@@ -519,7 +519,7 @@ export function MobileMessageMenu({
                 if (!body || mEvent.isRedacted()) return null;
                 return (
                   <ActionItem
-                    icon={<Icon src={Icons.Alphabet} size="200" />}
+                    icon={<Icon src={Icons.ClipboardText} size="200" />}
                     label="Copy Text"
                     onClick={() => {
                       copyToClipboard(body);

diff --git a/src/app/hooks/useRoomsNotificationPreferences.ts b/src/app/hooks/useRoomsNotificationPreferences.ts
@@ -3,7 +3,14 @@ import type { ReactNode } from 'react';
 import type { IPushRules, MatrixClient } from '$types/matrix-sdk';
 import { ConditionKind, PushRuleKind, EventType } from '$types/matrix-sdk';
 import type { IconProps } from '@phosphor-icons/react';
-import { Bell, BellRinging, BellSlash, chipIcon, menuIcon } from '$components/icons/phosphor';
+import {
+  Bell,
+  BellRinging,
+  BellSimple,
+  BellSlash,
+  menuIcon,
+  sizedIcon,
+} from '$components/icons/phosphor';
 
 import { isRoomId } from '$utils/matrix';
 import { useAccountData } from './useAccountData';
@@ -107,18 +114,20 @@ export const roomNotificationModeIcon = (
   props?: IconProps
 ): ReactNode => {
   if (mode === RoomNotificationMode.Mute) return menuIcon(BellSlash, props);
-  if (mode === RoomNotificationMode.SpecialMessages) return menuIcon(Bell, props);
+  if (mode === RoomNotificationMode.SpecialMessages)
+    return menuIcon(Bell, { ...props, weight: 'fill' });
   if (mode === RoomNotificationMode.AllMessages) return menuIcon(BellRinging, props);
 
-  return menuIcon(Bell, props);
+  return menuIcon(BellSimple, props);
 };
 
 export const roomNotificationModeChipIcon = (mode?: RoomNotificationMode): ReactNode => {
-  if (mode === RoomNotificationMode.Mute) return chipIcon(BellSlash);
-  if (mode === RoomNotificationMode.SpecialMessages) return chipIcon(Bell);
-  if (mode === RoomNotificationMode.AllMessages) return chipIcon(BellRinging);
+  if (mode === RoomNotificationMode.Mute) return sizedIcon(BellSlash, '100');
+  if (mode === RoomNotificationMode.SpecialMessages)
+    return sizedIcon(Bell, '100', { weight: 'fill' });
+  if (mode === RoomNotificationMode.AllMessages) return sizedIcon(BellRinging, '100');
 
-  return chipIcon(Bell);
+  return sizedIcon(BellSimple, '100');
 };
 
 export const setRoomNotificationPreference = async (

diff --git a/src/app/icons/index.tsx b/src/app/icons/index.tsx
@@ -21,12 +21,12 @@ import {
   CaretLeft,
   CaretRight,
   CaretUp,
-  ChatCenteredText,
   ChatCircle,
   ChatCircleDots,
-  ChatCircleText,
+  ChatsCircle,
   Check,
   Checks,
+  ClipboardText,
   Clock,
   ClockCounterClockwise,
   Code,
@@ -225,6 +225,7 @@ export type IconName =
   | 'Markdown'
   | 'Attachment'
   | 'Alphabet'
+  | 'ClipboardText'
   | 'AlphabetUnderline'
   | 'Text'
   | 'Heading1'
@@ -314,10 +315,10 @@ export const Icons = {
   Funnel,
   Bookmark,
   Inbox: Tray,
-  Thread: ChatCenteredText,
-  ThreadPlus: ChatCircleText,
+  Thread: ChatsCircle,
+  ThreadPlus: ChatsCircle,
   ThreadUnread: ChatCircleDots,
-  ThreadReply: ChatCenteredText,
+  ThreadReply: ChatsCircle,
   Monitor,
   ScreenShare: Screencast,
   Server: HardDrives,
@@ -362,6 +363,7 @@ export const Icons = {
   Markdown: MarkdownLogo,
   Attachment: Paperclip,
   Alphabet: TextAa,
+  ClipboardText,
   AlphabetUnderline: TextAa,
   Text: TextT,
   Heading1: TextHOne,