2 files changed, 33 insertions, 0 deletions

diff --git a/packages/theme/src/themes/dark/index.ts b/packages/theme/src/themes/dark/index.ts
index bd9f001e8..d29345298 100644
--- a/packages/theme/src/themes/dark/index.ts
+++ b/packages/theme/src/themes/dark/index.ts
@@ -118,3 +118,18 @@ export const announcements = merge({}, defaultStyles.announcements, {
     background: legacyStyles.darkThemeGrayDark,
   },
 });
+
+// Todos
+export const todos = merge({}, defaultStyles.todos, {
+  todosLayer: {
+    borderLeftColor: legacyStyles.darkThemeGrayDarker,
+  },
+  toggleButton: {
+    background: defaultStyles.styleTypes.primary.accent,
+    textColor: defaultStyles.styleTypes.primary.contrast,
+    shadowColor: 'rgba(0, 0, 0, 0.2)',
+  },
+  dragIndicator: {
+    background: legacyStyles.themeGrayLight,
+  },
+});
diff --git a/packages/theme/src/themes/default/index.ts b/packages/theme/src/themes/default/index.ts
index 0f02fa3c8..9f9c39f9a 100644
--- a/packages/theme/src/themes/default/index.ts
+++ b/packages/theme/src/themes/default/index.ts
@@ -207,3 +207,21 @@ export const announcements = {
     background: legacyStyles.themeGrayLightest,
   },
 };
+
+// Todos
+export const todos = {
+  todosLayer: {
+    borderLeftColor: legacyStyles.themeGrayLighter,
+  },
+  toggleButton: {
+    background: styleTypes.primary.accent,
+    textColor: styleTypes.primary.contrast,
+    shadowColor: 'rgba(0, 0, 0, 0.2)',
+  },
+  dragIndicator: {
+    background: legacyStyles.themeGrayLight,
+  },
+  resizeHandler: {
+    backgroundHover: styleTypes.primary.accent,
+  }
+};