diff --git a/packages/sui-bundler/README.md b/packages/sui-bundler/README.md
index b2062c4b6..b5bfe71eb 100644
--- a/packages/sui-bundler/README.md
+++ b/packages/sui-bundler/README.md
@@ -151,6 +151,14 @@ $ sui-bundler lib src/index.js -o umd/fancy -p http://my-cdn.com/fancy --umd="My
 
 Then you can find your library directly in the provided namespace variable: `window.MyFancyLibraryNamespace` or `window.MyFancyLibraryNamespace.default` for ES6 exports.
 
+#### Use css chunks
+
+You can use `--chunk-css` option for creating different chunks for each css file
+
+```
+$ sui-bundler lib src/index.js -o umd/fancy -p http://my-cdn.com/fancy --chunk-css
+```
+
 ## Configuration
 
 This tool works with zero configuration out the box but you could use some configuration in order to optimize or adapt the output to your needs. For that, you need to add a property `sui-bundler` inside a `config` property in the package.json of your project.
diff --git a/packages/sui-bundler/bin/sui-bundler-lib.js b/packages/sui-bundler/bin/sui-bundler-lib.js
index a0a9f8ae9..773133df9 100755
--- a/packages/sui-bundler/bin/sui-bundler-lib.js
+++ b/packages/sui-bundler/bin/sui-bundler-lib.js
@@ -17,6 +17,7 @@ program
   .option('-u, --umd [libraryName]', 'Whether to output library as umb')
   .option('-r, --root', 'Create build in root dir instead of version subdir')
   .option('-p, --path [path]', 'Absolute public path where files will be located.')
+  .option('--chunk-css', 'Bundle css in chunks')
   .on('--help', () =>
     console.log(`Examples:
       $ sui-bundler lib src/index.js -o umd/my-lib -p http://my-cdn.com/my-lib -C'
@@ -27,7 +28,7 @@ program
 
 const [entry] = program.args
 const options = program.opts()
-const {clean = false, output, umd = false, root = false} = options
+const {clean = false, output, umd = false, root = false, chunkCss = false} = options
 const publicPath = options.path
 
 if (!output) {
@@ -46,7 +47,7 @@ process.env.NODE_ENV = process.env.NODE_ENV || 'production'
 
 const version = getPackageJson(process.cwd()).version
 const outputFolder = path.join(process.cwd(), output, path.sep, root ? '' : version)
-const webpackConfig = {...config, entry: path.resolve(process.cwd(), entry)}
+const webpackConfig = {...config({chunkCss}), entry: path.resolve(process.cwd(), entry)}
 webpackConfig.output.publicPath = publicPath + (root ? '' : version + '/')
 webpackConfig.output.path = outputFolder
 
diff --git a/packages/sui-bundler/webpack.config.lib.js b/packages/sui-bundler/webpack.config.lib.js
index 5a696fa8c..c992196aa 100644
--- a/packages/sui-bundler/webpack.config.lib.js
+++ b/packages/sui-bundler/webpack.config.lib.js
@@ -9,55 +9,58 @@ const sassRules = require('./shared/module-rules-sass.js')
 const {extractComments, sourceMap, supportLegacyBrowsers} = require('./shared/config.js')
 const {aliasFromConfig} = require('./shared/resolve-alias.js')
 
-const cssFileName = 'styles.css'
-
-module.exports = {
-  mode: 'production',
-  resolve: {
-    alias: {
-      ...aliasFromConfig
+module.exports = ({chunkCss} = {}) => {
+  const chunkCssName = config.onlyHash ? '[contenthash:8].css' : '[name].[contenthash:8].css'
+  const cssFileName = chunkCss ? chunkCssName : 'styles.css'
+  return {
+    mode: 'production',
+    resolve: {
+      alias: {
+        ...aliasFromConfig
+      },
+      fallback: {
+        assert: false,
+        fs: false,
+        http: require.resolve('stream-http'),
+        https: require.resolve('https-browserify'),
+        path: false
+      },
+      extensions: ['.js', '.tsx', '.ts', '.json'],
+      modules: ['node_modules', path.resolve(process.cwd())]
+    },
+    entry: config.vendor
+      ? {
+          app: MAIN_ENTRY_POINT,
+          vendor: config.vendor
+        }
+      : MAIN_ENTRY_POINT,
+    target: 'web',
+    output: {
+      filename: 'index.js'
     },
-    fallback: {
-      assert: false,
-      fs: false,
-      http: require.resolve('stream-http'),
-      https: require.resolve('https-browserify'),
-      path: false
+    optimization: {
+      // avoid looping over all the modules after the compilation
+      checkWasmTypes: false,
+      minimize: true,
+      minimizer: [minifyJs({extractComments, sourceMap})]
     },
-    extensions: ['.js', '.tsx', '.ts', '.json'],
-    modules: ['node_modules', path.resolve(process.cwd())]
-  },
-  entry: config.vendor
-    ? {
-        app: MAIN_ENTRY_POINT,
-        vendor: config.vendor
-      }
-    : MAIN_ENTRY_POINT,
-  target: 'web',
-  output: {
-    filename: 'index.js'
-  },
-  optimization: {
-    // avoid looping over all the modules after the compilation
-    checkWasmTypes: false,
-    minimize: true,
-    minimizer: [minifyJs({extractComments, sourceMap})]
-  },
-  plugins: cleanList([
-    new webpack.ProvidePlugin({
-      process: 'process/browser.js'
-    }),
-    new MiniCssExtractPlugin({
-      filename: cssFileName,
-      chunkFilename: cssFileName
-    }),
-    new webpack.optimize.LimitChunkCountPlugin({
-      maxChunks: 1
-    }),
-    new webpack.EnvironmentPlugin(envVars(config.env)),
-    definePlugin()
-  ]),
-  module: {
-    rules: [createCompilerRules({supportLegacyBrowsers}), sassRules]
+    plugins: cleanList([
+      new webpack.ProvidePlugin({
+        process: 'process/browser.js'
+      }),
+      new MiniCssExtractPlugin({
+        filename: cssFileName,
+        chunkFilename: cssFileName
+      }),
+      !chunkCss &&
+        new webpack.optimize.LimitChunkCountPlugin({
+          maxChunks: 1
+        }),
+      new webpack.EnvironmentPlugin(envVars(config.env)),
+      definePlugin()
+    ]),
+    module: {
+      rules: [createCompilerRules({supportLegacyBrowsers}), sassRules]
+    }
   }
 }