diff --git a/lib/utils/ui_utils.dart b/lib/utils/ui_utils.dart
index 68eaa82c..192d816b 100644
--- a/lib/utils/ui_utils.dart
+++ b/lib/utils/ui_utils.dart
@@ -21,7 +21,7 @@ Color getResponseStatusCodeColor(int? statusCode,
     }
   }
   if (brightness == Brightness.dark) {
-    col = getDarkModeColor(col);
+    col = col.toDark;
   }
   return col;
 }
@@ -38,7 +38,7 @@ Color getAPIColor(
     APIType.graphql => kColorGQL,
   };
   if (brightness == Brightness.dark) {
-    col = getDarkModeColor(col);
+    col = col.toDark;
   }
   return col;
 }
@@ -57,13 +57,6 @@ Color getHTTPMethodColor(HTTPVerb? method) {
   return col;
 }
 
-Color getDarkModeColor(Color col) {
-  return Color.alphaBlend(
-    col.withValues(alpha: kOpacityDarkModeBlend),
-    kColorWhite,
-  );
-}
-
 double? getJsonPreviewerMaxRootNodeWidth(double w) {
   if (w < 300) {
     return 150;
diff --git a/packages/apidash_design_system/lib/extensions/color_extensions.dart b/packages/apidash_design_system/lib/extensions/color_extensions.dart
new file mode 100644
index 00000000..dc34e5b8
--- /dev/null
+++ b/packages/apidash_design_system/lib/extensions/color_extensions.dart
@@ -0,0 +1,9 @@
+import 'package:flutter/material.dart';
+import '../tokens/colors.dart';
+
+extension ColorExtension on Color {
+  Color get toDark => Color.alphaBlend(
+        withValues(alpha: kOpacityDarkModeBlend),
+        kColorWhite,
+      );
+}
diff --git a/packages/apidash_design_system/lib/extensions/extensions.dart b/packages/apidash_design_system/lib/extensions/extensions.dart
index 96498f9b..bae530cd 100644
--- a/packages/apidash_design_system/lib/extensions/extensions.dart
+++ b/packages/apidash_design_system/lib/extensions/extensions.dart
@@ -1 +1,2 @@
+export 'color_extensions.dart';
 export 'context_extensions.dart';
diff --git a/test/utils/ui_utils_test.dart b/test/utils/ui_utils_test.dart
index 28b90df9..9fc4a2fa 100644
--- a/test/utils/ui_utils_test.dart
+++ b/test/utils/ui_utils_test.dart
@@ -13,8 +13,7 @@ void main() {
       expect(getResponseStatusCodeColor(statusCode1), kColorStatusCode200);
     });
 
-    Color colStatusCode1DarkModeExpected =
-        getDarkModeColor(kColorStatusCode200);
+    Color colStatusCode1DarkModeExpected = kColorStatusCode200.toDark;
     test('Testing getResponseStatusCodeColor for statusCode 200 dark mode', () {
       expect(getResponseStatusCodeColor(statusCode1, brightness: dark),
           colStatusCode1DarkModeExpected);
@@ -25,8 +24,7 @@ void main() {
       expect(getResponseStatusCodeColor(statusCode2), kColorStatusCode300);
     });
 
-    Color colStatusCode2DarkModeExpected =
-        getDarkModeColor(kColorStatusCode300);
+    Color colStatusCode2DarkModeExpected = kColorStatusCode300.toDark;
     test('Testing getResponseStatusCodeColor for statusCode 300 dark mode', () {
       expect(getResponseStatusCodeColor(statusCode2, brightness: dark),
           colStatusCode2DarkModeExpected);
@@ -37,8 +35,7 @@ void main() {
       expect(getResponseStatusCodeColor(statusCode3), kColorStatusCode400);
     });
 
-    Color colStatusCode3DarkModeExpected =
-        getDarkModeColor(kColorStatusCode400);
+    Color colStatusCode3DarkModeExpected = kColorStatusCode400.toDark;
     test('Testing getResponseStatusCodeColor for statusCode 404 dark mode', () {
       expect(getResponseStatusCodeColor(statusCode3, brightness: dark),
           colStatusCode3DarkModeExpected);
@@ -50,8 +47,7 @@ void main() {
       expect(getResponseStatusCodeColor(statusCode4), kColorStatusCode500);
     });
 
-    Color colStatusCode4DarkModeExpected =
-        getDarkModeColor(kColorStatusCode500);
+    Color colStatusCode4DarkModeExpected = kColorStatusCode500.toDark;
     test('Testing getResponseStatusCodeColor for statusCode 503 dark mode', () {
       expect(getResponseStatusCodeColor(statusCode4, brightness: dark),
           colStatusCode4DarkModeExpected);
@@ -63,8 +59,7 @@ void main() {
       expect(getResponseStatusCodeColor(statusCode5), kColorStatusCodeDefault);
     });
 
-    Color colStatusCode5DarkModeExpected =
-        getDarkModeColor(kColorStatusCodeDefault);
+    Color colStatusCode5DarkModeExpected = kColorStatusCodeDefault.toDark;
     test('Testing getResponseStatusCodeColor for statusCode 101 dark mode', () {
       expect(getResponseStatusCodeColor(statusCode5, brightness: dark),
           colStatusCode5DarkModeExpected);
@@ -73,7 +68,7 @@ void main() {
 
   group("Testing getAPIColor function", () {
     HTTPVerb methodGet = HTTPVerb.get;
-    Color colMethodGetDarkModeExpected = getDarkModeColor(kColorHttpMethodGet);
+    Color colMethodGetDarkModeExpected = kColorHttpMethodGet.toDark;
     test('Test getAPIColor for GET method dark mode', () {
       expect(
           getAPIColor(
@@ -85,8 +80,7 @@ void main() {
     });
 
     HTTPVerb methodHead = HTTPVerb.head;
-    Color colMethodHeadDarkModeExpected =
-        getDarkModeColor(kColorHttpMethodHead);
+    Color colMethodHeadDarkModeExpected = kColorHttpMethodHead.toDark;
     test('Test getHTTPMethodColor for HEAD Method dark mode', () {
       expect(
           getAPIColor(
@@ -98,8 +92,7 @@ void main() {
     });
 
     HTTPVerb methodPatch = HTTPVerb.patch;
-    Color colMethodPatchDarkModeExpected =
-        getDarkModeColor(kColorHttpMethodPatch);
+    Color colMethodPatchDarkModeExpected = kColorHttpMethodPatch.toDark;
     test('Test getHTTPMethodColor for PATCH Method dark mode', () {
       expect(
           getAPIColor(
@@ -111,7 +104,7 @@ void main() {
     });
 
     HTTPVerb methodPut = HTTPVerb.put;
-    Color colMethodPutDarkModeExpected = getDarkModeColor(kColorHttpMethodPut);
+    Color colMethodPutDarkModeExpected = kColorHttpMethodPut.toDark;
     test('Test getHTTPMethodColor for PUT Method dark mode', () {
       expect(
           getAPIColor(
@@ -123,8 +116,7 @@ void main() {
     });
 
     HTTPVerb methodPost = HTTPVerb.post;
-    Color colMethodPostDarkModeExpected =
-        getDarkModeColor(kColorHttpMethodPost);
+    Color colMethodPostDarkModeExpected = kColorHttpMethodPost.toDark;
     test('Test getHTTPMethodColor for POST Method dark mode', () {
       expect(
           getAPIColor(
@@ -136,8 +128,7 @@ void main() {
     });
 
     HTTPVerb methodDelete = HTTPVerb.delete;
-    Color colMethodDeleteDarkModeExpected =
-        getDarkModeColor(kColorHttpMethodDelete);
+    Color colMethodDeleteDarkModeExpected = kColorHttpMethodDelete.toDark;
     test('Test getHTTPMethodColor for DELETE Method dark mode', () {
       expect(
           getAPIColor(
diff --git a/test/widgets/texts_test.dart b/test/widgets/texts_test.dart
index 79107fe1..fba38d91 100644
--- a/test/widgets/texts_test.dart
+++ b/test/widgets/texts_test.dart
@@ -49,7 +49,7 @@ void main() {
     expect(find.byType(SizedBox), findsOneWidget);
     expect(find.text('DEL'), findsOneWidget);
     expect(find.text('GET'), findsNothing);
-    Color colDelDarkMode = getDarkModeColor(kColorHttpMethodDelete);
+    Color colDelDarkMode = kColorHttpMethodDelete.toDark;
     final delTextWithColor = find.byWidgetPredicate(
         (widget) => widget is Text && widget.style!.color == colDelDarkMode);
     expect(delTextWithColor, findsOneWidget);