4 files changed, 17 insertions, 6 deletions

diff --git a/packages/theme/src/themes/dark/index.ts b/packages/theme/src/themes/dark/index.ts
index eaa552961..cb7ffc1cf 100644
--- a/packages/theme/src/themes/dark/index.ts
+++ b/packages/theme/src/themes/dark/index.ts
@@ -66,9 +66,11 @@ export const colorModalOverlayBackground = color(legacyStyles.darkThemeBlack).al
 
 // Workspace Drawer
 export const workspaceDrawerBackground = color(colorBackground).lighten(0.3).hex();
+export const workspaceDrawerAddButtonColor = legacyStyles.darkThemeGrayLighter;
+export const workspaceDrawerAddButtonHoverColor = legacyStyles.darkThemeGraySmoke;
 export const workspaceDrawerItemBorder = color(workspaceDrawerBackground).lighten(0.2).hex();
 export const workspaceDrawerItemActiveBackground = defaultStyles.brandPrimary;
-export const workspaceDrawerNameColor = colorText;
-export const workspaceDrawerNameActiveColor = 'white';
+export const workspaceDrawerItemNameColor = colorText;
+export const workspaceDrawerItemNameActiveColor = 'white';
 export const workspaceDrawerServicesColor = color(colorText).darken(0.5).hex();
 export const workspaceDrawerServicesActiveColor = color(defaultStyles.brandPrimary).lighten(0.5).hex();
diff --git a/packages/theme/src/themes/default/index.ts b/packages/theme/src/themes/default/index.ts
index fc03b67de..e6785ec5e 100644
--- a/packages/theme/src/themes/default/index.ts
+++ b/packages/theme/src/themes/default/index.ts
@@ -144,9 +144,11 @@ export const colorModalOverlayBackground = color('#000').alpha(0.5).rgb().string
 // Workspace Drawer
 export const workspaceDrawerWidth = '220px';
 export const workspaceDrawerBackground = color(colorBackground).lighten(0.1).hex();
+export const workspaceDrawerAddButtonColor = legacyStyles.themeGrayLight;
+export const workspaceDrawerAddButtonHoverColor = color(legacyStyles.themeGrayLight).lighten(0.1).hex();
 export const workspaceDrawerItemActiveBackground = legacyStyles.themeGrayLightest;
 export const workspaceDrawerItemBorder = color(workspaceDrawerBackground).darken(0.05).hex();
-export const workspaceDrawerNameColor = colorText;
-export const workspaceDrawerNameActiveColor = colorText;
+export const workspaceDrawerItemNameColor = colorText;
+export const workspaceDrawerItemNameActiveColor = colorText;
 export const workspaceDrawerServicesColor = color(colorText).lighten(1.5).hex();
 export const workspaceDrawerServicesActiveColor = workspaceDrawerServicesColor;
diff --git a/src/features/workspaces/components/WorkspaceDrawer.js b/src/features/workspaces/components/WorkspaceDrawer.js
index c9c4d3bc9..7bf3684c0 100644
--- a/src/features/workspaces/components/WorkspaceDrawer.js
+++ b/src/features/workspaces/components/WorkspaceDrawer.js
@@ -35,6 +35,12 @@ const styles = theme => ({
     marginRight: '10px',
     marginTop: '2px',
   },
+  addWorkspaceButtonIcon: {
+    fill: theme.workspaceDrawerAddButtonColor,
+    '&:hover': {
+      fill: theme.workspaceDrawerAddButtonHoverColor,
+    },
+  },
 });
 
 @injectSheet(styles) @observer
@@ -67,6 +73,7 @@ class WorkspaceDrawer extends Component {
             <Icon
               icon="mdiPlusBox"
               size={1.5}
+              className={classes.addWorkspaceButtonIcon}
             />
           </span>
         </H1>
diff --git a/src/features/workspaces/components/WorkspaceDrawerItem.js b/src/features/workspaces/components/WorkspaceDrawerItem.js
index 00207d323..935508943 100644
--- a/src/features/workspaces/components/WorkspaceDrawerItem.js
+++ b/src/features/workspaces/components/WorkspaceDrawerItem.js
@@ -18,10 +18,10 @@ const styles = theme => ({
   },
   name: {
     marginTop: '4px',
-    color: theme.workspaceDrawerNameColor,
+    color: theme.workspaceDrawerItemNameColor,
   },
   activeName: {
-    color: theme.workspaceDrawerNameActiveColor,
+    color: theme.workspaceDrawerItemNameActiveColor,
   },
   services: {
     display: 'block',