diff --git a/src/components/rpkm/staff/home/qrscanner/QRScanner.tsx b/src/components/rpkm/staff/home/qrscanner/QRScanner.tsx
index 500c80d..caa797d 100644
--- a/src/components/rpkm/staff/home/qrscanner/QRScanner.tsx
+++ b/src/components/rpkm/staff/home/qrscanner/QRScanner.tsx
@@ -2,7 +2,7 @@
 import React, { useEffect } from 'react';
 import { motion } from 'framer-motion';
 import { Html5Qrcode } from 'html5-qrcode';
-
+import './style.css';
 interface ScanProps {
   sendCheckInRequest: (
     mode: 'userId' | 'studentId',
diff --git a/src/components/rpkm/staff/home/qrscanner/style.css b/src/components/rpkm/staff/home/qrscanner/style.css
new file mode 100644
index 0000000..375f088
--- /dev/null
+++ b/src/components/rpkm/staff/home/qrscanner/style.css
@@ -0,0 +1,3 @@
+#qr-shaded-region, #qr-canvas {
+    display: none;
+}
\ No newline at end of file