diff --git a/src/components/ChatTranscript/ChatTranscript.tsx b/src/components/ChatTranscript/ChatTranscript.tsx
index 9821bf5..e326255 100644
--- a/src/components/ChatTranscript/ChatTranscript.tsx
+++ b/src/components/ChatTranscript/ChatTranscript.tsx
@@ -4,9 +4,10 @@ import { UnsentMessage, ReceivedMessage } from 'models/chat'
 
 export interface ChatTranscriptProps {
   messageLog: Array<UnsentMessage | ReceivedMessage>
+  userId: string
 }
 
-export const ChatTranscript = ({ messageLog }: ChatTranscriptProps) => {
+export const ChatTranscript = ({ messageLog, userId }: ChatTranscriptProps) => {
   return (
     <div className="ChatTranscript flex flex-col">
       {messageLog.map((message, idx) => (
@@ -15,11 +16,12 @@ export const ChatTranscript = ({ messageLog }: ChatTranscriptProps) => {
             key={`${idx}_${message}`}
             variant="body1"
             sx={{
-              backgroundColor: 'primary.dark',
+              backgroundColor:
+                message.authorId === userId ? 'primary.dark' : 'grey.700',
               margin: 0.5,
               padding: 1,
               borderRadius: 4,
-              float: 'left',
+              float: message.authorId === userId ? 'right' : 'left',
             }}
           >
             {message.text}
diff --git a/src/components/Room/Room.tsx b/src/components/Room/Room.tsx
index 8c3633f..25303d7 100644
--- a/src/components/Room/Room.tsx
+++ b/src/components/Room/Room.tsx
@@ -93,7 +93,7 @@ export function Room({
           Send
         </Button>
       </form>
-      <ChatTranscript messageLog={messageLog} />
+      <ChatTranscript messageLog={messageLog} userId={userId} />
     </div>
   )
 }
diff --git a/src/index.tsx b/src/index.tsx
index c17cec2..d3f52cf 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -2,6 +2,7 @@ import ReactDOM from 'react-dom/client'
 import { BrowserRouter as Router } from 'react-router-dom'
 import { ThemeProvider, createTheme } from '@mui/material/styles'
 import CssBaseline from '@mui/material/CssBaseline'
+import 'typeface-roboto'
 
 import * as serviceWorkerRegistration from 'serviceWorkerRegistration'
 import 'index.sass'