diff --git a/HueLightDJ.Blazor.Controls/Pages/LightDJ.razor b/HueLightDJ.Blazor.Controls/Pages/LightDJ.razor
index cdb4d09..8ba8147 100644
--- a/HueLightDJ.Blazor.Controls/Pages/LightDJ.razor
+++ b/HueLightDJ.Blazor.Controls/Pages/LightDJ.razor
@@ -8,8 +8,8 @@
 <MudText Typo="Typo.h3">@config?.Name</MudText>
 
 <MudPaper Class="d-flex flex-row flex-grow-1 gap-4" Elevation="0">
-  <MudText>Log msg:</MudText>
-  <MudText>@lastMsg</MudText>
+    <MudText>Log msg:</MudText>
+    <MudText>@lastMsg</MudText>
 </MudPaper>
 
 
@@ -55,9 +55,9 @@
     @foreach (var effectGroup in effectsVM.BaseEffects)
     {
         <MudPaper>
-            <MudText Typo="Typo.h6">@effectGroup.Key</MudText>
+            <MudText Typo="Typo.h6">@effectGroup.Title</MudText>
 
-            @foreach (var effect in effectGroup.Value)
+            @foreach (var effect in effectGroup.Effects)
             {
                 <MudPaper Class="d-flex flex-row flex-grow-1 gap-4" Elevation="0">
                     <MudButton Variant="Variant.Text" Color="Color.Primary" OnClick="@(() => LightDJService.StartEffect(new StartEffectRequest { TypeName = effect.TypeName, ColorHex = effect.IsRandom ? null : effect.Color}))">@effect.Name</MudButton>
@@ -75,7 +75,7 @@
             }
 
         </MudPaper>
-       <br />
+        <br />
     }
 
     <MudText Typo="Typo.h5">Short Effects</MudText>
diff --git a/HueLightDJ.Services.Interfaces/Models/EffectViewModel.cs b/HueLightDJ.Services.Interfaces/Models/EffectViewModel.cs
index 3f6b805..1bdbd09 100644
--- a/HueLightDJ.Services.Interfaces/Models/EffectViewModel.cs
+++ b/HueLightDJ.Services.Interfaces/Models/EffectViewModel.cs
@@ -9,7 +9,7 @@ namespace HueLightDJ.Services.Interfaces.Models
   [ProtoContract(ImplicitFields = ImplicitFields.AllPublic)]
   public class EffectsVM
   {
-    public Dictionary<string, List<EffectViewModel>> BaseEffects { get; set; } = new();
+    public List<EffectList> BaseEffects { get; set; } = new();
     public List<EffectViewModel> ShortEffects { get; set; } = new();
     public List<EffectViewModel> GroupEffects { get; set; } = new();
     public List<string> IteratorModes { get; set; } = new();
@@ -17,6 +17,13 @@ public class EffectsVM
 
   }
 
+  [ProtoContract(ImplicitFields = ImplicitFields.AllPublic)]
+  public class EffectList
+  {
+    public required string Title { get; set; }
+    public List<EffectViewModel> Effects { get; set; } = new();
+  }
+
   [ProtoContract(ImplicitFields = ImplicitFields.AllPublic)]
   public class EffectViewModel
   {
@@ -27,7 +34,7 @@ public class EffectViewModel
 
 
     //VueJS properties:
-    public string Color { get; set; } = default!;
+    public string? Color { get; set; }
 
     public bool IsRandom { get; set; } = true;
 
diff --git a/HueLightDJ.Services/Internal/EffectService.cs b/HueLightDJ.Services/Internal/EffectService.cs
index 2889722..e8f72c1 100644
--- a/HueLightDJ.Services/Internal/EffectService.cs
+++ b/HueLightDJ.Services/Internal/EffectService.cs
@@ -72,7 +72,7 @@ public static EffectsVM GetEffectViewModels()
 
      
 
-      Dictionary<string, List<EffectViewModel>> baseEffects = new Dictionary<string, List<EffectViewModel>>();
+      List<EffectList> baseEffects = new();
       List<EffectViewModel> shortEffects = new List<EffectViewModel>();
       List<EffectViewModel> groupEffects = new List<EffectViewModel>();
       foreach (var type in all)
@@ -96,10 +96,11 @@ public static EffectsVM GetEffectViewModels()
 
         if (hueEffectAtt.IsBaseEffect)
         {
-          if (!baseEffects.ContainsKey(hueEffectAtt.Group))
-            baseEffects.Add(hueEffectAtt.Group, new List<EffectViewModel>());
+          if (!baseEffects.Where(x => x.Title == hueEffectAtt.Group).Any())
+            baseEffects.Add(new EffectList { Title = hueEffectAtt.Group });
 
-          baseEffects[hueEffectAtt.Group].Add(effect);
+          var current = baseEffects.Where(x => x.Title == hueEffectAtt.Group).Select(x => x).Single();
+          current.Effects.Add(effect);
         }
         else
           shortEffects.Add(effect);