diff --git a/src/renderer/styles/mixins.ts b/src/renderer/styles/mixins.ts
index 6901c2e69..0bee1ca77 100644
--- a/src/renderer/styles/mixins.ts
+++ b/src/renderer/styles/mixins.ts
@@ -28,3 +28,17 @@ export const coverBackground = css`
   background-position: center;
   background-size: cover;
 `;
+
+export const fadeIn = css`
+  animation: fadein 0.3s;
+
+  @keyframes fadein {
+    from {
+      opacity: 0;
+    }
+
+    to {
+      opacity: 1;
+    }
+  }
+`;