diff --git a/lib/pages/chat/events/message.dart b/lib/pages/chat/events/message.dart
index f72aa9b2c..3a326e617 100644
--- a/lib/pages/chat/events/message.dart
+++ b/lib/pages/chat/events/message.dart
@@ -265,6 +265,23 @@ class Message extends StatelessWidget {
                                                     ? displayname.color
                                                     : displayname
                                                         .lightColorText),
+                                                shadows:
+                                                    avatarPresenceBackgroundColor ==
+                                                            null
+                                                        ? null
+                                                        : [
+                                                            Shadow(
+                                                              offset:
+                                                                  const Offset(
+                                                                0.0,
+                                                                0.0,
+                                                              ),
+                                                              blurRadius: 5,
+                                                              color: theme
+                                                                  .colorScheme
+                                                                  .surface,
+                                                            ),
+                                                          ],
                                               ),
                                               maxLines: 1,
                                               overflow: TextOverflow.ellipsis,
@@ -443,12 +460,21 @@ class Message extends StatelessWidget {
               child: Center(
                 child: Padding(
                   padding: const EdgeInsets.only(top: 4.0),
-                  child: Text(
-                    event.originServerTs.localizedTime(context),
-                    style: TextStyle(
-                      fontWeight: FontWeight.bold,
-                      fontSize: 12 * AppConfig.fontSizeFactor,
-                      color: theme.colorScheme.secondary,
+                  child: Material(
+                    borderRadius:
+                        BorderRadius.circular(AppConfig.borderRadius * 2),
+                    color: theme.colorScheme.surface.withAlpha(128),
+                    child: Padding(
+                      padding: const EdgeInsets.symmetric(
+                        horizontal: 8.0,
+                        vertical: 2.0,
+                      ),
+                      child: Text(
+                        event.originServerTs.localizedTime(context),
+                        style: TextStyle(
+                          fontSize: 12 * AppConfig.fontSizeFactor,
+                        ),
+                      ),
                     ),
                   ),
                 ),
diff --git a/lib/pages/chat/events/room_creation_state_event.dart b/lib/pages/chat/events/room_creation_state_event.dart
index 8960a801f..398afc59f 100644
--- a/lib/pages/chat/events/room_creation_state_event.dart
+++ b/lib/pages/chat/events/room_creation_state_event.dart
@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_gen/gen_l10n/l10n.dart';
 import 'package:matrix/matrix.dart';
 
+import 'package:fluffychat/config/app_config.dart';
 import 'package:fluffychat/utils/date_time_extension.dart';
 import 'package:fluffychat/utils/matrix_sdk_extensions/matrix_locals.dart';
 import 'package:fluffychat/widgets/avatar.dart';
@@ -17,24 +18,35 @@ class RoomCreationStateEvent extends StatelessWidget {
     final matrixLocals = MatrixLocals(l10n);
     final theme = Theme.of(context);
     final roomName = event.room.getLocalizedDisplayname(matrixLocals);
-    return Column(
-      mainAxisSize: MainAxisSize.min,
-      children: [
-        Avatar(
-          mxContent: event.room.avatar,
-          name: roomName,
-          size: Avatar.defaultSize * 2,
+    return Padding(
+      padding: const EdgeInsets.only(bottom: 32.0),
+      child: Center(
+        child: Material(
+          color: theme.colorScheme.surface.withAlpha(128),
+          borderRadius: BorderRadius.circular(AppConfig.borderRadius),
+          child: Padding(
+            padding: const EdgeInsets.all(16.0),
+            child: Column(
+              mainAxisSize: MainAxisSize.min,
+              children: [
+                Avatar(
+                  mxContent: event.room.avatar,
+                  name: roomName,
+                  size: Avatar.defaultSize * 2,
+                ),
+                Text(
+                  roomName,
+                  style: theme.textTheme.headlineSmall,
+                ),
+                Text(
+                  '${event.originServerTs.localizedTime(context)} | ${l10n.countParticipants((event.room.summary.mJoinedMemberCount ?? 1) + (event.room.summary.mInvitedMemberCount ?? 0))}',
+                  style: theme.textTheme.labelSmall,
+                ),
+              ],
+            ),
+          ),
         ),
-        Text(
-          roomName,
-          style: theme.textTheme.headlineSmall,
-        ),
-        Text(
-          '${event.originServerTs.localizedTime(context)} | ${l10n.countParticipants((event.room.summary.mJoinedMemberCount ?? 1) + (event.room.summary.mInvitedMemberCount ?? 0))}',
-          style: theme.textTheme.labelSmall,
-        ),
-        const SizedBox(height: 48),
-      ],
+      ),
     );
   }
 }
diff --git a/lib/pages/chat/events/state_message.dart b/lib/pages/chat/events/state_message.dart
index 5fe56d1e7..6ef420e64 100644
--- a/lib/pages/chat/events/state_message.dart
+++ b/lib/pages/chat/events/state_message.dart
@@ -12,19 +12,29 @@ class StateMessage extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final theme = Theme.of(context);
     return Padding(
       padding: const EdgeInsets.symmetric(horizontal: 8.0),
       child: Center(
-        child: Container(
-          padding: const EdgeInsets.all(8),
-          child: Text(
-            event.calcLocalizedBodyFallback(
-              MatrixLocals(L10n.of(context)),
-            ),
-            textAlign: TextAlign.center,
-            style: TextStyle(
-              fontSize: 12 * AppConfig.fontSizeFactor,
-              decoration: event.redacted ? TextDecoration.lineThrough : null,
+        child: Padding(
+          padding: const EdgeInsets.all(4),
+          child: Material(
+            color: theme.colorScheme.surface.withAlpha(128),
+            borderRadius: BorderRadius.circular(AppConfig.borderRadius / 3),
+            child: Padding(
+              padding:
+                  const EdgeInsets.symmetric(horizontal: 8.0, vertical: 4.0),
+              child: Text(
+                event.calcLocalizedBodyFallback(
+                  MatrixLocals(L10n.of(context)),
+                ),
+                textAlign: TextAlign.center,
+                style: TextStyle(
+                  fontSize: 12 * AppConfig.fontSizeFactor,
+                  decoration:
+                      event.redacted ? TextDecoration.lineThrough : null,
+                ),
+              ),
             ),
           ),
         ),