diff --git a/src/fireedge/src/client/apps/provision/theme.js b/src/fireedge/src/client/apps/provision/theme.js
index 2026623d10..73557a8696 100644
--- a/src/fireedge/src/client/apps/provision/theme.js
+++ b/src/fireedge/src/client/apps/provision/theme.js
@@ -14,12 +14,13 @@
  * limitations under the License.                                            *
  * ------------------------------------------------------------------------- */
 import Color from 'client/constants/color'
+import { SCHEMES } from 'client/constants'
 
 /**
- * @param {string} scheme - Scheme type: 'dark' or 'light'
+ * @param {SCHEMES} scheme - Scheme type
  * @returns {object} Provision theme
  */
-const theme = (scheme = 'dark') => ({
+const theme = (scheme = SCHEMES.DARK) => ({
   palette: {
     type: scheme,
     common: {
@@ -27,8 +28,8 @@ const theme = (scheme = 'dark') => ({
       white: '#ffffff'
     },
     background: {
-      paper: scheme === 'dark' ? '#2a2d3d' : '#ffffff',
-      default: scheme === 'dark' ? '#222431' : '#f2f4f8'
+      paper: scheme === SCHEMES.DARK ? '#2a2d3d' : '#ffffff',
+      default: scheme === SCHEMES.DARK ? '#222431' : '#f2f4f8'
     },
     primary: {
       light: '#2a2d3d',
diff --git a/src/fireedge/src/client/apps/sunstone/theme.js b/src/fireedge/src/client/apps/sunstone/theme.js
index da83dbd69a..63763adf58 100644
--- a/src/fireedge/src/client/apps/sunstone/theme.js
+++ b/src/fireedge/src/client/apps/sunstone/theme.js
@@ -14,12 +14,13 @@
  * limitations under the License.                                            *
  * ------------------------------------------------------------------------- */
 import Color from 'client/constants/color'
+import { SCHEMES } from 'client/constants'
 
 /**
- * @param {string} scheme - Scheme type: 'dark' or 'light'
- * @returns {object} Sunstone theme
+ * @param {SCHEMES} scheme - Scheme type
+ * @returns {object} Provision theme
  */
-const theme = (scheme = 'dark') => ({
+const theme = (scheme = SCHEMES.DARK) => ({
   palette: {
     type: scheme,
     common: {
@@ -27,8 +28,8 @@ const theme = (scheme = 'dark') => ({
       white: '#ffffff'
     },
     background: {
-      paper: scheme === 'dark' ? '#2a2d3d' : '#ffffff',
-      default: scheme === 'dark' ? '#222431' : '#f2f4f8'
+      paper: scheme === SCHEMES.DARK ? '#2a2d3d' : '#ffffff',
+      default: scheme === SCHEMES.DARK ? '#222431' : '#f2f4f8'
     },
     primary: {
       light: '#2a2d3d',
diff --git a/src/fireedge/src/client/components/Cards/SelectCard/styles.js b/src/fireedge/src/client/components/Cards/SelectCard/styles.js
index f795d7133c..9e650d6d39 100644
--- a/src/fireedge/src/client/components/Cards/SelectCard/styles.js
+++ b/src/fireedge/src/client/components/Cards/SelectCard/styles.js
@@ -15,6 +15,8 @@
  * ------------------------------------------------------------------------- */
 import { makeStyles } from '@material-ui/core'
 
+import { SCHEMES } from 'client/constants'
+
 const styles = makeStyles(theme => ({
   root: ({ isSelected }) => ({
     height: '100%',
@@ -62,7 +64,7 @@ const styles = makeStyles(theme => ({
     filter: ({ isSelected, disableFilterImage }) =>
       disableFilterImage
         ? 'none'
-        : (theme.palette.type === 'dark' || isSelected)
+        : (theme.palette.type === SCHEMES.DARK || isSelected)
           ? 'contrast(0) brightness(2)'
           : 'contrast(0) brightness(0.8)'
   },
diff --git a/src/fireedge/src/client/components/Cards/WavesCard.js b/src/fireedge/src/client/components/Cards/WavesCard.js
index e790072f68..246eebda09 100644
--- a/src/fireedge/src/client/components/Cards/WavesCard.js
+++ b/src/fireedge/src/client/components/Cards/WavesCard.js
@@ -20,10 +20,11 @@ import clsx from 'clsx'
 import { Paper, Typography, makeStyles, lighten, darken } from '@material-ui/core'
 
 import { addOpacityToColor } from 'client/utils'
+import { SCHEMES } from 'client/constants'
 
 const useStyles = makeStyles(theme => {
-  const getBackgroundColor = theme.palette.type === 'dark' ? darken : lighten
-  const getContrastBackgroundColor = theme.palette.type === 'light' ? darken : lighten
+  const getBackgroundColor = theme.palette.type === SCHEMES.DARK ? darken : lighten
+  const getContrastBackgroundColor = theme.palette.type === SCHEMES.LIGHT ? darken : lighten
 
   return {
     root: {
diff --git a/src/fireedge/src/client/components/Status/Chip.js b/src/fireedge/src/client/components/Status/Chip.js
index 18e287ccb6..eff48169f6 100644
--- a/src/fireedge/src/client/components/Status/Chip.js
+++ b/src/fireedge/src/client/components/Status/Chip.js
@@ -18,10 +18,11 @@ import PropTypes from 'prop-types'
 
 import { makeStyles, Typography, lighten, darken } from '@material-ui/core'
 import { addOpacityToColor } from 'client/utils'
+import { SCHEMES } from 'client/constants'
 
 const useStyles = makeStyles(theme => {
-  const getBackgroundColor = theme.palette.type === 'dark' ? lighten : darken
-  const defaultStateColor = theme.palette.grey[theme.palette.type === 'dark' ? 300 : 700]
+  const getBackgroundColor = theme.palette.type === SCHEMES.DARK ? lighten : darken
+  const defaultStateColor = theme.palette.grey[theme.palette.type === SCHEMES.DARK ? 300 : 700]
 
   return {
     root: ({ stateColor = defaultStateColor }) => ({
diff --git a/src/fireedge/src/client/constants/setting.js b/src/fireedge/src/client/constants/setting.js
index 8d4cbb2509..b607f46408 100644
--- a/src/fireedge/src/client/constants/setting.js
+++ b/src/fireedge/src/client/constants/setting.js
@@ -13,6 +13,9 @@
  * See the License for the specific language governing permissions and       *
  * limitations under the License.                                            *
  * ------------------------------------------------------------------------- */
+/**
+ * @enum {string} Scheme type
+ */
 export const SCHEMES = {
   SYSTEM: 'system',
   DARK: 'dark',
diff --git a/src/fireedge/src/client/icons/logo.js b/src/fireedge/src/client/icons/logo.js
index 511519afa8..8a5f69a517 100644
--- a/src/fireedge/src/client/icons/logo.js
+++ b/src/fireedge/src/client/icons/logo.js
@@ -17,9 +17,11 @@ import React, { memo } from 'react'
 import { number, string, bool, oneOfType } from 'prop-types'
 import { useTheme } from '@material-ui/core'
 
+import { SCHEMES } from 'client/constants'
+
 const Logo = memo(({ width, height, spinner, withText, viewBox, ...props }) => {
   const { palette: { type } } = useTheme()
-  const isDarkMode = type === 'dark'
+  const isDarkMode = type === SCHEMES.DARK
 
   const cloudColor = {
     child1: { from: '#bfe6f2', to: '#ffffff', static: isDarkMode ? '#ffffff' : '#bfe6f2' },