diff --git a/gulpfile.js b/gulpfile.js
index 0374c0ba81..f7457df6bc 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -20,6 +20,9 @@ const inject = require('gulp-inject');
 const postcss = require('gulp-postcss');
 const cssnano = require('cssnano');
 const autoprefixer = require('autoprefixer');
+const sass = require('gulp-sass');
+ 
+sass.compiler = require('node-sass')
 
 function serve() {
     browserSync.init({
@@ -71,8 +74,9 @@ function webpack() {
 }
 
 function css() {
-    return src('src/**/*.css', {base: './src/'})
+    return src(['src/**/*.css', 'src/**/*.scss'], {base: './src/'})
     .pipe(mode.development(sourcemaps.init({loadMaps: true})))
+    .pipe(sass().on('error', sass.logError))
     .pipe(postcss([
         autoprefixer(),
         cssnano()