diff --git a/common/changes/@uifabric/variants/phkuo-fixMerging_2018-03-28-23-01.json b/common/changes/@uifabric/variants/phkuo-fixMerging_2018-03-28-23-01.json
new file mode 100644
index 00000000000000..fcb463a5a9625a
--- /dev/null
+++ b/common/changes/@uifabric/variants/phkuo-fixMerging_2018-03-28-23-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/variants",
+      "comment": "fix theme output from variants",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/variants",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/variants/src/variants.ts b/packages/variants/src/variants.ts
index b1c9478b3c68a0..16830529a927ef 100644
--- a/packages/variants/src/variants.ts
+++ b/packages/variants/src/variants.ts
@@ -6,6 +6,19 @@ import {
 } from '@uifabric/styling/lib/index';
 import { createTheme } from '@uifabric/styling/lib/index';
 
+function makeThemeFromPartials(
+  originalTheme: IPartialTheme,
+  partialPalette: Partial<IPalette>,
+  partialSemantic: Partial<ISemanticColors>): ITheme {
+  return createTheme({
+    ...originalTheme,
+    ...{
+      palette: { ...originalTheme.palette, ...partialPalette },
+      semanticColors: { ...originalTheme.semanticColors, ...partialSemantic }
+    }
+  });
+}
+
 /**
  * A variant where the background soft shade of the neutral color. Most other colors remain unchanged.
  *
@@ -54,18 +67,9 @@ export function getNeutralVariant(theme: IPartialTheme): ITheme {
     bodyBackground: p.neutralLighter
   };
 
-  return createTheme({ ...theme, ...{ palette: partialPalette, semanticColors: partialSemantic } });
+  return makeThemeFromPartials(theme, partialPalette, partialSemantic);
 }
 
-/* Variants
- * Variants are themes based off the current theme.
- * Each variant is a subset of the current theme, rearranging slots to create a theme of a different style.
- * Variants are meant to be applied to sections of a page, not the entire page.
- * They can be used to highlight or de-emphasize sections of a page.
- *
- * Variants are still under development.
- */
-
 /**
  * A variant where the background a softer version of the primary color. Most other colors remain unchanged.
  *
@@ -121,7 +125,7 @@ export function getSoftVariant(theme: IPartialTheme): ITheme {
     // inputFocusBorderAlt: p.themePrimary,
   };
 
-  return createTheme({ ...theme, ...{ palette: partialPalette, semanticColors: partialSemantic } });
+  return makeThemeFromPartials(theme, partialPalette, partialSemantic);
 }
 
 /**
@@ -186,5 +190,5 @@ export function getStrongVariant(theme: IPartialTheme): ITheme {
     // inputFocusBorderAlt: p.themePrimary,
   };
 
-  return createTheme({ ...theme, ...{ palette: partialPalette, semanticColors: partialSemantic } });
+  return makeThemeFromPartials(theme, partialPalette, partialSemantic);
 }
\ No newline at end of file