diff --git a/lib/widgets/card_history_request.dart b/lib/widgets/card_history_request.dart
index 53f994e8..2c5c90fd 100644
--- a/lib/widgets/card_history_request.dart
+++ b/lib/widgets/card_history_request.dart
@@ -21,8 +21,7 @@ class HistoryRequestCard extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final Color color = Theme.of(context).colorScheme.surface;
-    final Color colorVariant =
-        Theme.of(context).colorScheme.surfaceContainerHighest.withOpacity(0.5);
+    final Color colorVariant = Theme.of(context).colorScheme.surfaceContainer;
     final Color surfaceTint = Theme.of(context).colorScheme.primary;
     return Card(
       shape: const ContinuousRectangleBorder(borderRadius: kBorderRadius12),
@@ -38,7 +37,6 @@ class HistoryRequestCard extends StatelessWidget {
         onTap: onTap,
         borderRadius: kBorderRadius6,
         hoverColor: colorVariant,
-        focusColor: colorVariant.withOpacity(0.5),
         child: Padding(
           padding: kPv6 + kPh8,
           child: SizedBox(
diff --git a/lib/widgets/card_sidebar_environment.dart b/lib/widgets/card_sidebar_environment.dart
index 413974db..f0a5d2ea 100644
--- a/lib/widgets/card_sidebar_environment.dart
+++ b/lib/widgets/card_sidebar_environment.dart
@@ -43,8 +43,7 @@ class SidebarEnvironmentCard extends StatelessWidget {
     final colorScheme = Theme.of(context).colorScheme;
     final Color color =
         isGlobal ? colorScheme.secondaryContainer : colorScheme.surface;
-    final Color colorVariant =
-        colorScheme.surfaceContainerHighest.withOpacity(0.5);
+    final Color colorVariant = colorScheme.surfaceContainer;
     final Color surfaceTint = colorScheme.primary;
     bool isSelected = selectedId == id;
     bool inEditMode = editRequestId == id;
@@ -68,7 +67,7 @@ class SidebarEnvironmentCard extends StatelessWidget {
         child: InkWell(
           borderRadius: kBorderRadius8,
           hoverColor: colorVariant,
-          focusColor: colorVariant.withOpacity(0.5),
+          focusColor: colorVariant,
           onTap: inEditMode ? null : onTap,
           // onSecondaryTap: onSecondaryTap,
           onSecondaryTapUp: (isGlobal)
diff --git a/lib/widgets/card_sidebar_history.dart b/lib/widgets/card_sidebar_history.dart
index 8ecd1f1e..36f5d5bb 100644
--- a/lib/widgets/card_sidebar_history.dart
+++ b/lib/widgets/card_sidebar_history.dart
@@ -28,8 +28,7 @@ class SidebarHistoryCard extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final Color color = Theme.of(context).colorScheme.surface;
-    final Color colorVariant =
-        Theme.of(context).colorScheme.surfaceContainerHighest.withOpacity(0.5);
+    final Color colorVariant = Theme.of(context).colorScheme.surfaceContainer;
     final model = models.first;
     final Color surfaceTint = Theme.of(context).colorScheme.primary;
     final String name = getHistoryRequestName(model);
@@ -53,7 +52,6 @@ class SidebarHistoryCard extends StatelessWidget {
           onTap: onTap,
           borderRadius: kBorderRadius8,
           hoverColor: colorVariant,
-          focusColor: colorVariant.withOpacity(0.5),
           child: Padding(
             padding: const EdgeInsets.only(
               left: 6,
diff --git a/lib/widgets/card_sidebar_request.dart b/lib/widgets/card_sidebar_request.dart
index e7826274..87dab9e4 100644
--- a/lib/widgets/card_sidebar_request.dart
+++ b/lib/widgets/card_sidebar_request.dart
@@ -45,8 +45,7 @@ class SidebarRequestCard extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final Color color = Theme.of(context).colorScheme.surface;
-    final Color colorVariant =
-        Theme.of(context).colorScheme.surfaceContainerHighest.withOpacity(0.5);
+    final Color colorVariant = Theme.of(context).colorScheme.surfaceContainer;
     final Color surfaceTint = Theme.of(context).colorScheme.primary;
     bool isSelected = selectedId == id;
     bool inEditMode = editRequestId == id;
@@ -72,7 +71,7 @@ class SidebarRequestCard extends StatelessWidget {
         child: InkWell(
           borderRadius: kBorderRadius8,
           hoverColor: colorVariant,
-          focusColor: colorVariant.withOpacity(0.5),
+          focusColor: colorVariant,
           onTap: inEditMode ? null : onTap,
           // onDoubleTap: inEditMode ? null : onDoubleTap,
           onSecondaryTapUp: (details) {
diff --git a/lib/widgets/codegen_previewer.dart b/lib/widgets/codegen_previewer.dart
index fc498513..89e1c899 100644
--- a/lib/widgets/codegen_previewer.dart
+++ b/lib/widgets/codegen_previewer.dart
@@ -118,12 +118,7 @@ class ViewCodePane extends StatelessWidget {
         ? kLightCodeTheme
         : kDarkCodeTheme;
     final textContainerdecoration = BoxDecoration(
-      color: Color.alphaBlend(
-          (Theme.of(context).brightness == Brightness.dark
-                  ? Theme.of(context).colorScheme.onPrimaryContainer
-                  : Theme.of(context).colorScheme.primaryContainer)
-              .withOpacity(kForegroundOpacity),
-          Theme.of(context).colorScheme.surface),
+      color: Theme.of(context).colorScheme.surfaceContainerLow,
       border: Border.all(
           color: Theme.of(context).colorScheme.surfaceContainerHighest),
       borderRadius: kBorderRadius8,
diff --git a/lib/widgets/dialog_history_retention.dart b/lib/widgets/dialog_history_retention.dart
index 3cec2b8c..7235391d 100644
--- a/lib/widgets/dialog_history_retention.dart
+++ b/lib/widgets/dialog_history_retention.dart
@@ -29,10 +29,7 @@ showHistoryRetentionDialog(
                 child: Text(
                   "Select the duration for which you want to retain your request history",
                   style: Theme.of(context).textTheme.bodyMedium?.copyWith(
-                        color: Theme.of(context)
-                            .colorScheme
-                            .onSurface
-                            .withOpacity(0.8),
+                        color: Theme.of(context).colorScheme.outline,
                       ),
                 ),
               ),
@@ -49,10 +46,7 @@ showHistoryRetentionDialog(
                         secondary: Icon(e.icon,
                             color: selectedRetentionPeriod == e
                                 ? Theme.of(context).colorScheme.primary
-                                : Theme.of(context)
-                                    .colorScheme
-                                    .onSurface
-                                    .withOpacity(0.6)),
+                                : Theme.of(context).colorScheme.outline),
                         value: e,
                         groupValue: selectedRetentionPeriod,
                         onChanged: (value) {
diff --git a/lib/widgets/editor.dart b/lib/widgets/editor.dart
index 516406b4..a9f96732 100644
--- a/lib/widgets/editor.dart
+++ b/lib/widgets/editor.dart
@@ -86,16 +86,12 @@ class _TextFieldEditorState extends State<TextFieldEditor> {
         decoration: InputDecoration(
           hintText: widget.hintText ?? kHintContent,
           hintStyle: TextStyle(
-            color: Theme.of(context).colorScheme.outline.withOpacity(
-                  kHintOpacity,
-                ),
+            color: Theme.of(context).colorScheme.outlineVariant,
           ),
           focusedBorder: OutlineInputBorder(
             borderRadius: kBorderRadius8,
             borderSide: BorderSide(
-              color: Theme.of(context).colorScheme.primary.withOpacity(
-                    kHintOpacity,
-                  ),
+              color: Theme.of(context).colorScheme.outlineVariant,
             ),
           ),
           enabledBorder: OutlineInputBorder(
@@ -106,12 +102,7 @@ class _TextFieldEditorState extends State<TextFieldEditor> {
           ),
           filled: true,
           hoverColor: kColorTransparent,
-          fillColor: Color.alphaBlend(
-              (Theme.of(context).brightness == Brightness.dark
-                      ? Theme.of(context).colorScheme.onPrimaryContainer
-                      : Theme.of(context).colorScheme.primaryContainer)
-                  .withOpacity(kForegroundOpacity),
-              Theme.of(context).colorScheme.surface),
+          fillColor: Theme.of(context).colorScheme.surfaceContainerLow,
         ),
       ),
     );
diff --git a/lib/widgets/field_header.dart b/lib/widgets/field_header.dart
index 90a5cd76..896fa416 100644
--- a/lib/widgets/field_header.dart
+++ b/lib/widgets/field_header.dart
@@ -80,15 +80,12 @@ class _HeaderFieldState extends State<HeaderField> {
           color: colorScheme.onSurface,
         ),
         decoration: InputDecoration(
-          hintStyle: kCodeStyle.copyWith(
-              color: colorScheme.outline.withOpacity(kHintOpacity)),
+          hintStyle: kCodeStyle.copyWith(color: colorScheme.outlineVariant),
           hintText: widget.hintText,
           contentPadding: const EdgeInsets.only(bottom: 12),
           focusedBorder: UnderlineInputBorder(
             borderSide: BorderSide(
-              color: colorScheme.primary.withOpacity(
-                kHintOpacity,
-              ),
+              color: colorScheme.outline,
             ),
           ),
           enabledBorder: UnderlineInputBorder(
diff --git a/lib/widgets/field_url.dart b/lib/widgets/field_url.dart
index a2afb524..01dd1db4 100644
--- a/lib/widgets/field_url.dart
+++ b/lib/widgets/field_url.dart
@@ -25,9 +25,7 @@ class URLField extends StatelessWidget {
       decoration: InputDecoration(
         hintText: kHintTextUrlCard,
         hintStyle: kCodeStyle.copyWith(
-          color: Theme.of(context).colorScheme.outline.withOpacity(
-                kHintOpacity,
-              ),
+          color: Theme.of(context).colorScheme.outlineVariant,
         ),
         border: InputBorder.none,
       ),
diff --git a/lib/widgets/response_widgets.dart b/lib/widgets/response_widgets.dart
index 2877c801..3dc86c42 100644
--- a/lib/widgets/response_widgets.dart
+++ b/lib/widgets/response_widgets.dart
@@ -405,14 +405,10 @@ class _BodySuccessState extends State<BodySuccess> {
         ? kLightCodeTheme
         : kDarkCodeTheme;
     final textContainerdecoration = BoxDecoration(
-      color: Color.alphaBlend(
-          (Theme.of(context).brightness == Brightness.dark
-                  ? Theme.of(context).colorScheme.onPrimaryContainer
-                  : Theme.of(context).colorScheme.primaryContainer)
-              .withOpacity(kForegroundOpacity),
-          Theme.of(context).colorScheme.surface),
+      color: Theme.of(context).colorScheme.surfaceContainerLow,
       border: Border.all(
-          color: Theme.of(context).colorScheme.surfaceContainerHighest),
+        color: Theme.of(context).colorScheme.surfaceContainerHighest,
+      ),
       borderRadius: kBorderRadius8,
     );
 
diff --git a/lib/widgets/splitview_dashboard.dart b/lib/widgets/splitview_dashboard.dart
index e8b4c1f5..c2e25ef6 100644
--- a/lib/widgets/splitview_dashboard.dart
+++ b/lib/widgets/splitview_dashboard.dart
@@ -1,4 +1,3 @@
-import 'package:apidash_design_system/apidash_design_system.dart';
 import 'package:flutter/material.dart';
 import 'package:multi_split_view/multi_split_view.dart';
 
@@ -35,10 +34,9 @@ class DashboardSplitViewState extends State<DashboardSplitView> {
       data: MultiSplitViewThemeData(
         dividerThickness: 3,
         dividerPainter: DividerPainters.background(
-          color: Theme.of(context).colorScheme.surfaceContainerHighest,
-          highlightedColor: Theme.of(context).colorScheme.outline.withOpacity(
-                kHintOpacity,
-              ),
+          color: Theme.of(context).colorScheme.surfaceContainer,
+          highlightedColor:
+              Theme.of(context).colorScheme.surfaceContainerHighest,
           animationEnabled: false,
         ),
       ),
diff --git a/lib/widgets/splitview_equal.dart b/lib/widgets/splitview_equal.dart
index 522726dc..62d76af0 100644
--- a/lib/widgets/splitview_equal.dart
+++ b/lib/widgets/splitview_equal.dart
@@ -1,4 +1,3 @@
-import 'package:apidash_design_system/apidash_design_system.dart';
 import 'package:flutter/material.dart';
 import 'package:multi_split_view/multi_split_view.dart';
 
@@ -30,10 +29,9 @@ class EqualSplitView extends StatelessWidget {
       data: MultiSplitViewThemeData(
         dividerThickness: 3,
         dividerPainter: DividerPainters.background(
-          color: Theme.of(context).colorScheme.surfaceContainerHighest,
-          highlightedColor: Theme.of(context).colorScheme.outline.withOpacity(
-                kHintOpacity,
-              ),
+          color: Theme.of(context).colorScheme.surfaceContainer,
+          highlightedColor:
+              Theme.of(context).colorScheme.surfaceContainerHighest,
           animationEnabled: false,
         ),
       ),
diff --git a/lib/widgets/splitview_history.dart b/lib/widgets/splitview_history.dart
index 7ff7348f..a7267670 100644
--- a/lib/widgets/splitview_history.dart
+++ b/lib/widgets/splitview_history.dart
@@ -1,4 +1,3 @@
-import 'package:apidash_design_system/apidash_design_system.dart';
 import 'package:flutter/material.dart';
 import 'package:multi_split_view/multi_split_view.dart';
 
@@ -35,10 +34,9 @@ class HistorySplitViewState extends State<HistorySplitView> {
       data: MultiSplitViewThemeData(
         dividerThickness: 3,
         dividerPainter: DividerPainters.background(
-          color: Theme.of(context).colorScheme.surfaceContainerHighest,
-          highlightedColor: Theme.of(context).colorScheme.outline.withOpacity(
-                kHintOpacity,
-              ),
+          color: Theme.of(context).colorScheme.surfaceContainer,
+          highlightedColor:
+              Theme.of(context).colorScheme.surfaceContainerHighest,
           animationEnabled: false,
         ),
       ),
diff --git a/lib/widgets/tabbar_segmented.dart b/lib/widgets/tabbar_segmented.dart
index 62c7576a..5def34f1 100644
--- a/lib/widgets/tabbar_segmented.dart
+++ b/lib/widgets/tabbar_segmented.dart
@@ -35,8 +35,7 @@ class SegmentedTabbar extends StatelessWidget {
             dividerColor: Colors.transparent,
             indicatorWeight: 0.0,
             indicatorSize: TabBarIndicatorSize.tab,
-            unselectedLabelColor:
-                Theme.of(context).colorScheme.onSurface.withOpacity(0.4),
+            unselectedLabelColor: Theme.of(context).colorScheme.outline,
             labelStyle: kTextStyleTab.copyWith(
               fontWeight: FontWeight.bold,
               color: Theme.of(context).colorScheme.onPrimary,
diff --git a/lib/widgets/table_request.dart b/lib/widgets/table_request.dart
index 1fda5f75..7b57ebdf 100644
--- a/lib/widgets/table_request.dart
+++ b/lib/widgets/table_request.dart
@@ -45,9 +45,7 @@ class RequestDataTable extends StatelessWidget {
       contentPadding: const EdgeInsets.only(bottom: 12),
       focusedBorder: UnderlineInputBorder(
         borderSide: BorderSide(
-          color: clrScheme.primary.withOpacity(
-            kHintOpacity,
-          ),
+          color: clrScheme.outlineVariant,
         ),
       ),
       enabledBorder: UnderlineInputBorder(
diff --git a/lib/widgets/table_request_form.dart b/lib/widgets/table_request_form.dart
index dd3f196c..b5791445 100644
--- a/lib/widgets/table_request_form.dart
+++ b/lib/widgets/table_request_form.dart
@@ -47,9 +47,7 @@ class RequestFormDataTable extends StatelessWidget {
       contentPadding: const EdgeInsets.only(bottom: 12),
       focusedBorder: UnderlineInputBorder(
         borderSide: BorderSide(
-          color: clrScheme.primary.withOpacity(
-            kHintOpacity,
-          ),
+          color: clrScheme.outlineVariant,
         ),
       ),
       enabledBorder: UnderlineInputBorder(