diff --git a/npm-shrinkwrap.json b/npm-shrinkwrap.json
index cd45233784a35e..e6e632b153ba3d 100644
--- a/npm-shrinkwrap.json
+++ b/npm-shrinkwrap.json
@@ -20,7 +20,6 @@
 			"version": "file:packages/calypso-build",
 			"dev": true,
 			"requires": {
-				"@automattic/calypso-color-schemes": "file:packages/calypso-color-schemes",
 				"@babel/core": "7.6.2",
 				"@babel/plugin-proposal-class-properties": "7.5.5",
 				"@babel/plugin-syntax-dynamic-import": "7.2.0",
diff --git a/packages/calypso-build/package.json b/packages/calypso-build/package.json
index 14f1d797055fc3..46c8cf118d608b 100644
--- a/packages/calypso-build/package.json
+++ b/packages/calypso-build/package.json
@@ -34,7 +34,6 @@
 		"extends @wordpress/browserslist-config"
 	],
 	"dependencies": {
-		"@automattic/calypso-color-schemes": "file:../calypso-color-schemes",
 		"@babel/core": "7.6.2",
 		"@babel/plugin-proposal-class-properties": "7.5.5",
 		"@babel/plugin-syntax-dynamic-import": "7.2.0",
diff --git a/packages/calypso-build/postcss.config.js b/packages/calypso-build/postcss.config.js
index 0557385b5ee330..2641b82979e6fe 100644
--- a/packages/calypso-build/postcss.config.js
+++ b/packages/calypso-build/postcss.config.js
@@ -1,7 +1,9 @@
-module.exports = ( { options: { preserveCssCustomProperties = true } } ) => ( {
+module.exports = ( {
+	options: { preserveCssCustomProperties = true, importCssCustomPropertiesFrom },
+} ) => ( {
 	plugins: {
 		'postcss-custom-properties': {
-			importFrom: [ require.resolve( '@automattic/calypso-color-schemes' ) ],
+			importFrom: importCssCustomPropertiesFrom,
 			preserve: preserveCssCustomProperties,
 		},
 		autoprefixer: {},
diff --git a/packages/calypso-build/webpack.config.js b/packages/calypso-build/webpack.config.js
index eab24523d5f896..d5032b3fe06fe1 100644
--- a/packages/calypso-build/webpack.config.js
+++ b/packages/calypso-build/webpack.config.js
@@ -106,10 +106,7 @@ function getWebpackConfig(
 					presets,
 					workerCount,
 				} ),
-				SassConfig.loader( {
-					preserveCssCustomProperties: false,
-					prelude: '@import "~@automattic/calypso-color-schemes/src/shared/colors";',
-				} ),
+				SassConfig.loader(),
 				FileConfig.loader(),
 			],
 		},
diff --git a/packages/calypso-build/webpack/sass.js b/packages/calypso-build/webpack/sass.js
index b0a86a3466f3f5..1fa84175f9226b 100644
--- a/packages/calypso-build/webpack/sass.js
+++ b/packages/calypso-build/webpack/sass.js
@@ -16,7 +16,12 @@ const path = require( 'path' );
  *
  * @return {Object}                                   webpack loader object
  */
-module.exports.loader = ( { preserveCssCustomProperties, includePaths, prelude } ) => ( {
+module.exports.loader = ( {
+	preserveCssCustomProperties,
+	importCssCustomPropertiesFrom,
+	includePaths,
+	prelude,
+} = {} ) => ( {
 	test: /\.(sc|sa|c)ss$/,
 	use: [
 		MiniCssExtractPluginWithRTL.loader,
@@ -32,6 +37,7 @@ module.exports.loader = ( { preserveCssCustomProperties, includePaths, prelude }
 				config: {
 					ctx: {
 						preserveCssCustomProperties,
+						importCssCustomPropertiesFrom,
 					},
 					path: path.join( __dirname, '..' ),
 				},
diff --git a/webpack.config.js b/webpack.config.js
index d37f9d2d048899..db836aed0cfba4 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -236,6 +236,7 @@ const webpackConfig = {
 				include: shouldTranspileDependency,
 			} ),
 			SassConfig.loader( {
+				importCssCustomPropertiesFrom: [ require.resolve( '@automattic/calypso-color-schemes' ) ],
 				preserveCssCustomProperties: true,
 				includePaths: [ path.join( __dirname, 'client' ) ],
 				prelude: `@import '${ path.join(