diff --git a/public/css/material.css b/public/css/material.css
new file mode 100644
index 0000000..5365a89
--- /dev/null
+++ b/public/css/material.css
@@ -0,0 +1,23 @@
+/* fallback */
+@font-face {
+    font-family: 'Material Icons';
+    font-style: normal;
+    font-weight: 400;
+    src: url('material_icon.woff2') format('woff2');
+  }
+  
+  .material-icons {
+    font-family: 'Material Icons';
+    font-weight: normal;
+    font-style: normal;
+    font-size: 24px;
+    line-height: 1;
+    letter-spacing: normal;
+    text-transform: none;
+    display: inline-block;
+    white-space: nowrap;
+    word-wrap: normal;
+    direction: ltr;
+    -webkit-font-feature-settings: 'liga';
+    -webkit-font-smoothing: antialiased;
+  }
\ No newline at end of file
diff --git a/public/css/material_icon.woff2 b/public/css/material_icon.woff2
new file mode 100644
index 0000000..d7f1511
Binary files /dev/null and b/public/css/material_icon.woff2 differ
diff --git a/resources/views/layouts/app_operasi.blade.php b/resources/views/layouts/app_operasi.blade.php
index 8b5a7b3..ba65fed 100644
--- a/resources/views/layouts/app_operasi.blade.php
+++ b/resources/views/layouts/app_operasi.blade.php
@@ -28,7 +28,8 @@
     <link rel="stylesheet" href="{{ asset('vendor/bootstrap/css/bootstrap.min.css') }}">
     <link href="{{ asset('css/select2.min.css') }}" rel="stylesheet" />
     <link rel="stylesheet" href="{{ asset('vendor/datepicker/css/bootstrap-datepicker.min.css') }}"/>
-    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+    <link href="{{ asset('css/material.css') }}" rel="stylesheet">
+
     <script src="{{ asset('js/jquery.min.js') }}"></script>
     <script src="{{ asset('vendor/bootstrap/js/bootstrap.min.js') }}"></script>
     <script src="{{ asset('js/select2.min.js') }}"></script>