Theme default divider

app/src/theme/ChakraThemeProvider.tsx

@@ -1,6 +1,5 @@
-import { extendTheme } from "@chakra-ui/react";
+import { extendTheme, defineStyleConfig, ChakraProvider } from "@chakra-ui/react";
 import "@fontsource/inconsolata";
-import { ChakraProvider } from "@chakra-ui/react";
 import { modalAnatomy } from "@chakra-ui/anatomy";
 import { createMultiStyleConfigHelpers } from "@chakra-ui/styled-system";
 
@@ -18,6 +17,13 @@ const modalTheme = defineMultiStyleConfig({
   }),
 });
 
+const Divider = defineStyleConfig({
+  baseStyle: {
+    borderColor: "gray.300",
+    backgroundColor: "gray.300",
+  },
+});
+
 const theme = extendTheme({
   styles: {
     global: (props: { colorMode: "dark" | "light" }) => ({
@@ -53,6 +59,7 @@ const theme = extendTheme({
       },
     },
     Modal: modalTheme,
+    Divider,
   },
 });