diff --git a/src/material/theme.css b/src/material/theme.css
index 5048f98..fc8d718 100644
--- a/src/material/theme.css
+++ b/src/material/theme.css
@@ -153,6 +153,8 @@
   --tutu-transition-shadow: box-shadow 175ms var(--tutu-anim-curve-std);
 
   --tutu-zidx-nav: 1100;
+
+  accent-color: var(--tutu-color-primary);
 }
 
 * {
diff --git a/src/material/theme.ts b/src/material/theme.ts
index a7c2c65..0eb4eaf 100644
--- a/src/material/theme.ts
+++ b/src/material/theme.ts
@@ -1,5 +1,5 @@
 import { Theme, createTheme } from "@suid/material/styles";
-import { deepPurple, amber } from "@suid/material/colors";
+import { deepPurple, amber, red } from "@suid/material/colors";
 import { Accessor } from "solid-js";
 
 /**
@@ -12,6 +12,9 @@ export function useRootTheme(): Accessor<Theme> {
         primary: {
           main: deepPurple[500],
         },
+        error: {
+          main: red[900],
+        },
         secondary: {
           main: amber.A200,
         },