diff --git a/example/lib/choose_user_page.dart b/example/lib/choose_user_page.dart
index c728a193..a64013b9 100644
--- a/example/lib/choose_user_page.dart
+++ b/example/lib/choose_user_page.dart
@@ -13,41 +13,41 @@ import 'routes/routes.dart';
 const kStreamApiKey = 'STREAM_API_KEY';
 const kStreamUserId = 'STREAM_USER_ID';
 const kStreamToken = 'STREAM_TOKEN';
-const kDefaultStreamApiKey = 's2dxdhpxd94g';
+const kDefaultStreamApiKey = 'uj7qrdbfrzvg';
 
 class ChooseUserPage extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final users = <String, User>{
-      'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjoidmlzaGFsIn0._JHWzo92fpTWZMZriJHXqOng6ShYVmWrdaIaPwEPKBg':
+      'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjoidmlzaGFsIn0.lCz-idDgaZ-xszjnuB_hTfeIOhTFmJtTB2fEjhwrcCI':
           User(
         id: 'vishal',
         extraData: {
           'name': 'Vishal',
         },
       ),
-      'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VyX2lkIjoic3VwZXItYmFuZC05In0.0L6lGoeLwkz0aZRUcpZKsvaXtNEDHBcezVTZ0oPq40A':
+      'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjoic3VwZXItYmFuZC05In0.1AvvK2TvEsfcxAlfOK2iUMFACucnk6N-Q8f5bbfnjCM':
           User(
         id: 'super-band-9',
         extraData: {
           'name': 'John Doe',
         },
       ),
-      'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjoic2FsdmF0b3JlIn0.GMEKyEhONmFnqtkf1TR1A3oUOSIWhjfQv5RpI906dAM':
+      'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjoic2FsdmF0b3JlIn0.uQ-pz8e1_C-Df2rIFpkkvWf7g4M0aW2Zkr7pHVhmU1Y':
           User(
         id: 'salvatore',
         extraData: {
           'name': 'Salvatore',
         },
       ),
-      'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjoidG9tbWFzbyJ9.GTalMeZHaBdpIM5w-KWrVIDSy-ODkHTRkf1GZbWAveM':
+      'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjoidG9tbWFzbyJ9.feLvMytd5_3-eETKrRdwtO3jcA0HxD8woFUbFU7gQCg':
           User(
         id: 'tommaso',
         extraData: {
           'name': 'Tommaso',
         },
       ),
-      'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjoiamFhcCJ9.xpGE2lu4OoYS7-2yy6PbF0gJnxOaxeGO4EU6xo4EdMU':
+      'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjoiamFhcCJ9.VLkLs6KH-jRRkPvhYMa4_lqN0R6WiK7JhJVmYvxcKz0':
           User(
         id: 'jaap',
         extraData: {
diff --git a/example/pubspec.yaml b/example/pubspec.yaml
index 6ae2ab54..c5bfa14f 100644
--- a/example/pubspec.yaml
+++ b/example/pubspec.yaml
@@ -1,6 +1,6 @@
 name: example
 description: A new Flutter project.
-version: 1.0.87+89
+version: 1.0.88+90
 
 environment:
   sdk: ">=2.2.2 <3.0.0"
diff --git a/lib/src/giphy_attachment.dart b/lib/src/giphy_attachment.dart
index 6ab38c83..3e29b2f1 100644
--- a/lib/src/giphy_attachment.dart
+++ b/lib/src/giphy_attachment.dart
@@ -79,57 +79,60 @@ class GiphyAttachment extends StatelessWidget {
                           );
                         }));
                       },
-                      child: CachedNetworkImage(
-                        height: size?.height,
-                        width: size?.width,
-                        placeholder: (_, __) {
-                          return Container(
-                            width: size?.width,
-                            height: size?.height,
-                            child: Center(
-                              child: CircularProgressIndicator(),
-                            ),
-                          );
-                        },
-                        imageUrl: attachment.thumbUrl ??
-                            attachment.imageUrl ??
-                            attachment.assetUrl,
-                        errorWidget: (context, url, error) => AttachmentError(
-                          attachment: attachment,
-                          size: size,
+                      child: ClipRRect(
+                        borderRadius: BorderRadius.only(
+                          topLeft: Radius.circular(8),
+                          topRight: Radius.circular(8),
+                        ),
+                        child: CachedNetworkImage(
+                          height: size?.height,
+                          width: size?.width,
+                          placeholder: (_, __) {
+                            return Container(
+                              width: size?.width,
+                              height: size?.height,
+                              child: Center(
+                                child: CircularProgressIndicator(),
+                              ),
+                            );
+                          },
+                          imageUrl: attachment.thumbUrl ??
+                              attachment.imageUrl ??
+                              attachment.assetUrl,
+                          errorWidget: (context, url, error) => AttachmentError(
+                            attachment: attachment,
+                            size: size,
+                          ),
+                          fit: BoxFit.cover,
                         ),
-                        fit: BoxFit.cover,
                       ),
                     ),
                   ),
                   Positioned(
-                    left: 0,
-                    top: 0,
-                    child: Container(
-                      decoration: BoxDecoration(
-                          color: Colors.white,
-                          borderRadius: BorderRadius.only(
-                            bottomRight: Radius.circular(16.0),
-                          )),
+                    bottom: 16,
+                    left: 16,
+                    child: Material(
+                      color: Colors.black.withOpacity(.5),
+                      shape: RoundedRectangleBorder(
+                        borderRadius: BorderRadius.circular(12),
+                      ),
                       child: Padding(
-                        padding: const EdgeInsets.only(
-                          left: 8.0,
-                          right: 8.0,
-                          top: 8.0,
-                          bottom: 4.0,
+                        padding: const EdgeInsets.symmetric(
+                          horizontal: 8.0,
+                          vertical: 4.0,
                         ),
                         child: Row(
                           children: [
                             StreamSvgIcon.lightning(
-                              color: StreamChatTheme.of(context).accentColor,
-                              size: 16.0,
+                              color: Colors.white,
+                              size: 16,
                             ),
                             Text(
                               'GIPHY',
                               style: TextStyle(
-                                color: StreamChatTheme.of(context).accentColor,
+                                color: Colors.white,
                                 fontWeight: FontWeight.bold,
-                                fontSize: 11.0,
+                                fontSize: 11,
                               ),
                             ),
                           ],
diff --git a/lib/src/image_footer.dart b/lib/src/image_footer.dart
index 7c39fb4c..3c37a66a 100644
--- a/lib/src/image_footer.dart
+++ b/lib/src/image_footer.dart
@@ -220,6 +220,7 @@ class _ImageFooterState extends State<ImageFooter> {
                         widget.mediaSelectedCallBack(position);
                       },
                       child: FittedBox(
+                        fit: BoxFit.cover,
                         child: Chewie(
                           controller: controllerPackage.chewieController,
                         ),
diff --git a/lib/src/message_widget.dart b/lib/src/message_widget.dart
index 27fa4df4..c0968cce 100644
--- a/lib/src/message_widget.dart
+++ b/lib/src/message_widget.dart
@@ -198,9 +198,7 @@ class MessageWidget extends StatefulWidget {
           'giphy': (context, message, attachment) {
             return GiphyAttachment(
               attachment: attachment,
-              messageTheme: messageTheme.copyWith(
-                messageBackgroundColor: Colors.white,
-              ),
+              messageTheme: messageTheme,
               message: message,
               size: Size(
                 MediaQuery.of(context).size.width * 0.8,
@@ -515,6 +513,10 @@ class _MessageWidgetState extends State<MessageWidget> {
     );
   }
 
+  bool get isGiphy =>
+      widget.message.attachments?.any((element) => element.type == 'giphy') ==
+      true;
+
   Widget _buildReadIndicator() {
     var padding = 0.0;
     return Stack(
@@ -708,9 +710,8 @@ class _MessageWidgetState extends State<MessageWidget> {
       onTap: () => retryMessage(context),
       onLongPress: () => onLongPress(context),
       child: Material(
-        color:
-            attachment?.type == 'giphy' ? Colors.white : _getBackgroundColor(),
-        clipBehavior: Clip.hardEdge,
+        color: _getBackgroundColor(),
+        clipBehavior: Clip.antiAlias,
         shape: attachmentShape,
         child: Padding(
           padding: widget.attachmentPadding,
@@ -861,9 +862,6 @@ class _MessageWidgetState extends State<MessageWidget> {
   }
 
   Widget _buildTextBubble(BuildContext context) {
-    final isOnlyEmoji =
-        widget.message.text.characters.every((c) => Emoji.byChar(c) != null);
-
     Widget child = Transform(
       transform: Matrix4.rotationY(widget.reverse ? pi : 0),
       alignment: Alignment.center,
@@ -907,10 +905,11 @@ class _MessageWidgetState extends State<MessageWidget> {
     );
   }
 
-  Color _getBackgroundColor() {
-    final isOnlyEmoji =
-        widget.message.text.characters.every((c) => Emoji.byChar(c) != null);
+  bool get isOnlyEmoji =>
+      widget.message.text.characters.isNotEmpty &&
+      widget.message.text.characters.every((c) => Emoji.byChar(c) != null);
 
+  Color _getBackgroundColor() {
     if (_hasReplyMessage) {
       return widget.messageTheme.messageBackgroundColor;
     }
@@ -930,6 +929,11 @@ class _MessageWidgetState extends State<MessageWidget> {
     if (isOnlyEmoji) {
       return Colors.transparent;
     }
+
+    if (isGiphy) {
+      return Colors.transparent;
+    }
+
     return widget.messageTheme.messageBackgroundColor;
   }