diff --git a/lib/components/card_list.dart b/lib/components/card_list.dart
index 66aa5e6..b9d4523 100644
--- a/lib/components/card_list.dart
+++ b/lib/components/card_list.dart
@@ -49,7 +49,7 @@ class CardList extends StatelessWidget {
                   ),
                   const Spacer(),
                   Padding(
-                    padding: const EdgeInsets.all(8.0),
+                    padding: EdgeInsets.all(0.08),
                     child: const Row(
                       crossAxisAlignment: CrossAxisAlignment.start,
                       mainAxisAlignment: MainAxisAlignment.spaceBetween,
diff --git a/lib/components/scan_button.dart b/lib/components/scan_button.dart
index e3695c4..283f46b 100644
--- a/lib/components/scan_button.dart
+++ b/lib/components/scan_button.dart
@@ -7,19 +7,28 @@ class ScanButton extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final screenWidth = MediaQuery.of(context).size.width;
+
+    // Skala berdasarkan lebar layar
+    final buttonSize = screenWidth * 0.20; // Adjust as needed
+    final iconSize = buttonSize * 0.7;
+    final padding = buttonSize * 0.15;
+
     return Container(
-      width: 76,
-      height: 76,
+      width: buttonSize,
+      height: buttonSize,
+      // width: 76,
+      // height: 76,
       decoration: BoxDecoration(
         shape: BoxShape.circle,
         color: const Color.fromARGB(223, 67, 63, 179),
       ),
-      padding: EdgeInsets.all(10),
+      padding: EdgeInsets.all(padding),
       child: IconButton(
         icon: SvgPicture.asset(
           'assets/icons/Scan.svg',
-          width: 60,
-          height: 60,
+          width: iconSize,
+          height: iconSize,
           colorFilter: ColorFilter.mode(
             Color.fromARGB(255, 217, 219, 227),
             BlendMode.srcIn,
diff --git a/lib/screen/Home_screen.dart b/lib/screen/Home_screen.dart
index 2e36c93..965ea0d 100644
--- a/lib/screen/Home_screen.dart
+++ b/lib/screen/Home_screen.dart
@@ -21,6 +21,9 @@ class _HomeScreenState extends State<HomeScreen> {
   @override
   Widget build(BuildContext context) {
     final Size size = MediaQuery.of(context).size;
+    final screenWidth = MediaQuery.of(context).size.width;
+    final buttonScanSize = screenWidth * 0.20;
+    final double bottomPadding = (9000 / screenWidth).clamp(0, 0.2);
     return Scaffold(
       // appBar: AppBar(
       //   elevation: 0,
@@ -237,9 +240,10 @@ class _HomeScreenState extends State<HomeScreen> {
             ],
           ),
           Positioned(bottom: 0, left: 0, right: 0, child: MainMenu()),
+
           Positioned(
-            bottom: 8,
-            left: MediaQuery.of(context).size.width / 2 - 38,
+            bottom: bottomPadding * 32,
+            left: (screenWidth - buttonScanSize) / 2,
             child: Transform.translate(
               offset: Offset(0, -20),
               child: ScanButton(),
diff --git a/lib/screen/koleksi_screen.dart b/lib/screen/koleksi_screen.dart
index 6266b63..e044652 100644
--- a/lib/screen/koleksi_screen.dart
+++ b/lib/screen/koleksi_screen.dart
@@ -36,6 +36,9 @@ class _KoleksiScreenState extends State<KoleksiScreen> {
 
   @override
   Widget build(BuildContext context) {
+    final screenWidth = MediaQuery.of(context).size.width;
+    final buttonScanSize = screenWidth * 0.20;
+    final double bottomPadding = (9000 / screenWidth).clamp(0, 0.2);
     return Scaffold(
       extendBody: true,
       body: Stack(
@@ -150,8 +153,8 @@ class _KoleksiScreenState extends State<KoleksiScreen> {
           ),
           Positioned(bottom: 0, left: 0, right: 0, child: MainMenu()),
           Positioned(
-            bottom: 8,
-            left: MediaQuery.of(context).size.width / 2 - 38,
+            bottom: bottomPadding * 32,
+            left: (screenWidth - buttonScanSize) / 2,
             child: Transform.translate(
               offset: Offset(0, -20),
               child: ScanButton(),
diff --git a/lib/screen/pustaka_screen.dart b/lib/screen/pustaka_screen.dart
index 6b545cf..aaee48a 100644
--- a/lib/screen/pustaka_screen.dart
+++ b/lib/screen/pustaka_screen.dart
@@ -57,6 +57,9 @@ class _PustakaScreenState extends State<PustakaScreen> {
 
   @override
   Widget build(BuildContext context) {
+    final screenWidth = MediaQuery.of(context).size.width;
+    final buttonScanSize = screenWidth * 0.20;
+    final double bottomPadding = (9000 / screenWidth).clamp(0, 0.2);
     List<Map<String, dynamic>> filteredCollections =
         _collections
             .where(
@@ -290,8 +293,8 @@ class _PustakaScreenState extends State<PustakaScreen> {
             ],
           ),
           Positioned(
-            bottom: 8,
-            left: MediaQuery.of(context).size.width / 2 - 38,
+            bottom: bottomPadding * 32,
+            left: (screenWidth - buttonScanSize) / 2,
             child: Transform.translate(
               offset: Offset(0, -20),
               child: ScanButton(),
diff --git a/lib/screen/saya/profile_screen.dart b/lib/screen/saya/profile_screen.dart
index cd38a39..8db91f4 100644
--- a/lib/screen/saya/profile_screen.dart
+++ b/lib/screen/saya/profile_screen.dart
@@ -54,6 +54,9 @@ class _ProfileScreenState extends State<ProfileScreen> {
 
   @override
   Widget build(BuildContext context) {
+    final screenWidth = MediaQuery.of(context).size.width;
+    final buttonScanSize = screenWidth * 0.20;
+    final double bottomPadding = (9000 / screenWidth).clamp(0, 0.2);
     return Scaffold(
       backgroundColor: const Color.fromARGB(255, 255, 255, 255),
       body: Stack(
@@ -341,8 +344,8 @@ class _ProfileScreenState extends State<ProfileScreen> {
           ),
           Positioned(bottom: 0, left: 0, right: 0, child: MainMenu()),
           Positioned(
-            bottom: 8,
-            left: MediaQuery.of(context).size.width / 2 - 38,
+            bottom: bottomPadding * 32,
+            left: (screenWidth - buttonScanSize) / 2,
             child: Transform.translate(
               offset: Offset(0, -20),
               child: ScanButton(),