diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-select/select.html b/projects/dxc-ngx-cdk/src/lib/dxc-select/select.html
index 6aaf71a00..0c412d2cf 100644
--- a/projects/dxc-ngx-cdk/src/lib/dxc-select/select.html
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-select/select.html
@@ -8,7 +8,10 @@
See https://github.com/angular/components/issues/20694
-->
{{assistiveText}}
-
+
left 400ms cubic-bezier(0.25, 0.8, 0.25, 1),
top 400ms cubic-bezier(0.25, 0.8, 0.25, 1),
width 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
+
+ .select-required {
+ color: var(--select-required);
+ }
}
dxc-option.mat-active,
diff --git a/projects/dxc-ngx-cdk/src/lib/theme/componentTokens.ts b/projects/dxc-ngx-cdk/src/lib/theme/componentTokens.ts
index a357404a1..767817b9b 100644
--- a/projects/dxc-ngx-cdk/src/lib/theme/componentTokens.ts
+++ b/projects/dxc-ngx-cdk/src/lib/theme/componentTokens.ts
@@ -203,6 +203,7 @@ export const componentTokens = {
"--select-selectedOptionBackgroundColor": globalTokens.lightGrey,
"--select-color": globalTokens.black,
"--select-error": globalTokens.darkRed,
+ "--select-required": globalTokens.darkRed,
"--select-focusColor": globalTokens.blue,
"--select-disabledColor": globalTokens.lighterBlack,
"--select-scrollBarThumbColor": globalTokens.darkGrey,