update

echo-mobile-app/echo/src/app/lights/lights.module.ts

@@ -9,6 +9,8 @@ import { LightsPageRoutingModule } from './lights-routing.module';
 import { LightsPage } from './lights.page';
 
 import { ColorHueModule } from 'ngx-color/hue';
+import { ColorShadeModule } from 'ngx-color/shade';
+import { ColorGithubModule } from 'ngx-color/github';
 
 
 @NgModule({
@@ -17,7 +19,9 @@ import { ColorHueModule } from 'ngx-color/hue';
     FormsModule,
     IonicModule,
     LightsPageRoutingModule,
-    ColorHueModule
+    ColorHueModule,
+    ColorShadeModule,
+    ColorGithubModule
   ],
   declarations: [LightsPage]
 })

echo-mobile-app/echo/src/app/lights/lights.page.html

@@ -61,6 +61,12 @@
             </ion-col>
           </ion-row>
 
+          <ion-row>
+            <ion-col>
+              <color-shade-picker width="100%" [color]="mainBedLedColor" (onChangeComplete)="onBedLedColorChange($event)"></color-shade-picker>
+            </ion-col>
+          </ion-row>
+
         </div>
       </ion-col>
     </ion-row>