diff --git a/webapp/src/components/properties/lastModifiedBy/__snapshots__/lastModifiedBy.test.tsx.snap b/webapp/src/components/properties/lastModifiedBy/__snapshots__/lastModifiedBy.test.tsx.snap
index d283214ef..2084341f8 100644
--- a/webapp/src/components/properties/lastModifiedBy/__snapshots__/lastModifiedBy.test.tsx.snap
+++ b/webapp/src/components/properties/lastModifiedBy/__snapshots__/lastModifiedBy.test.tsx.snap
@@ -3,9 +3,13 @@
 exports[`components/properties/lastModifiedBy should match snapshot 1`] = `
 <div>
   <div
-    class="LastModifiedBy octo-propertyvalue readonly"
+    class="UserProperty octo-propertyvalue readonly"
   >
-    username_1
+    <div
+      class="UserProperty-item"
+    >
+      username_1
+    </div>
   </div>
 </div>
 `;
diff --git a/webapp/src/components/properties/lastModifiedBy/lastModifiedBy.tsx b/webapp/src/components/properties/lastModifiedBy/lastModifiedBy.tsx
index 83c6c437b..3234e5f16 100644
--- a/webapp/src/components/properties/lastModifiedBy/lastModifiedBy.tsx
+++ b/webapp/src/components/properties/lastModifiedBy/lastModifiedBy.tsx
@@ -3,15 +3,13 @@
 
 import React from 'react'
 
-import {IUser} from '../../../user'
 import {Card} from '../../../blocks/card'
 import {Board} from '../../../blocks/board'
 import {Block} from '../../../blocks/block'
-import {getBoardUsers} from '../../../store/users'
 import {useAppSelector} from '../../../store/hooks'
 import {getLastCardContent} from '../../../store/contents'
 import {getLastCardComment} from '../../../store/comments'
-import './lastModifiedBy.scss'
+import UserProperty from '../user/user'
 
 type Props = {
     card: Card,
@@ -19,7 +17,6 @@ type Props = {
 }
 
 const LastModifiedBy = (props: Props): JSX.Element => {
-    const boardUsersById = useAppSelector<{[key:string]: IUser}>(getBoardUsers)
     const lastContent = useAppSelector(getLastCardContent(props.card.id || '')) as Block
     const lastComment = useAppSelector(getLastCardComment(props.card.id)) as Block
 
@@ -32,9 +29,11 @@ const LastModifiedBy = (props: Props): JSX.Element => {
     }
 
     return (
-        <div className='LastModifiedBy octo-propertyvalue readonly'>
-            {(boardUsersById && boardUsersById[latestBlock.modifiedBy]?.username) || latestBlock.modifiedBy}
-        </div>
+        <UserProperty
+            value={latestBlock.modifiedBy}
+            readonly={true} // created by is an immutable property, so will always be readonly
+            onChange={() => { }} // since created by is immutable, we don't need to handle onChange
+        />
     )
 }
 
diff --git a/webapp/src/components/table/__snapshots__/table.test.tsx.snap b/webapp/src/components/table/__snapshots__/table.test.tsx.snap
index 0929f90f0..58cb62a1f 100644
--- a/webapp/src/components/table/__snapshots__/table.test.tsx.snap
+++ b/webapp/src/components/table/__snapshots__/table.test.tsx.snap
@@ -1389,9 +1389,13 @@ exports[`components/table/Table extended should match snapshot with UpdatedBy 1`
             style="width: 100px;"
           >
             <div
-              class="LastModifiedBy octo-propertyvalue readonly"
+              class="UserProperty octo-propertyvalue readonly"
             >
-              username_4
+              <div
+                class="UserProperty-item"
+              >
+                username_4
+              </div>
             </div>
           </div>
         </div>
@@ -1477,9 +1481,13 @@ exports[`components/table/Table extended should match snapshot with UpdatedBy 1`
             style="width: 100px;"
           >
             <div
-              class="LastModifiedBy octo-propertyvalue readonly"
+              class="UserProperty octo-propertyvalue readonly"
             >
-              username_3
+              <div
+                class="UserProperty-item"
+              >
+                username_3
+              </div>
             </div>
           </div>
         </div>
diff --git a/webapp/src/components/table/table.test.tsx b/webapp/src/components/table/table.test.tsx
index f8638f1b1..566547e5b 100644
--- a/webapp/src/components/table/table.test.tsx
+++ b/webapp/src/components/table/table.test.tsx
@@ -303,7 +303,6 @@ describe('components/table/Table extended', () => {
 
     test('should match snapshot with UpdatedAt', async () => {
         const board = TestBlockFactory.createBoard()
-
         const dateUpdatedId = Utils.createGuid(IDType.User)
         board.cardProperties.push({
             id: dateUpdatedId,