diff --git a/src/scss/base/_colors.scss b/src/scss/base/_colors.scss
index 2fa98e8..e7fdd47 100644
--- a/src/scss/base/_colors.scss
+++ b/src/scss/base/_colors.scss
@@ -15,7 +15,7 @@
 
 // Light Background
 $lightbg__grey: #b8c1c1;
-$lightbg__accent: #ebf0fc;
+$lightbg__accent: #d8e2fc;
 $lightbg__primary: #3c6df0;
 
 // Primary Button colors
diff --git a/src/scss/base/_forms.scss b/src/scss/base/_forms.scss
index 134537d..f899e0c 100644
--- a/src/scss/base/_forms.scss
+++ b/src/scss/base/_forms.scss
@@ -126,4 +126,4 @@
 
 .checkbox-custom:focus + .checkbox-custom-label, .radio-custom:focus + .radio-custom-label {
   outline: 1px solid $lightbg__grey; /* focus style */
-}
\ No newline at end of file
+}
diff --git a/src/scss/base/_utility.scss b/src/scss/base/_utility.scss
index cedac11..8f17403 100644
--- a/src/scss/base/_utility.scss
+++ b/src/scss/base/_utility.scss
@@ -64,6 +64,10 @@
   margin-top: 0px !important;
 }
 
+.btm-border-grey {
+  border-bottom: 1px solid $lightbg__grey;
+}
+
 .transitionAll {
   transition: all .5s ease;
 }
\ No newline at end of file
diff --git a/src/scss/components/_all.scss b/src/scss/components/_all.scss
index 7fad716..d9e8d34 100644
--- a/src/scss/components/_all.scss
+++ b/src/scss/components/_all.scss
@@ -1,5 +1,4 @@
-@import "status";
 @import "systemUser";
 @import "login";
-@import "alerts";
-@import "power-ops";
\ No newline at end of file
+@import "power-ops";
+@import "uid-light";
\ No newline at end of file
diff --git a/src/scss/components/_uid-light.scss b/src/scss/components/_uid-light.scss
new file mode 100644
index 0000000..cd7a9fe
--- /dev/null
+++ b/src/scss/components/_uid-light.scss
@@ -0,0 +1,19 @@
+// UI Light
+
+#uid-switch {
+  .switch {margin-left: 1.7em;}
+  .uid-switch__label {
+    padding-bottom: 1.5em;
+  }
+  .uid-switch__label p {
+    margin: 0;
+    &:first-child {font-weight: 700;}
+  }
+  .h4 {
+    border-bottom: 1px solid $lightbg__grey;
+    margin: 2.625em 0 1.2em 0;
+    padding: 0 0 .85em;
+    font-weight: 700;
+  }
+
+}
\ No newline at end of file
diff --git a/src/scss/components/_alerts.scss b/src/scss/elements/_alerts.scss
similarity index 100%
rename from src/scss/components/_alerts.scss
rename to src/scss/elements/_alerts.scss
diff --git a/src/scss/elements/_all.scss b/src/scss/elements/_all.scss
new file mode 100644
index 0000000..2913202
--- /dev/null
+++ b/src/scss/elements/_all.scss
@@ -0,0 +1,4 @@
+
+@import "toggle-switch";
+@import "status";
+@import "alerts";
\ No newline at end of file
diff --git a/src/scss/components/_status.scss b/src/scss/elements/_status.scss
similarity index 93%
rename from src/scss/components/_status.scss
rename to src/scss/elements/_status.scss
index 0cba22f..7d9b57a 100644
--- a/src/scss/components/_status.scss
+++ b/src/scss/elements/_status.scss
@@ -29,7 +29,7 @@
 
 @mixin status-light__warn {
   @include status-light;
-  color: $darkgrey;
+  color: $status-warn;
 
 }
 
@@ -56,6 +56,6 @@
 .status-light__warn {
   color: $status-warn;
   &::before {
-    @include status-light__error;
+    @include status-light__warn;
   }
 }
\ No newline at end of file
diff --git a/src/scss/elements/_toggle-switch.scss b/src/scss/elements/_toggle-switch.scss
new file mode 100644
index 0000000..4c0faea
--- /dev/null
+++ b/src/scss/elements/_toggle-switch.scss
@@ -0,0 +1,74 @@
+@mixin marginTransition {
+  -webkit-transition: margin 0.4s, background 0.4s;
+  -moz-transition: margin 0.4s, background 0.4s;
+  -o-transition: margin 0.4s, background 0.4s;
+  transition: margin 0.4s, background 0.4s;
+}
+
+@mixin borderRadius {
+  -webkit-border-radius: 60px;
+  -moz-border-radius: 60px;
+  -ms-border-radius: 60px;
+  border-radius: 60px;
+}
+
+.toggle-switch {
+  position: absolute;
+  margin-left: -9999px;
+  visibility: hidden;
+}
+.toggle-switch + label {
+  display: block;
+  position: relative;
+  cursor: pointer;
+  outline: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+input.toggle-switch__round-flat + label {
+  padding: 2px;
+  width: 50px;
+  height: 30px;
+  background-color: $lightgrey;
+  @include borderRadius;
+  @include marginTransition;
+}
+input.toggle-switch__round-flat + label:before, input.toggle-switch__round-flat + label:after {
+  display: block;
+  position: absolute;
+  content: "";
+}
+input.toggle-switch__round-flat + label:before {
+  top: 2px;
+  left: 2px;
+  bottom: 2px;
+  right: 2px;
+  background-color: $white;
+  @include borderRadius;
+  @include marginTransition;
+}
+input.toggle-switch__round-flat + label:after {
+  top: 4px;
+  left: 4px;
+  bottom: 4px;
+  width: 20px;
+  background-color: $lightgrey;
+  -webkit-border-radius: 52px;
+  -moz-border-radius: 52px;
+  -ms-border-radius: 52px;
+  border-radius: 52px;
+  @include marginTransition;
+}
+input.toggle-switch__round-flat:checked + label {
+  background-color: $primebtn__bg;
+}
+input.toggle-switch__round-flat:checked + label:before {
+  background-color: $lightbg__accent;
+}
+input.toggle-switch__round-flat:checked + label:after {
+  margin-left: 20px;
+  background-color: $primebtn__bg;
+}
\ No newline at end of file
diff --git a/src/scss/main.scss b/src/scss/main.scss
index e0bd509..30249cf 100755
--- a/src/scss/main.scss
+++ b/src/scss/main.scss
@@ -2,6 +2,7 @@
 @import 'base/all';
 @import 'utils/all';
 @import 'layout/all';
+@import 'elements/all';
 @import 'components/all';
 @import 'vendor/all';
 
diff --git a/src/unit-id.html b/src/unit-id.html
new file mode 100644
index 0000000..ce1bbc8
--- /dev/null
+++ b/src/unit-id.html
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>openBMC</title>
+    <link rel="icon" href="favicon.ico?v=2"/>
+    <link rel="stylesheet" href="css/main.css">
+    <script src="js/vendor/vendor.min.js"></script>
+</head>
+<body>
+
+<!-- Header & Navigation includes -->
+<div id="header__wrapper"></div>
+<div id="navigation"></div>
+
+<!-- Power Operations Content -->
+<main id="uid-switch" class="content__container" role="main">
+    <div class="row column">
+        <h1>Unit ID Indicator</h1>
+    </div>
+
+    <div class="row column">
+        <h2 class="h4">Unit ID control</h2>
+    </div>
+
+    <div class="row column">
+        <div class="btm-border-grey">
+            <div class="switch inline">
+                <input id="toggle__round" class="toggle-switch toggle-switch__round-flat" type="checkbox" tabindex="0">
+                <label for="toggle__round"></label>
+            </div>
+            <div class="uid-switch__label inline">
+                <p>Unit ID indicator is <span class="uid-switch__status">off</span></p>
+                <p>Control unit indicator to identify server unit.</p>
+            </div>
+        </div>
+    </div>
+</main>
+
+</body>
+<script src="js/app.min.js"></script>
+
+<!-- FOR DEMO ONLY __ DO NOT COPY BELOW -->
+<script>
+    $('.toggle-switch').on('click', function(){
+        console.log($(this).parents('.row'));
+       $(this).parents('.row').find('.uid-switch__status').html('on');
+    });
+</script>
+</html>