diff --git a/ios/AlarmApp/AlarmApp.xcodeproj/project.pbxproj b/ios/AlarmApp/AlarmApp.xcodeproj/project.pbxproj
index 59c9dad..d525652 100644
--- a/ios/AlarmApp/AlarmApp.xcodeproj/project.pbxproj
+++ b/ios/AlarmApp/AlarmApp.xcodeproj/project.pbxproj
@@ -16,6 +16,7 @@
 		3008B04B296C17FA00A05731 /* MaterialButton.swift in Sources */ = {isa = PBXBuildFile; fileRef = 3008B04A296C17FA00A05731 /* MaterialButton.swift */; };
 		3008B04D296C1A4800A05731 /* C8yAlarm.swift in Sources */ = {isa = PBXBuildFile; fileRef = 3008B04C296C1A4800A05731 /* C8yAlarm.swift */; };
 		3008B04F296C245500A05731 /* MaterialTextfield.swift in Sources */ = {isa = PBXBuildFile; fileRef = 3008B04E296C245500A05731 /* MaterialTextfield.swift */; };
+		3008B05329700CF500A05731 /* ColorScheme.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 3008B05229700CF500A05731 /* ColorScheme.xcassets */; };
 		300B2B5B27C9103B0051CDBC /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = 300B2B5A27C9103B0051CDBC /* AppDelegate.swift */; };
 		300B2B5D27C9103B0051CDBC /* SceneDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = 300B2B5C27C9103B0051CDBC /* SceneDelegate.swift */; };
 		300B2B5F27C9103C0051CDBC /* DashboardViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 300B2B5E27C9103C0051CDBC /* DashboardViewController.swift */; };
@@ -93,6 +94,7 @@
 		3008B04A296C17FA00A05731 /* MaterialButton.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MaterialButton.swift; sourceTree = "<group>"; };
 		3008B04C296C1A4800A05731 /* C8yAlarm.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = C8yAlarm.swift; sourceTree = "<group>"; };
 		3008B04E296C245500A05731 /* MaterialTextfield.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MaterialTextfield.swift; sourceTree = "<group>"; };
+		3008B05229700CF500A05731 /* ColorScheme.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = ColorScheme.xcassets; sourceTree = "<group>"; };
 		300B2B5727C9103B0051CDBC /* AlarmApp.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = AlarmApp.app; sourceTree = BUILT_PRODUCTS_DIR; };
 		300B2B5A27C9103B0051CDBC /* AppDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AppDelegate.swift; sourceTree = "<group>"; };
 		300B2B5C27C9103B0051CDBC /* SceneDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SceneDelegate.swift; sourceTree = "<group>"; };
@@ -218,6 +220,7 @@
 				3056B77A27CE896F00ED443B /* Material */,
 				309A860B27DF659F00F69ED0 /* MaterialUI */,
 				307385EB27E2798B00D05F03 /* AlarmApp.entitlements */,
+				3008B05229700CF500A05731 /* ColorScheme.xcassets */,
 				300B2B6327C910470051CDBC /* Assets.xcassets */,
 				300B2B6827C910470051CDBC /* Info.plist */,
 				300B2B6527C910470051CDBC /* LaunchScreen.storyboard */,
@@ -454,6 +457,7 @@
 				300B2B6727C910470051CDBC /* LaunchScreen.storyboard in Resources */,
 				30F6C36327D6B89300884CE8 /* SeparatorItem.xib in Resources */,
 				30CFCAE727CFF32A0061BF71 /* AuditRecordItem.xib in Resources */,
+				3008B05329700CF500A05731 /* ColorScheme.xcassets in Resources */,
 				30FBB9CA27CD417F008302D0 /* DetailsItem.xib in Resources */,
 				3056B77727CE696B00ED443B /* AlarmListItem.xib in Resources */,
 				300B2B6427C910470051CDBC /* Assets.xcassets in Resources */,
diff --git a/ios/AlarmApp/AlarmApp/Assets.xcassets/onBackground.colorset/Contents.json b/ios/AlarmApp/AlarmApp/Assets.xcassets/onBackground.colorset/Contents.json
deleted file mode 100644
index 701447a..0000000
--- a/ios/AlarmApp/AlarmApp/Assets.xcassets/onBackground.colorset/Contents.json
+++ /dev/null
@@ -1,38 +0,0 @@
-{
-  "colors" : [
-    {
-      "color" : {
-        "color-space" : "srgb",
-        "components" : {
-          "alpha" : "1.000",
-          "blue" : "0x1B",
-          "green" : "0x1B",
-          "red" : "0x1B"
-        }
-      },
-      "idiom" : "universal"
-    },
-    {
-      "appearances" : [
-        {
-          "appearance" : "luminosity",
-          "value" : "dark"
-        }
-      ],
-      "color" : {
-        "color-space" : "srgb",
-        "components" : {
-          "alpha" : "1.000",
-          "blue" : "1.000",
-          "green" : "1.000",
-          "red" : "1.000"
-        }
-      },
-      "idiom" : "universal"
-    }
-  ],
-  "info" : {
-    "author" : "xcode",
-    "version" : 1
-  }
-}
diff --git a/ios/AlarmApp/AlarmApp/Assets.xcassets/onSurface.colorset/Contents.json b/ios/AlarmApp/AlarmApp/Assets.xcassets/onSurface.colorset/Contents.json
deleted file mode 100644
index 701447a..0000000
--- a/ios/AlarmApp/AlarmApp/Assets.xcassets/onSurface.colorset/Contents.json
+++ /dev/null
@@ -1,38 +0,0 @@
-{
-  "colors" : [
-    {
-      "color" : {
-        "color-space" : "srgb",
-        "components" : {
-          "alpha" : "1.000",
-          "blue" : "0x1B",
-          "green" : "0x1B",
-          "red" : "0x1B"
-        }
-      },
-      "idiom" : "universal"
-    },
-    {
-      "appearances" : [
-        {
-          "appearance" : "luminosity",
-          "value" : "dark"
-        }
-      ],
-      "color" : {
-        "color-space" : "srgb",
-        "components" : {
-          "alpha" : "1.000",
-          "blue" : "1.000",
-          "green" : "1.000",
-          "red" : "1.000"
-        }
-      },
-      "idiom" : "universal"
-    }
-  ],
-  "info" : {
-    "author" : "xcode",
-    "version" : 1
-  }
-}
diff --git a/ios/AlarmApp/AlarmApp/Assets.xcassets/secondary.colorset/Contents.json b/ios/AlarmApp/AlarmApp/Assets.xcassets/secondary.colorset/Contents.json
deleted file mode 100644
index 4b3ab72..0000000
--- a/ios/AlarmApp/AlarmApp/Assets.xcassets/secondary.colorset/Contents.json
+++ /dev/null
@@ -1,38 +0,0 @@
-{
-  "colors" : [
-    {
-      "color" : {
-        "color-space" : "srgb",
-        "components" : {
-          "alpha" : "1.000",
-          "blue" : "0x7F",
-          "green" : "0x00",
-          "red" : "0xE0"
-        }
-      },
-      "idiom" : "universal"
-    },
-    {
-      "appearances" : [
-        {
-          "appearance" : "luminosity",
-          "value" : "dark"
-        }
-      ],
-      "color" : {
-        "color-space" : "srgb",
-        "components" : {
-          "alpha" : "1.000",
-          "blue" : "0xC6",
-          "green" : "0x91",
-          "red" : "0xF3"
-        }
-      },
-      "idiom" : "universal"
-    }
-  ],
-  "info" : {
-    "author" : "xcode",
-    "version" : 1
-  }
-}
diff --git a/ios/AlarmApp/AlarmApp/Base.lproj/Main.storyboard b/ios/AlarmApp/AlarmApp/Base.lproj/Main.storyboard
index 3d0afb9..9b7874a 100644
--- a/ios/AlarmApp/AlarmApp/Base.lproj/Main.storyboard
+++ b/ios/AlarmApp/AlarmApp/Base.lproj/Main.storyboard
@@ -62,13 +62,13 @@
                                             <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="%dashboard_subscribed_alarms_title" textAlignment="natural" lineBreakMode="tailTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="6a8-vd-5pZ" customClass="MaterialLabel" customModule="AlarmApp" customModuleProvider="target">
                                                 <rect key="frame" x="0.0" y="0.0" width="382" height="17"/>
                                                 <fontDescription key="fontDescription" style="UICTFontTextStyleHeadline"/>
-                                                <nil key="textColor"/>
+                                                <color key="textColor" name="onSurface"/>
                                                 <nil key="highlightedColor"/>
                                             </label>
                                             <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="%subscribed_alarms_filter_description" textAlignment="natural" lineBreakMode="tailTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="DRu-hU-JxC" customClass="MaterialLabel" customModule="AlarmApp" customModuleProvider="target">
                                                 <rect key="frame" x="0.0" y="21" width="382" height="13.5"/>
                                                 <fontDescription key="fontDescription" style="UICTFontTextStyleCaption1"/>
-                                                <nil key="textColor"/>
+                                                <color key="textColor" name="onSurface"/>
                                                 <nil key="highlightedColor"/>
                                             </label>
                                         </subviews>
@@ -189,7 +189,7 @@
                                     <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="%dashboard_active_alarms_title" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="OGj-eP-ls6" customClass="MaterialLabel" customModule="AlarmApp" customModuleProvider="target">
                                         <rect key="frame" x="16" y="16" width="350" height="23"/>
                                         <fontDescription key="fontDescription" style="UICTFontTextStyleTitle2"/>
-                                        <nil key="textColor"/>
+                                        <color key="textColor" name="onPrimaryContainer"/>
                                         <nil key="highlightedColor"/>
                                     </label>
                                     <stackView opaque="NO" contentMode="scaleToFill" distribution="fillEqually" alignment="center" spacing="8" translatesAutoresizingMaskIntoConstraints="NO" id="dAk-3C-y5o">
@@ -633,7 +633,7 @@
                                 </connections>
                             </containerView>
                             <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="3VN-Nh-uV5" userLabel="newCommentButton" customClass="MaterialButton" customModule="AlarmApp" customModuleProvider="target">
-                                <rect key="frame" x="138.5" y="741" width="259.5" height="56"/>
+                                <rect key="frame" x="138.5" y="790" width="259.5" height="56"/>
                                 <constraints>
                                     <constraint firstAttribute="height" constant="56" id="9Wi-cr-DBo"/>
                                     <constraint firstAttribute="width" relation="greaterThanOrEqual" constant="80" id="v09-bl-szo"/>
@@ -642,8 +642,8 @@
                                 <state key="normal" title="Button"/>
                                 <buttonConfiguration key="configuration" style="filled" title="%alarm_details_new_comment" imagePadding="16" cornerStyle="capsule">
                                     <imageReference key="image" image="plus.bubble.fill" catalog="system" symbolScale="default"/>
-                                    <color key="baseForegroundColor" name="onSecondary"/>
-                                    <color key="baseBackgroundColor" name="secondary"/>
+                                    <color key="baseForegroundColor" name="primary"/>
+                                    <color key="baseBackgroundColor" name="primaryContainer"/>
                                 </buttonConfiguration>
                                 <connections>
                                     <segue destination="lLb-fy-ICw" kind="show" identifier="toNewComment" id="gSE-Py-UP6"/>
@@ -721,7 +721,7 @@
                     <tableView key="view" clipsSubviews="YES" contentMode="scaleToFill" alwaysBounceVertical="YES" dataMode="prototypes" style="plain" separatorStyle="default" rowHeight="-1" estimatedRowHeight="-1" sectionHeaderHeight="-1" estimatedSectionHeaderHeight="-1" sectionFooterHeight="-1" estimatedSectionFooterHeight="-1" id="6at-Wb-oaf">
                         <rect key="frame" x="0.0" y="0.0" width="414" height="896"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
-                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
+                        <color key="backgroundColor" name="background"/>
                         <color key="sectionIndexBackgroundColor" name="background"/>
                         <connections>
                             <outlet property="dataSource" destination="kp8-EK-E2H" id="RkH-sm-r2Y"/>
@@ -934,7 +934,7 @@
                         <subviews>
                             <textView clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" textAlignment="natural" translatesAutoresizingMaskIntoConstraints="NO" id="LXJ-qz-wgM" customClass="JVFloatLabeledTextView">
                                 <rect key="frame" x="16" y="156" width="382" height="128"/>
-                                <color key="backgroundColor" systemColor="systemBackgroundColor"/>
+                                <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
                                 <constraints>
                                     <constraint firstAttribute="height" constant="128" id="0bO-1X-wiZ"/>
                                 </constraints>
@@ -968,7 +968,7 @@
                             </button>
                         </subviews>
                         <viewLayoutGuide key="safeArea" id="MkE-7w-377"/>
-                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
+                        <color key="backgroundColor" name="background"/>
                         <constraints>
                             <constraint firstItem="DCS-Jv-BnZ" firstAttribute="leading" relation="greaterThanOrEqual" secondItem="MkE-7w-377" secondAttribute="leading" symbolic="YES" id="4j0-QN-ssw"/>
                             <constraint firstItem="DCS-Jv-BnZ" firstAttribute="top" secondItem="LXJ-qz-wgM" secondAttribute="bottom" constant="16" id="8SK-nW-Dl1"/>
@@ -1118,13 +1118,13 @@
                                             <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="%alarms_filter_title" textAlignment="natural" lineBreakMode="tailTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="iYk-Va-PUR" customClass="MaterialLabel" customModule="AlarmApp" customModuleProvider="target">
                                                 <rect key="frame" x="0.0" y="0.0" width="382" height="17"/>
                                                 <fontDescription key="fontDescription" style="UICTFontTextStyleHeadline"/>
-                                                <nil key="textColor"/>
+                                                <color key="textColor" name="onSurface"/>
                                                 <nil key="highlightedColor"/>
                                             </label>
                                             <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="%alarms_filter_descrition" textAlignment="natural" lineBreakMode="tailTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="aSk-zk-67H" customClass="MaterialLabel" customModule="AlarmApp" customModuleProvider="target">
                                                 <rect key="frame" x="0.0" y="21" width="382" height="13.5"/>
                                                 <fontDescription key="fontDescription" style="UICTFontTextStyleCaption1"/>
-                                                <nil key="textColor"/>
+                                                <color key="textColor" name="onSurface"/>
                                                 <nil key="highlightedColor"/>
                                             </label>
                                         </subviews>
@@ -1307,7 +1307,7 @@
         </designable>
     </designables>
     <inferredMetricsTieBreakers>
-        <segue reference="TSw-36-nw0"/>
+        <segue reference="ina-48-qVJ"/>
     </inferredMetricsTieBreakers>
     <resources>
         <image name="arrow.right" catalog="system" width="128" height="98"/>
@@ -1317,28 +1317,31 @@
         <image name="plus.bubble.fill" catalog="system" width="128" height="110"/>
         <image name="splash" width="375" height="667"/>
         <namedColor name="background">
-            <color red="0.9882352941176471" green="0.9882352941176471" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+            <color red="0.98431372549019602" green="0.9882352941176471" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
         <namedColor name="onBackground">
-            <color red="0.10588235294117647" green="0.10588235294117647" blue="0.10588235294117647" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+            <color red="0.0" green="0.12156862745098039" blue="0.16470588235294117" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
         <namedColor name="onPrimary">
             <color red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
+        <namedColor name="onPrimaryContainer">
+            <color red="0.0" green="0.11372549019607843" blue="0.20784313725490197" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+        </namedColor>
         <namedColor name="onSecondary">
             <color red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
         <namedColor name="onSurface">
-            <color red="0.10588235294117647" green="0.10588235294117647" blue="0.10588235294117647" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+            <color red="0.0" green="0.12156862745098039" blue="0.16470588235294117" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
         <namedColor name="primary">
-            <color red="0.14117647058823529" green="0.38039215686274508" blue="0.62352941176470589" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+            <color red="0.0" green="0.38039215686274508" blue="0.63529411764705879" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
-        <namedColor name="secondary">
-            <color red="0.8784313725490196" green="0.0" blue="0.49803921568627452" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+        <namedColor name="primaryContainer">
+            <color red="0.81960784313725488" green="0.89411764705882357" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
         <namedColor name="surface">
-            <color red="0.9882352941176471" green="0.9882352941176471" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+            <color red="0.98039215686274506" green="0.9882352941176471" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
         <systemColor name="labelColor">
             <color white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
diff --git a/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/Contents.json b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/Contents.json
new file mode 100644
index 0000000..73c0059
--- /dev/null
+++ b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/Contents.json
@@ -0,0 +1,6 @@
+{
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}
diff --git a/ios/AlarmApp/AlarmApp/Assets.xcassets/background.colorset/Contents.json b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/background.colorset/Contents.json
similarity index 88%
rename from ios/AlarmApp/AlarmApp/Assets.xcassets/background.colorset/Contents.json
rename to ios/AlarmApp/AlarmApp/ColorScheme.xcassets/background.colorset/Contents.json
index f05c359..2dd8f81 100644
--- a/ios/AlarmApp/AlarmApp/Assets.xcassets/background.colorset/Contents.json
+++ b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/background.colorset/Contents.json
@@ -7,7 +7,7 @@
           "alpha" : "1.000",
           "blue" : "0xFF",
           "green" : "0xFC",
-          "red" : "0xFC"
+          "red" : "0xFB"
         }
       },
       "idiom" : "universal"
@@ -23,8 +23,8 @@
         "color-space" : "srgb",
         "components" : {
           "alpha" : "1.000",
-          "blue" : "0x00",
-          "green" : "0x00",
+          "blue" : "0x2A",
+          "green" : "0x1F",
           "red" : "0x00"
         }
       },
diff --git a/ios/AlarmApp/AlarmApp/Assets.xcassets/onPrimary.colorset/Contents.json b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/onBackground.colorset/Contents.json
similarity index 80%
rename from ios/AlarmApp/AlarmApp/Assets.xcassets/onPrimary.colorset/Contents.json
rename to ios/AlarmApp/AlarmApp/ColorScheme.xcassets/onBackground.colorset/Contents.json
index 2960d72..fc1c9a4 100644
--- a/ios/AlarmApp/AlarmApp/Assets.xcassets/onPrimary.colorset/Contents.json
+++ b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/onBackground.colorset/Contents.json
@@ -5,9 +5,9 @@
         "color-space" : "srgb",
         "components" : {
           "alpha" : "1.000",
-          "blue" : "1.000",
-          "green" : "1.000",
-          "red" : "1.000"
+          "blue" : "0x2A",
+          "green" : "0x1F",
+          "red" : "0x00"
         }
       },
       "idiom" : "universal"
@@ -23,9 +23,9 @@
         "color-space" : "srgb",
         "components" : {
           "alpha" : "1.000",
-          "blue" : "0x00",
-          "green" : "0x00",
-          "red" : "0x00"
+          "blue" : "0xFF",
+          "green" : "0xE9",
+          "red" : "0xBF"
         }
       },
       "idiom" : "universal"
diff --git a/ios/AlarmApp/AlarmApp/Assets.xcassets/onSecondary.colorset/Contents.json b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/onPrimary.colorset/Contents.json
similarity index 80%
rename from ios/AlarmApp/AlarmApp/Assets.xcassets/onSecondary.colorset/Contents.json
rename to ios/AlarmApp/AlarmApp/ColorScheme.xcassets/onPrimary.colorset/Contents.json
index 2960d72..7815368 100644
--- a/ios/AlarmApp/AlarmApp/Assets.xcassets/onSecondary.colorset/Contents.json
+++ b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/onPrimary.colorset/Contents.json
@@ -5,9 +5,9 @@
         "color-space" : "srgb",
         "components" : {
           "alpha" : "1.000",
-          "blue" : "1.000",
-          "green" : "1.000",
-          "red" : "1.000"
+          "blue" : "0xFF",
+          "green" : "0xFF",
+          "red" : "0xFF"
         }
       },
       "idiom" : "universal"
@@ -23,8 +23,8 @@
         "color-space" : "srgb",
         "components" : {
           "alpha" : "1.000",
-          "blue" : "0x00",
-          "green" : "0x00",
+          "blue" : "0x57",
+          "green" : "0x32",
           "red" : "0x00"
         }
       },
diff --git a/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/onPrimaryContainer.colorset/Contents.json b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/onPrimaryContainer.colorset/Contents.json
new file mode 100644
index 0000000..329bc02
--- /dev/null
+++ b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/onPrimaryContainer.colorset/Contents.json
@@ -0,0 +1,38 @@
+{
+  "colors" : [
+    {
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "1.000",
+          "blue" : "0x35",
+          "green" : "0x1D",
+          "red" : "0x00"
+        }
+      },
+      "idiom" : "universal"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "1.000",
+          "blue" : "0xFF",
+          "green" : "0xE4",
+          "red" : "0xD1"
+        }
+      },
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}
diff --git a/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/onSurface.colorset/Contents.json b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/onSurface.colorset/Contents.json
new file mode 100644
index 0000000..fc1c9a4
--- /dev/null
+++ b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/onSurface.colorset/Contents.json
@@ -0,0 +1,38 @@
+{
+  "colors" : [
+    {
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "1.000",
+          "blue" : "0x2A",
+          "green" : "0x1F",
+          "red" : "0x00"
+        }
+      },
+      "idiom" : "universal"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "1.000",
+          "blue" : "0xFF",
+          "green" : "0xE9",
+          "red" : "0xBF"
+        }
+      },
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}
diff --git a/ios/AlarmApp/AlarmApp/Assets.xcassets/primary.colorset/Contents.json b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/primary.colorset/Contents.json
similarity index 80%
rename from ios/AlarmApp/AlarmApp/Assets.xcassets/primary.colorset/Contents.json
rename to ios/AlarmApp/AlarmApp/ColorScheme.xcassets/primary.colorset/Contents.json
index d87b97f..fa83d8e 100644
--- a/ios/AlarmApp/AlarmApp/Assets.xcassets/primary.colorset/Contents.json
+++ b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/primary.colorset/Contents.json
@@ -5,9 +5,9 @@
         "color-space" : "srgb",
         "components" : {
           "alpha" : "1.000",
-          "blue" : "0x9F",
+          "blue" : "0xA2",
           "green" : "0x61",
-          "red" : "0x24"
+          "red" : "0x00"
         }
       },
       "idiom" : "universal"
@@ -23,9 +23,9 @@
         "color-space" : "srgb",
         "components" : {
           "alpha" : "1.000",
-          "blue" : "0xFC",
-          "green" : "0xD4",
-          "red" : "0x83"
+          "blue" : "0xFF",
+          "green" : "0xCA",
+          "red" : "0x9D"
         }
       },
       "idiom" : "universal"
diff --git a/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/primaryContainer.colorset/Contents.json b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/primaryContainer.colorset/Contents.json
new file mode 100644
index 0000000..aaf8ea1
--- /dev/null
+++ b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/primaryContainer.colorset/Contents.json
@@ -0,0 +1,38 @@
+{
+  "colors" : [
+    {
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "1.000",
+          "blue" : "0xFF",
+          "green" : "0xE4",
+          "red" : "0xD1"
+        }
+      },
+      "idiom" : "universal"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "1.000",
+          "blue" : "0x7C",
+          "green" : "0x49",
+          "red" : "0x00"
+        }
+      },
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}
diff --git a/ios/AlarmApp/AlarmApp/Assets.xcassets/surface.colorset/Contents.json b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/surface.colorset/Contents.json
similarity index 84%
rename from ios/AlarmApp/AlarmApp/Assets.xcassets/surface.colorset/Contents.json
rename to ios/AlarmApp/AlarmApp/ColorScheme.xcassets/surface.colorset/Contents.json
index f21d542..17db84c 100644
--- a/ios/AlarmApp/AlarmApp/Assets.xcassets/surface.colorset/Contents.json
+++ b/ios/AlarmApp/AlarmApp/ColorScheme.xcassets/surface.colorset/Contents.json
@@ -7,7 +7,7 @@
           "alpha" : "1.000",
           "blue" : "0xFF",
           "green" : "0xFC",
-          "red" : "0xFC"
+          "red" : "0xFA"
         }
       },
       "idiom" : "universal"
@@ -23,9 +23,9 @@
         "color-space" : "srgb",
         "components" : {
           "alpha" : "1.000",
-          "blue" : "0x12",
-          "green" : "0x12",
-          "red" : "0x12"
+          "blue" : "0x2A",
+          "green" : "0x1F",
+          "red" : "0x00"
         }
       },
       "idiom" : "universal"
diff --git a/ios/AlarmApp/AlarmApp/Extensions/UITableViewHeaderFooterView.swift b/ios/AlarmApp/AlarmApp/Extensions/UITableViewHeaderFooterView.swift
index 71e5e9c..9cbe60f 100644
--- a/ios/AlarmApp/AlarmApp/Extensions/UITableViewHeaderFooterView.swift
+++ b/ios/AlarmApp/AlarmApp/Extensions/UITableViewHeaderFooterView.swift
@@ -19,9 +19,7 @@ import UIKit
 
 extension UITableViewHeaderFooterView {
     func setBackgroundConfiguration() {
-        let theme = M3Theme()
-        let color = theme.elevationOverlayColor(elevation: 2)
-        setBackgroundConfiguration(with: color)
+        setBackgroundConfiguration(with: M3Theme().elevationOverlayColor(elevation: 1))
     }
 
     func setBackgroundConfiguration(with color: UIColor) {
diff --git a/ios/AlarmApp/AlarmApp/Extensions/UIViewController.swift b/ios/AlarmApp/AlarmApp/Extensions/UIViewController.swift
index 29d4d02..2dfa478 100644
--- a/ios/AlarmApp/AlarmApp/Extensions/UIViewController.swift
+++ b/ios/AlarmApp/AlarmApp/Extensions/UIViewController.swift
@@ -22,8 +22,7 @@ extension UIViewController {
         detents: [UISheetPresentationController.Detent] = [.medium()],
         isModal: Bool = false
     ) {
-        let m3Theme = M3Theme()
-        bottomSheet.view.backgroundColor = m3Theme.elevationOverlayColor(elevation: 2)
+        bottomSheet.view.backgroundColor = .surface
         let navigationController = UINavigationController(rootViewController: bottomSheet)
         navigationController.modalPresentationStyle = .pageSheet
         navigationController.navigationBar.isHidden = true
diff --git a/ios/AlarmApp/AlarmApp/Material/Colors.swift b/ios/AlarmApp/AlarmApp/Material/Colors.swift
index f5f1683..b26287c 100644
--- a/ios/AlarmApp/AlarmApp/Material/Colors.swift
+++ b/ios/AlarmApp/AlarmApp/Material/Colors.swift
@@ -32,6 +32,8 @@ extension UIColor {
 
     static var primary = UIColor(named: "primary") ?? .black
     static var onPrimary = UIColor(named: "onPrimary") ?? .black
+    static var primaryContainer = UIColor(named: "primaryContainer") ?? .black
+    static var onPrimaryContainer = UIColor(named: "onPrimaryContainer") ?? .black
     static var secondary = UIColor(named: "secondary") ?? .black
     static var onSecondary = UIColor(named: "onSecondary") ?? .black
     static var background = UIColor(named: "background") ?? .black
diff --git a/ios/AlarmApp/AlarmApp/Material/M3Theme.swift b/ios/AlarmApp/AlarmApp/Material/M3Theme.swift
index 7509438..8ca223c 100644
--- a/ios/AlarmApp/AlarmApp/Material/M3Theme.swift
+++ b/ios/AlarmApp/AlarmApp/Material/M3Theme.swift
@@ -68,7 +68,11 @@ extension M3Theme {
 extension M3Theme {
     static func applyTheme(card: MaterialCardView) {
         let theme = M3Theme()
-        card.layer.backgroundColor = theme.elevationOverlayColor(elevation: 1).cgColor
+        if let backgroundColor = card.cardBackgroundColor {
+            card.layer.backgroundColor = backgroundColor.cgColor
+        } else {
+            card.layer.backgroundColor = theme.elevationOverlayColor(elevation: 1).cgColor
+        }
     }
 }
 
diff --git a/ios/AlarmApp/AlarmApp/MaterialUI/MaterialCardView.swift b/ios/AlarmApp/AlarmApp/MaterialUI/MaterialCardView.swift
index fb45e60..1e142f6 100644
--- a/ios/AlarmApp/AlarmApp/MaterialUI/MaterialCardView.swift
+++ b/ios/AlarmApp/AlarmApp/MaterialUI/MaterialCardView.swift
@@ -45,11 +45,6 @@ class MaterialCardView: UIView {
         layer.rasterizationScale = UIScreen.main.scale
         let shadowPath = UIBezierPath(roundedRect: bounds, cornerRadius: cornerRedious)
         layer.shadowPath = shadowPath.cgPath
-
-        if let backgroundColor = self.cardBackgroundColor {
-            self.layer.backgroundColor = backgroundColor.cgColor
-        } else {
-            M3Theme.applyTheme(card: self)
-        }
+        M3Theme.applyTheme(card: self)
     }
 }
diff --git a/ios/AlarmApp/AlarmApp/MaterialUI/MaterialLabel.swift b/ios/AlarmApp/AlarmApp/MaterialUI/MaterialLabel.swift
index 8439f0b..b419eda 100644
--- a/ios/AlarmApp/AlarmApp/MaterialUI/MaterialLabel.swift
+++ b/ios/AlarmApp/AlarmApp/MaterialUI/MaterialLabel.swift
@@ -61,7 +61,6 @@ class MaterialLabel: UILabel {
     }
 
     private func commonInit() {
-        self.textColor = .onBackground
         self.alpha = UIFont.TextEmphasis.full.rawValue
     }
 }
diff --git a/ios/AlarmApp/AlarmApp/Views/AlarmCountItem.xib b/ios/AlarmApp/AlarmApp/Views/AlarmCountItem.xib
index 9555322..6e0598b 100644
--- a/ios/AlarmApp/AlarmApp/Views/AlarmCountItem.xib
+++ b/ios/AlarmApp/AlarmApp/Views/AlarmCountItem.xib
@@ -1,8 +1,9 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="17506" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" colorMatched="YES">
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="20037" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" colorMatched="YES">
     <device id="retina6_1" orientation="portrait" appearance="light"/>
     <dependencies>
-        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="17505"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="20020"/>
+        <capability name="Named colors" minToolsVersion="9.0"/>
         <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
     </dependencies>
     <objects>
@@ -18,15 +19,15 @@
             <autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
             <subviews>
                 <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" text="" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="waO-S3-atc" userLabel="titleLabel" customClass="MaterialLabel" customModule="AlarmApp" customModuleProvider="target">
-                    <rect key="frame" x="0.0" y="0.0" width="519" height="59.5"/>
+                    <rect key="frame" x="0.0" y="0.0" width="519" height="63"/>
                     <fontDescription key="fontDescription" style="UICTFontTextStyleCaption1"/>
-                    <nil key="textColor"/>
+                    <color key="textColor" name="onPrimaryContainer"/>
                     <nil key="highlightedColor"/>
                 </label>
                 <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="0" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="yth-kQ-TuW" userLabel="countLabel" customClass="MaterialLabel" customModule="AlarmApp" customModuleProvider="target">
-                    <rect key="frame" x="0.0" y="59.5" width="519" height="26.5"/>
+                    <rect key="frame" x="0.0" y="63" width="519" height="23"/>
                     <fontDescription key="fontDescription" style="UICTFontTextStyleTitle2"/>
-                    <nil key="textColor"/>
+                    <color key="textColor" name="onPrimaryContainer"/>
                     <nil key="highlightedColor"/>
                 </label>
             </subviews>
@@ -46,7 +47,12 @@
     <designables>
         <designable name="waO-S3-atc"/>
         <designable name="yth-kQ-TuW">
-            <size key="intrinsicContentSize" width="13.5" height="26.5"/>
+            <size key="intrinsicContentSize" width="11.5" height="23"/>
         </designable>
     </designables>
+    <resources>
+        <namedColor name="onPrimaryContainer">
+            <color red="0.0" green="0.11372549019607843" blue="0.20784313725490197" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+        </namedColor>
+    </resources>
 </document>
diff --git a/ios/AlarmApp/AlarmApp/Views/AlarmListItem.swift b/ios/AlarmApp/AlarmApp/Views/AlarmListItem.swift
index 63b807e..6b68c4f 100644
--- a/ios/AlarmApp/AlarmApp/Views/AlarmListItem.swift
+++ b/ios/AlarmApp/AlarmApp/Views/AlarmListItem.swift
@@ -37,7 +37,7 @@ class AlarmListItem: UITableViewCell {
 
     override func layoutSubviews() {
         super.layoutSubviews()
-        self.selectedBackgroundView?.backgroundColor = UIColor.background.overlay(withColor: .primary, alpha: 0.12)
+        self.selectedBackgroundView?.backgroundColor = M3Theme().elevationOverlayColor(elevation: 1)
         self.messageLabel.alpha = UIFont.TextEmphasis.full.rawValue
         self.deviceLabel.alpha = UIFont.TextEmphasis.full.rawValue
         self.timeLabel.alpha = UIFont.TextEmphasis.full.rawValue
diff --git a/ios/AlarmApp/AlarmApp/Views/AlarmListItem.xib b/ios/AlarmApp/AlarmApp/Views/AlarmListItem.xib
index 5e46618..048654e 100644
--- a/ios/AlarmApp/AlarmApp/Views/AlarmListItem.xib
+++ b/ios/AlarmApp/AlarmApp/Views/AlarmListItem.xib
@@ -118,7 +118,7 @@
     </designables>
     <resources>
         <namedColor name="onBackground">
-            <color red="0.10588235294117647" green="0.10588235294117647" blue="0.10588235294117647" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+            <color red="0.0" green="0.12156862745098039" blue="0.16470588235294117" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
     </resources>
 </document>
diff --git a/ios/AlarmApp/AlarmApp/Views/AuditRecordItem.xib b/ios/AlarmApp/AlarmApp/Views/AuditRecordItem.xib
index a6b7f32..55644e6 100644
--- a/ios/AlarmApp/AlarmApp/Views/AuditRecordItem.xib
+++ b/ios/AlarmApp/AlarmApp/Views/AuditRecordItem.xib
@@ -3,6 +3,7 @@
     <device id="retina6_1" orientation="portrait" appearance="light"/>
     <dependencies>
         <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="20020"/>
+        <capability name="Named colors" minToolsVersion="9.0"/>
         <capability name="Safe area layout guides" minToolsVersion="9.0"/>
         <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
     </dependencies>
@@ -19,13 +20,13 @@
                     <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" verticalCompressionResistancePriority="751" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" numberOfLines="2" baselineAdjustment="alignBaselines" adjustsFontForContentSizeCategory="YES" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="EYs-1D-1Qd" userLabel="valueLabel" customClass="MaterialLabel" customModule="AlarmApp" customModuleProvider="target">
                         <rect key="frame" x="16" y="16" width="341" height="32.5"/>
                         <fontDescription key="fontDescription" style="UICTFontTextStyleBody"/>
-                        <nil key="textColor"/>
+                        <color key="textColor" name="onSurface"/>
                         <nil key="highlightedColor"/>
                     </label>
                     <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="252" verticalHuggingPriority="252" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontForContentSizeCategory="YES" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="WKQ-gY-zH9" userLabel="timeLabel" customClass="MaterialLabel" customModule="AlarmApp" customModuleProvider="target">
                         <rect key="frame" x="16" y="52.5" width="341" height="13.5"/>
                         <fontDescription key="fontDescription" style="UICTFontTextStyleCaption1"/>
-                        <nil key="textColor"/>
+                        <color key="textColor" name="onSurface"/>
                         <nil key="highlightedColor"/>
                     </label>
                 </subviews>
@@ -56,4 +57,9 @@
             <size key="intrinsicContentSize" width="28.5" height="13.5"/>
         </designable>
     </designables>
+    <resources>
+        <namedColor name="onSurface">
+            <color red="0.0" green="0.12156862745098039" blue="0.16470588235294117" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+        </namedColor>
+    </resources>
 </document>
diff --git a/ios/AlarmApp/AlarmApp/Views/CommentItem.swift b/ios/AlarmApp/AlarmApp/Views/CommentItem.swift
index 76f4ab4..ab2e812 100644
--- a/ios/AlarmApp/AlarmApp/Views/CommentItem.swift
+++ b/ios/AlarmApp/AlarmApp/Views/CommentItem.swift
@@ -38,6 +38,7 @@ class CommentItem: UITableViewCell {
         self.titleLabel.font = UIFont.preferredFont(forTextStyle: .body).bold()
         self.timeLabel.alpha = UIFont.TextEmphasis.medium.rawValue
         self.valueLabel.alpha = UIFont.TextEmphasis.full.rawValue
+        setCardBackgroundColor()
     }
 
     func bind(with comment: C8yComment?) {
@@ -53,14 +54,17 @@ class CommentItem: UITableViewCell {
     override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
         super.traitCollectionDidChange(previousTraitCollection)
         if self.traitCollection.hasDifferentColorAppearance(comparedTo: previousTraitCollection) {
-            if self.traitCollection.userInterfaceStyle == .dark {
-                let theme = M3Theme()
-                self.cardView.cardBackgroundColor = theme.elevationOverlayColor(elevation: 2)
-                self.cardView.shadowRadius = 0
-            } else {
-                self.cardView.cardBackgroundColor = .background
-                self.cardView.shadowRadius = 2
-            }
+            setCardBackgroundColor()
+        }
+    }
+
+    private func setCardBackgroundColor() {
+        if self.traitCollection.userInterfaceStyle == .dark {
+            self.cardView.cardBackgroundColor = nil
+            self.cardView.shadowRadius = 0
+        } else {
+            self.cardView.cardBackgroundColor = .surface
+            self.cardView.shadowRadius = 2
         }
     }
 }
diff --git a/ios/AlarmApp/AlarmApp/Views/CommentItem.xib b/ios/AlarmApp/AlarmApp/Views/CommentItem.xib
index c428e72..bf068aa 100644
--- a/ios/AlarmApp/AlarmApp/Views/CommentItem.xib
+++ b/ios/AlarmApp/AlarmApp/Views/CommentItem.xib
@@ -22,19 +22,19 @@
                             <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" ambiguous="YES" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontForContentSizeCategory="YES" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="8vo-cJ-Ml8" userLabel="titleLabel" customClass="MaterialLabel" customModule="AlarmApp" customModuleProvider="target">
                                 <rect key="frame" x="16" y="16" width="350" height="17"/>
                                 <fontDescription key="fontDescription" style="UICTFontTextStyleBody"/>
-                                <nil key="textColor"/>
+                                <color key="textColor" name="onPrimaryContainer"/>
                                 <nil key="highlightedColor"/>
                             </label>
                             <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" ambiguous="YES" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontForContentSizeCategory="YES" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="2o0-7m-xGu" userLabel="timeLabel" customClass="MaterialLabel" customModule="AlarmApp" customModuleProvider="target">
                                 <rect key="frame" x="16" y="33" width="350" height="13.5"/>
                                 <fontDescription key="fontDescription" style="UICTFontTextStyleCaption1"/>
-                                <nil key="textColor"/>
+                                <color key="textColor" name="onPrimaryContainer"/>
                                 <nil key="highlightedColor"/>
                             </label>
                             <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" ambiguous="YES" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="De3-9z-YK4" userLabel="valueLabel" customClass="MaterialLabel" customModule="AlarmApp" customModuleProvider="target">
                                 <rect key="frame" x="16" y="55" width="350" height="16"/>
                                 <fontDescription key="fontDescription" style="UICTFontTextStyleCallout"/>
-                                <nil key="textColor"/>
+                                <color key="textColor" name="onPrimaryContainer"/>
                                 <nil key="highlightedColor"/>
                             </label>
                         </subviews>
@@ -52,9 +52,6 @@
                             <constraint firstItem="8vo-cJ-Ml8" firstAttribute="top" secondItem="9Sx-mQ-8b9" secondAttribute="top" constant="16" id="uLP-L8-m0U"/>
                         </constraints>
                         <userDefinedRuntimeAttributes>
-                            <userDefinedRuntimeAttribute type="color" keyPath="cardBackgroundColor">
-                                <color key="value" name="background"/>
-                            </userDefinedRuntimeAttribute>
                             <userDefinedRuntimeAttribute type="number" keyPath="shadowOffsetWidth">
                                 <real key="value" value="0.0"/>
                             </userDefinedRuntimeAttribute>
@@ -78,6 +75,7 @@
                     <constraint firstItem="9Sx-mQ-8b9" firstAttribute="top" secondItem="0k0-HB-gQE" secondAttribute="top" constant="2" id="xwf-jN-ype"/>
                 </constraints>
             </tableViewCellContentView>
+            <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
             <inset key="separatorInset" minX="15" minY="0.0" maxX="0.0" maxY="0.0"/>
             <connections>
                 <outlet property="cardView" destination="9Sx-mQ-8b9" id="Bl3-Nt-rYe"/>
@@ -100,8 +98,8 @@
         </designable>
     </designables>
     <resources>
-        <namedColor name="background">
-            <color red="0.9882352941176471" green="0.9882352941176471" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+        <namedColor name="onPrimaryContainer">
+            <color red="0.0" green="0.11372549019607843" blue="0.20784313725490197" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
     </resources>
 </document>
diff --git a/ios/AlarmApp/AlarmApp/Views/DecoratedLabel.swift b/ios/AlarmApp/AlarmApp/Views/DecoratedLabel.swift
index 5928ca5..f1d24ec 100644
--- a/ios/AlarmApp/AlarmApp/Views/DecoratedLabel.swift
+++ b/ios/AlarmApp/AlarmApp/Views/DecoratedLabel.swift
@@ -25,11 +25,13 @@ class DecoratedLabel: UIView {
     override init(frame: CGRect) {
         super.init(frame: frame)
         self.loadFromNib()
+        self.severityLabel.alpha = UIFont.TextEmphasis.full.rawValue
     }
 
     required init?(coder: NSCoder) {
         super.init(coder: coder)
         self.loadFromNib()
+        self.severityLabel.alpha = UIFont.TextEmphasis.full.rawValue
     }
 
     func bind(with severity: C8yAlarm.C8ySeverity?) {
@@ -37,18 +39,13 @@ class DecoratedLabel: UIView {
             self.severityImage.image = severity.icon()
             self.severityImage.tintColor = severity.tint()
             self.severityLabel.text = severity.localised()
-            self.severityLabel.textColor = .onBackground
-            self.severityLabel.alpha = UIFont.TextEmphasis.full.rawValue
         }
     }
 
     func bind(with status: C8yAlarm.C8yStatus?) {
         if let status = status {
             self.severityImage.image = status.icon()
-            self.severityImage.tintColor = UIColor.background.overlay(withColor: .onBackground, alpha: UIColor.Opacity.medium)
             self.severityLabel.text = status.localised()
-            self.severityLabel.textColor = .onBackground
-            self.severityLabel.alpha = UIFont.TextEmphasis.full.rawValue
         }
     }
 
@@ -56,15 +53,12 @@ class DecoratedLabel: UIView {
         self.severityImage.image = nil
         self.severityLabel.text = ""
         if let count = commentCount {
-            self.severityImage.tintColor = UIColor.background.overlay(withColor: .onBackground, alpha: UIColor.Opacity.medium)
             self.severityImage.image = UIImage(systemName: "message.circle.fill")
             if count > 10 {
                 self.severityLabel.text = "9+"
             } else {
                 self.severityLabel.text = String(describing: count)
             }
-            self.severityLabel.textColor = .onBackground
-            self.severityLabel.alpha = UIFont.TextEmphasis.full.rawValue
         }
     }
 }
diff --git a/ios/AlarmApp/AlarmApp/Views/DecoratedLabel.xib b/ios/AlarmApp/AlarmApp/Views/DecoratedLabel.xib
index 67b1373..2f699c0 100644
--- a/ios/AlarmApp/AlarmApp/Views/DecoratedLabel.xib
+++ b/ios/AlarmApp/AlarmApp/Views/DecoratedLabel.xib
@@ -20,6 +20,7 @@
             <subviews>
                 <imageView clipsSubviews="YES" userInteractionEnabled="NO" contentMode="scaleAspectFill" horizontalHuggingPriority="251" verticalHuggingPriority="251" translatesAutoresizingMaskIntoConstraints="NO" id="Ucy-nW-re1" userLabel="severityImage">
                     <rect key="frame" x="0.0" y="0.0" width="20" height="71"/>
+                    <color key="tintColor" name="onBackground"/>
                     <constraints>
                         <constraint firstAttribute="width" priority="999" constant="20" id="LFA-Pl-0Lx"/>
                         <constraint firstAttribute="height" priority="999" constant="20" id="v7I-RJ-V37"/>
@@ -52,7 +53,7 @@
     </designables>
     <resources>
         <namedColor name="onBackground">
-            <color red="0.10588235294117647" green="0.10588235294117647" blue="0.10588235294117647" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+            <color red="0.0" green="0.12156862745098039" blue="0.16470588235294117" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
     </resources>
 </document>
diff --git a/ios/AlarmApp/AlarmApp/Views/DetailsItem.xib b/ios/AlarmApp/AlarmApp/Views/DetailsItem.xib
index 6095ef8..ce75ec3 100644
--- a/ios/AlarmApp/AlarmApp/Views/DetailsItem.xib
+++ b/ios/AlarmApp/AlarmApp/Views/DetailsItem.xib
@@ -3,6 +3,7 @@
     <device id="retina6_1" orientation="portrait" appearance="light"/>
     <dependencies>
         <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="20020"/>
+        <capability name="Named colors" minToolsVersion="9.0"/>
         <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
     </dependencies>
     <objects>
@@ -20,7 +21,7 @@
                 <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="252" horizontalCompressionResistancePriority="760" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="6wI-jF-Jzl" userLabel="titleLabel" customClass="MaterialLabel" customModule="AlarmApp" customModuleProvider="target">
                     <rect key="frame" x="0.0" y="21.5" width="28.5" height="13.5"/>
                     <fontDescription key="fontDescription" style="UICTFontTextStyleCaption1"/>
-                    <nil key="textColor"/>
+                    <color key="textColor" name="onPrimaryContainer"/>
                     <nil key="highlightedColor"/>
                     <userDefinedRuntimeAttributes>
                         <userDefinedRuntimeAttribute type="boolean" keyPath="uppercased" value="YES"/>
@@ -29,7 +30,7 @@
                 <label opaque="NO" userInteractionEnabled="NO" contentMode="left" verticalHuggingPriority="251" text="Label" textAlignment="right" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" minimumScaleFactor="0.5" adjustsFontForContentSizeCategory="YES" translatesAutoresizingMaskIntoConstraints="NO" id="bux-Fa-u7d" userLabel="valueLabel" customClass="MaterialLabel" customModule="AlarmApp" customModuleProvider="target">
                     <rect key="frame" x="36.5" y="8" width="333.5" height="40"/>
                     <fontDescription key="fontDescription" style="UICTFontTextStyleBody"/>
-                    <nil key="textColor"/>
+                    <color key="textColor" name="onPrimaryContainer"/>
                     <nil key="highlightedColor"/>
                 </label>
             </subviews>
@@ -54,4 +55,9 @@
             <size key="intrinsicContentSize" width="35.5" height="17"/>
         </designable>
     </designables>
+    <resources>
+        <namedColor name="onPrimaryContainer">
+            <color red="0.0" green="0.11372549019607843" blue="0.20784313725490197" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+        </namedColor>
+    </resources>
 </document>
diff --git a/ios/AlarmApp/AlarmApp/Views/EmptyAlarmsItem.swift b/ios/AlarmApp/AlarmApp/Views/EmptyAlarmsItem.swift
index 3e55bf9..ca6da9d 100644
--- a/ios/AlarmApp/AlarmApp/Views/EmptyAlarmsItem.swift
+++ b/ios/AlarmApp/AlarmApp/Views/EmptyAlarmsItem.swift
@@ -40,7 +40,6 @@ class EmptyAlarmsItem: UIView {
         self.loadFromNib()
         self.titleLabel.alpha = UIFont.TextEmphasis.full.rawValue
         self.subTitleLabel.alpha = UIFont.TextEmphasis.medium.rawValue
-        self.icon.tintColor = UIColor.background.overlay(withColor: .primary, alpha: UIColor.Opacity.low)
         self.button.addTarget(self, action: #selector(onOpenFilterTapped(sender:)), for: .touchUpInside)
     }
 
diff --git a/ios/AlarmApp/AlarmApp/Views/EmptyAlarmsItem.xib b/ios/AlarmApp/AlarmApp/Views/EmptyAlarmsItem.xib
index e8e7852..6b8a8d2 100644
--- a/ios/AlarmApp/AlarmApp/Views/EmptyAlarmsItem.xib
+++ b/ios/AlarmApp/AlarmApp/Views/EmptyAlarmsItem.xib
@@ -22,7 +22,7 @@
             <subviews>
                 <imageView clipsSubviews="YES" userInteractionEnabled="NO" contentMode="scaleAspectFit" horizontalHuggingPriority="251" verticalHuggingPriority="251" preservesSuperviewLayoutMargins="YES" image="ic_empty_filter" translatesAutoresizingMaskIntoConstraints="NO" id="VPg-hy-6Gh">
                     <rect key="frame" x="175" y="341" width="64" height="64"/>
-                    <color key="tintColor" name="onBackground"/>
+                    <color key="tintColor" name="primaryContainer"/>
                     <constraints>
                         <constraint firstAttribute="height" constant="64" id="6AV-Cs-lRx"/>
                         <constraint firstAttribute="width" constant="64" id="hA0-uG-4TL"/>
@@ -78,13 +78,16 @@
     <resources>
         <image name="ic_empty_filter" width="76" height="91"/>
         <namedColor name="background">
-            <color red="0.9882352941176471" green="0.9882352941176471" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+            <color red="0.98431372549019602" green="0.9882352941176471" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
         <namedColor name="onBackground">
-            <color red="0.10588235294117647" green="0.10588235294117647" blue="0.10588235294117647" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+            <color red="0.0" green="0.12156862745098039" blue="0.16470588235294117" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
         <namedColor name="primary">
             <color red="0.14117647058823529" green="0.38039215686274508" blue="0.62352941176470589" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
+        <namedColor name="primaryContainer">
+            <color red="0.81960784313725488" green="0.89411764705882357" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+        </namedColor>
     </resources>
 </document>
diff --git a/ios/AlarmApp/AlarmApp/Views/EmptyCommentsItem.swift b/ios/AlarmApp/AlarmApp/Views/EmptyCommentsItem.swift
index be35a94..42a85c2 100644
--- a/ios/AlarmApp/AlarmApp/Views/EmptyCommentsItem.swift
+++ b/ios/AlarmApp/AlarmApp/Views/EmptyCommentsItem.swift
@@ -35,6 +35,5 @@ class EmptyCommentsItem: UIView {
     private func commonInit() {
         self.loadFromNib()
         self.titleLabel.alpha = UIFont.TextEmphasis.medium.rawValue
-        self.titleImage.tintColor = UIColor.background.overlay(withColor: .primary, alpha: UIColor.Opacity.low)
     }
 }
diff --git a/ios/AlarmApp/AlarmApp/Views/EmptyCommentsItem.xib b/ios/AlarmApp/AlarmApp/Views/EmptyCommentsItem.xib
index 2a2496d..0d93103 100644
--- a/ios/AlarmApp/AlarmApp/Views/EmptyCommentsItem.xib
+++ b/ios/AlarmApp/AlarmApp/Views/EmptyCommentsItem.xib
@@ -19,7 +19,7 @@
             <subviews>
                 <imageView clipsSubviews="YES" userInteractionEnabled="NO" contentMode="scaleAspectFit" horizontalHuggingPriority="251" verticalHuggingPriority="251" image="bubble.left.and.bubble.right.fill" catalog="system" translatesAutoresizingMaskIntoConstraints="NO" id="Zaz-oe-33S" userLabel="titleImage">
                     <rect key="frame" x="175" y="47.5" width="64" height="65"/>
-                    <color key="tintColor" name="onBackground"/>
+                    <color key="tintColor" name="primaryContainer"/>
                     <constraints>
                         <constraint firstAttribute="height" constant="64" id="dJg-mz-ThS"/>
                         <constraint firstAttribute="width" constant="64" id="ku3-Gi-mDv"/>
@@ -52,10 +52,13 @@
     <resources>
         <image name="bubble.left.and.bubble.right.fill" catalog="system" width="128" height="97"/>
         <namedColor name="background">
-            <color red="0.9882352941176471" green="0.9882352941176471" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+            <color red="0.98039215686274506" green="0.9882352941176471" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
         <namedColor name="onBackground">
-            <color red="0.10588235294117647" green="0.10588235294117647" blue="0.10588235294117647" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+            <color red="0.0" green="0.12156862745098039" blue="0.16470588235294117" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+        </namedColor>
+        <namedColor name="primaryContainer">
+            <color red="0.81960784313725488" green="0.89411764705882357" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
         </namedColor>
     </resources>
 </document>
diff --git a/ios/AlarmApp/AlarmApp/Views/SeparatorItem.xib b/ios/AlarmApp/AlarmApp/Views/SeparatorItem.xib
index 19156c2..d64dddc 100644
--- a/ios/AlarmApp/AlarmApp/Views/SeparatorItem.xib
+++ b/ios/AlarmApp/AlarmApp/Views/SeparatorItem.xib
@@ -3,6 +3,7 @@
     <device id="retina6_1" orientation="portrait" appearance="light"/>
     <dependencies>
         <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="20020"/>
+        <capability name="Named colors" minToolsVersion="9.0"/>
         <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
     </dependencies>
     <objects>
@@ -18,7 +19,7 @@
                 <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontForContentSizeCategory="YES" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="93d-Ez-er8" userLabel="titleLabel" customClass="MaterialLabel" customModule="AlarmApp" customModuleProvider="target">
                     <rect key="frame" x="16" y="8" width="429" height="56"/>
                     <fontDescription key="fontDescription" style="UICTFontTextStyleSubhead"/>
-                    <nil key="textColor"/>
+                    <color key="textColor" name="onBackground"/>
                     <nil key="highlightedColor"/>
                     <userDefinedRuntimeAttributes>
                         <userDefinedRuntimeAttribute type="boolean" keyPath="uppercased" value="YES"/>
@@ -42,4 +43,9 @@
             <size key="intrinsicContentSize" width="31" height="14.5"/>
         </designable>
     </designables>
+    <resources>
+        <namedColor name="onBackground">
+            <color red="0.0" green="0.12156862745098039" blue="0.16470588235294117" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+        </namedColor>
+    </resources>
 </document>