diff --git a/src/renderer/components/paper/index.tsx b/src/renderer/components/paper/index.tsx
new file mode 100644
index 000000000..ed4e65fbf
--- /dev/null
+++ b/src/renderer/components/paper/index.tsx
@@ -0,0 +1,17 @@
+import styled from '@emotion/styled';
+import {
+  Paper as MantinePaper,
+  PaperProps as MantinePaperProps,
+} from '@mantine/core';
+
+export interface PaperProps extends MantinePaperProps {
+  children: React.ReactNode;
+}
+
+const StyledPaper = styled(MantinePaper)`
+  background: var(--paper-bg);
+`;
+
+export const Paper = ({ children, ...props }: PaperProps) => {
+  return <StyledPaper {...props}>{children}</StyledPaper>;
+};
diff --git a/src/renderer/themes/default.scss b/src/renderer/themes/default.scss
index 4ffc0815b..698b2dc88 100644
--- a/src/renderer/themes/default.scss
+++ b/src/renderer/themes/default.scss
@@ -66,6 +66,8 @@
   --toast-description-fg: rgb(193, 194, 197);
   --toast-bg: rgb(16, 16, 16);
 
+  --paper-bg: rgb(29, 29, 29);
+
   .ag-theme-alpine-dark {
     --ag-borders: none;
     --ag-background-color: #101010;