diff --git a/lib/widgets/fullscreen/overlay/bottom.dart b/lib/widgets/fullscreen/overlay/bottom.dart
index edc0c48e2..d4b8c0264 100644
--- a/lib/widgets/fullscreen/overlay/bottom.dart
+++ b/lib/widgets/fullscreen/overlay/bottom.dart
@@ -8,6 +8,7 @@ import 'package:aves/utils/constants.dart';
 import 'package:aves/utils/geo_utils.dart';
 import 'package:aves/widgets/common/fx/blurred.dart';
 import 'package:aves/widgets/common/icons.dart';
+import 'package:aves/widgets/fullscreen/overlay/common.dart';
 import 'package:flutter/material.dart';
 import 'package:intl/intl.dart';
 import 'package:provider/provider.dart';
@@ -79,7 +80,7 @@ class _FullscreenBottomOverlayState extends State<FullscreenBottomOverlay> {
             final overlayContentMaxWidth = mqWidth - viewPadding.horizontal - innerPadding.horizontal;
 
             return Container(
-              color: Colors.black26,
+              color: FullscreenOverlay.backgroundColor,
               padding: viewInsets + viewPadding.copyWith(top: 0),
               child: FutureBuilder(
                 future: _detailLoader,
diff --git a/lib/widgets/fullscreen/overlay/common.dart b/lib/widgets/fullscreen/overlay/common.dart
index dc94713a8..38bf1c89c 100644
--- a/lib/widgets/fullscreen/overlay/common.dart
+++ b/lib/widgets/fullscreen/overlay/common.dart
@@ -1,6 +1,18 @@
 import 'package:aves/widgets/common/fx/blurred.dart';
 import 'package:flutter/material.dart';
 
+class FullscreenOverlay {
+  static const backgroundColor = Colors.black26;
+
+  static BoxBorder buildBorder(BuildContext context) {
+    final subPixel = MediaQuery.of(context).devicePixelRatio > 2;
+    return Border.all(
+      color: Colors.white30,
+      width: subPixel ? 0.5 : 1.0,
+    );
+  }
+}
+
 class OverlayButton extends StatelessWidget {
   final Animation<double> scale;
   final Widget child;
@@ -14,10 +26,10 @@ class OverlayButton extends StatelessWidget {
       child: BlurredOval(
         child: Material(
           type: MaterialType.circle,
-          color: Colors.black26,
+          color: FullscreenOverlay.backgroundColor,
           child: Ink(
             decoration: BoxDecoration(
-              border: Border.all(color: Colors.white30, width: 0.5),
+              border: FullscreenOverlay.buildBorder(context),
               shape: BoxShape.circle,
             ),
             child: child,
diff --git a/lib/widgets/fullscreen/overlay/video.dart b/lib/widgets/fullscreen/overlay/video.dart
index 27c903b91..69633dd69 100644
--- a/lib/widgets/fullscreen/overlay/video.dart
+++ b/lib/widgets/fullscreen/overlay/video.dart
@@ -179,8 +179,8 @@ class VideoControlOverlayState extends State<VideoControlOverlay> with SingleTic
           child: Container(
             padding: const EdgeInsets.symmetric(vertical: 4, horizontal: 16) + const EdgeInsets.only(bottom: 16),
             decoration: BoxDecoration(
-              color: Colors.black26,
-              border: Border.all(color: Colors.white30, width: 0.5),
+              color: FullscreenOverlay.backgroundColor,
+              border: FullscreenOverlay.buildBorder(context),
               borderRadius: const BorderRadius.all(
                 Radius.circular(progressBarBorderRadius),
               ),