diff --git a/.storybook/image-snapshots/expected/components_Datatable_internalComponents_ControlsModule_With Open Filtering.png b/.storybook/image-snapshots/expected/components_Datatable_internalComponents_ControlsModule_With Open Filtering.png
index f1a7af384..ba38c8631 100644
Binary files a/.storybook/image-snapshots/expected/components_Datatable_internalComponents_ControlsModule_With Open Filtering.png and b/.storybook/image-snapshots/expected/components_Datatable_internalComponents_ControlsModule_With Open Filtering.png differ
diff --git a/.storybook/image-snapshots/expected/components_Datatable_internalComponents_Datatable_With Open And Applied Filtering.png b/.storybook/image-snapshots/expected/components_Datatable_internalComponents_Datatable_With Open And Applied Filtering.png
index a01f62899..fdaf3ed11 100644
Binary files a/.storybook/image-snapshots/expected/components_Datatable_internalComponents_Datatable_With Open And Applied Filtering.png and b/.storybook/image-snapshots/expected/components_Datatable_internalComponents_Datatable_With Open And Applied Filtering.png differ
diff --git a/.storybook/image-snapshots/expected/components_Datatable_internalComponents_Datatable_With Open Filtering.png b/.storybook/image-snapshots/expected/components_Datatable_internalComponents_Datatable_With Open Filtering.png
index 3073d08a7..8732757ee 100644
Binary files a/.storybook/image-snapshots/expected/components_Datatable_internalComponents_Datatable_With Open Filtering.png and b/.storybook/image-snapshots/expected/components_Datatable_internalComponents_Datatable_With Open Filtering.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_Default.png b/.storybook/image-snapshots/expected/components_Filters_Default.png
index e69adabb7..e24d42aba 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_Default.png and b/.storybook/image-snapshots/expected/components_Filters_Default.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_Fetching Results.png b/.storybook/image-snapshots/expected/components_Filters_Fetching Results.png
index 40d0081bb..531e0d6b5 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_Fetching Results.png and b/.storybook/image-snapshots/expected/components_Filters_Fetching Results.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_Unapplied Filters.png b/.storybook/image-snapshots/expected/components_Filters_Unapplied Filters.png
index 529bb2be6..264b9eded 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_Unapplied Filters.png and b/.storybook/image-snapshots/expected/components_Filters_Unapplied Filters.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_With Close Button.png b/.storybook/image-snapshots/expected/components_Filters_With Close Button.png
index 69dc4d96f..5dba58ca7 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_With Close Button.png and b/.storybook/image-snapshots/expected/components_Filters_With Close Button.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_With Fixed Operator.png b/.storybook/image-snapshots/expected/components_Filters_With Fixed Operator.png
index 73f5f0fe2..3097bc32a 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_With Fixed Operator.png and b/.storybook/image-snapshots/expected/components_Filters_With Fixed Operator.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_With State.png b/.storybook/image-snapshots/expected/components_Filters_With State.png
index f6c4e2e33..53f54d0ae 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_With State.png and b/.storybook/image-snapshots/expected/components_Filters_With State.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_Without Apply Button.png b/.storybook/image-snapshots/expected/components_Filters_Without Apply Button.png
index 387842f76..5c55516f2 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_Without Apply Button.png and b/.storybook/image-snapshots/expected/components_Filters_Without Apply Button.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_Count_Count Placeholder Units.png b/.storybook/image-snapshots/expected/components_Filters_components_Count_Count Placeholder Units.png
index 77b52024c..5ac79080e 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_Count_Count Placeholder Units.png and b/.storybook/image-snapshots/expected/components_Filters_components_Count_Count Placeholder Units.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_Count_Count Validation.png b/.storybook/image-snapshots/expected/components_Filters_components_Count_Count Validation.png
index 6d46abc2b..0c094aaa8 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_Count_Count Validation.png and b/.storybook/image-snapshots/expected/components_Filters_components_Count_Count Validation.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_Count_Count.png b/.storybook/image-snapshots/expected/components_Filters_components_Count_Count.png
index 6d46abc2b..0c094aaa8 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_Count_Count.png and b/.storybook/image-snapshots/expected/components_Filters_components_Count_Count.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_DateRangePicker_Date Range Placeholder Units.png b/.storybook/image-snapshots/expected/components_Filters_components_DateRangePicker_Date Range Placeholder Units.png
index db47b8614..cb3b1a123 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_DateRangePicker_Date Range Placeholder Units.png and b/.storybook/image-snapshots/expected/components_Filters_components_DateRangePicker_Date Range Placeholder Units.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_DateRangePicker_Date Range Validation.png b/.storybook/image-snapshots/expected/components_Filters_components_DateRangePicker_Date Range Validation.png
index 755eb0582..1215fe36b 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_DateRangePicker_Date Range Validation.png and b/.storybook/image-snapshots/expected/components_Filters_components_DateRangePicker_Date Range Validation.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_DateRangePicker_Date Range.png b/.storybook/image-snapshots/expected/components_Filters_components_DateRangePicker_Date Range.png
index 755eb0582..1215fe36b 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_DateRangePicker_Date Range.png and b/.storybook/image-snapshots/expected/components_Filters_components_DateRangePicker_Date Range.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_Input_External Validation Domain.png b/.storybook/image-snapshots/expected/components_Filters_components_Input_External Validation Domain.png
index 268a5f739..0ecc418e2 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_Input_External Validation Domain.png and b/.storybook/image-snapshots/expected/components_Filters_components_Input_External Validation Domain.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_Input_External Validation Ips.png b/.storybook/image-snapshots/expected/components_Filters_components_Input_External Validation Ips.png
index 196d6f8b6..2ef10bfe0 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_Input_External Validation Ips.png and b/.storybook/image-snapshots/expected/components_Filters_components_Input_External Validation Ips.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_Input_Input Placeholder Units.png b/.storybook/image-snapshots/expected/components_Filters_components_Input_Input Placeholder Units.png
index d44fe1180..c555f4960 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_Input_Input Placeholder Units.png and b/.storybook/image-snapshots/expected/components_Filters_components_Input_Input Placeholder Units.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_Input_Input Validation Max Length.png b/.storybook/image-snapshots/expected/components_Filters_components_Input_Input Validation Max Length.png
index 15cca1b4e..17c949b44 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_Input_Input Validation Max Length.png and b/.storybook/image-snapshots/expected/components_Filters_components_Input_Input Validation Max Length.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_Input_Input.png b/.storybook/image-snapshots/expected/components_Filters_components_Input_Input.png
index 15cca1b4e..17c949b44 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_Input_Input.png and b/.storybook/image-snapshots/expected/components_Filters_components_Input_Input.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_Integer_Integer Placeholder Units.png b/.storybook/image-snapshots/expected/components_Filters_components_Integer_Integer Placeholder Units.png
index d44fe1180..c555f4960 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_Integer_Integer Placeholder Units.png and b/.storybook/image-snapshots/expected/components_Filters_components_Integer_Integer Placeholder Units.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_Integer_Integer Validation.png b/.storybook/image-snapshots/expected/components_Filters_components_Integer_Integer Validation.png
index 247aabcb8..325d970e7 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_Integer_Integer Validation.png and b/.storybook/image-snapshots/expected/components_Filters_components_Integer_Integer Validation.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_Integer_Playground.png b/.storybook/image-snapshots/expected/components_Filters_components_Integer_Playground.png
index fc65ba1d7..657311d6c 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_Integer_Playground.png and b/.storybook/image-snapshots/expected/components_Filters_components_Integer_Playground.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_Number_Number Placeholder Units.png b/.storybook/image-snapshots/expected/components_Filters_components_Number_Number Placeholder Units.png
index 77b52024c..5ac79080e 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_Number_Number Placeholder Units.png and b/.storybook/image-snapshots/expected/components_Filters_components_Number_Number Placeholder Units.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_Number_Number Validation.png b/.storybook/image-snapshots/expected/components_Filters_components_Number_Number Validation.png
index dba1acbe2..31e1711e4 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_Number_Number Validation.png and b/.storybook/image-snapshots/expected/components_Filters_components_Number_Number Validation.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_Number_Playground.png b/.storybook/image-snapshots/expected/components_Filters_components_Number_Playground.png
index 9e743de62..2027b6b3c 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_Number_Playground.png and b/.storybook/image-snapshots/expected/components_Filters_components_Number_Playground.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_SingleDatePicker_Playground.png b/.storybook/image-snapshots/expected/components_Filters_components_SingleDatePicker_Playground.png
index 5c795b49c..b63c0876f 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_SingleDatePicker_Playground.png and b/.storybook/image-snapshots/expected/components_Filters_components_SingleDatePicker_Playground.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_SingleDatePicker_Single Date Placeholder Units.png b/.storybook/image-snapshots/expected/components_Filters_components_SingleDatePicker_Single Date Placeholder Units.png
index 265b2f738..7cb1bf8a8 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_SingleDatePicker_Single Date Placeholder Units.png and b/.storybook/image-snapshots/expected/components_Filters_components_SingleDatePicker_Single Date Placeholder Units.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_SingleDatePicker_Single Date.png b/.storybook/image-snapshots/expected/components_Filters_components_SingleDatePicker_Single Date.png
index 045555e92..7084a179a 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_SingleDatePicker_Single Date.png and b/.storybook/image-snapshots/expected/components_Filters_components_SingleDatePicker_Single Date.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Playground.png b/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Playground.png
index 4a9427db9..48a471572 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Playground.png and b/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Playground.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Tags Input Placeholder Units.png b/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Tags Input Placeholder Units.png
index 006ab97c8..c84b4f23e 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Tags Input Placeholder Units.png and b/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Tags Input Placeholder Units.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Tags Input Validation.png b/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Tags Input Validation.png
index e30e13318..5b09ba8cb 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Tags Input Validation.png and b/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Tags Input Validation.png differ
diff --git a/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Tags Input.png b/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Tags Input.png
index 031b278e7..db1d11738 100644
Binary files a/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Tags Input.png and b/.storybook/image-snapshots/expected/components_Filters_components_TagsInput_Tags Input.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_InputGroup_Input Group With Search Bar.png b/.storybook/image-snapshots/expected/components_forms_InputGroup_Input Group With Search Bar.png
index 1002a1fa8..cecf6ce49 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_InputGroup_Input Group With Search Bar.png and b/.storybook/image-snapshots/expected/components_forms_InputGroup_Input Group With Search Bar.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_InputGroup_Nested Input Group.png b/.storybook/image-snapshots/expected/components_forms_InputGroup_Nested Input Group.png
index 442c340f3..816f435d4 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_InputGroup_Nested Input Group.png and b/.storybook/image-snapshots/expected/components_forms_InputGroup_Nested Input Group.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_InputGroup_Select Input Group.png b/.storybook/image-snapshots/expected/components_forms_InputGroup_Select Input Group.png
index b4ebd9622..33cd7b7bc 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_InputGroup_Select Input Group.png and b/.storybook/image-snapshots/expected/components_forms_InputGroup_Select Input Group.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_CreatableSelect_Dark Mode.png b/.storybook/image-snapshots/expected/components_forms_Select_CreatableSelect_Dark Mode.png
new file mode 100644
index 000000000..d0e51471d
Binary files /dev/null and b/.storybook/image-snapshots/expected/components_forms_Select_CreatableSelect_Dark Mode.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_CreatableSelect_Playground.png b/.storybook/image-snapshots/expected/components_forms_Select_CreatableSelect_Playground.png
index 0db6b7c70..f9ffcaa94 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_CreatableSelect_Playground.png and b/.storybook/image-snapshots/expected/components_forms_Select_CreatableSelect_Playground.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_CreatableSelect_Single Select.png b/.storybook/image-snapshots/expected/components_forms_Select_CreatableSelect_Single Select.png
index 7a3df0f80..34b8338b2 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_CreatableSelect_Single Select.png and b/.storybook/image-snapshots/expected/components_forms_Select_CreatableSelect_Single Select.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Clearable.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Clearable.png
index 22173b3ca..4f8200b0b 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Clearable.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Clearable.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Group Label.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Group Label.png
index fd9eb4bb7..4ffa7e9fb 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Group Label.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Group Label.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Menu Actions.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Menu Actions.png
index 2cb87650c..21bcfdd77 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Menu Actions.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Menu Actions.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Multi Value Label.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Multi Value Label.png
index ffc42e8fa..e1ae67de3 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Multi Value Label.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Multi Value Label.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom No Option Found.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom No Option Found.png
index 233b533a2..26f7e14d8 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom No Option Found.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom No Option Found.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Option Label.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Option Label.png
index 9be368190..9bfefd0b2 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Option Label.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Custom Option Label.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Dark Mode.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Dark Mode.png
new file mode 100644
index 000000000..d3cd48a52
Binary files /dev/null and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Dark Mode.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Default.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Default.png
index 349277a41..47a7977ab 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Default.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Default.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Disabled Options.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Disabled Options.png
index ee7338429..2f261d50f 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Disabled Options.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Disabled Options.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Disabled.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Disabled.png
index 19fbec33b..878dd9cf7 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Disabled.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Disabled.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Focus.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Focus.png
index 9e2e4ce95..abf8ddd87 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Focus.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Focus.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Invalid.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Invalid.png
index 58de0e2de..d617d4d19 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Invalid.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Invalid.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Loading.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Loading.png
index d42fb8d23..35bb48f2c 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Loading.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Loading.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Max Visible Item.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Max Visible Item.png
index 142465156..223f3026f 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Max Visible Item.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Max Visible Item.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Multi Select.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Multi Select.png
index 6e0d967e1..c3c477b53 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Multi Select.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Multi Select.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_No Option Found.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_No Option Found.png
index 49e92750b..ffd3cf0b0 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_No Option Found.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_No Option Found.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Opened.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Opened.png
index 937567a48..9ecee2056 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Opened.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Opened.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Options Group.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Options Group.png
index baa344b22..7d1bb6b65 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Options Group.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Options Group.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Pill Truncation.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Pill Truncation.png
index 8d47830be..42baafb13 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Pill Truncation.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Pill Truncation.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Pill Wrapping.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Pill Wrapping.png
index 314e856dd..8c8d6ea91 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Pill Wrapping.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Pill Wrapping.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_Playground.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_Playground.png
index 25485215c..bb4e35b57 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_Playground.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_Playground.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_With Custom Components.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_With Custom Components.png
index 349277a41..47a7977ab 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_With Custom Components.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_With Custom Components.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_With Default Value.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_With Default Value.png
index e3f84267b..ad98604e4 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_With Default Value.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_With Default Value.png differ
diff --git a/.storybook/image-snapshots/expected/components_forms_Select_Select_With Placeholder.png b/.storybook/image-snapshots/expected/components_forms_Select_Select_With Placeholder.png
index 25485215c..bb4e35b57 100644
Binary files a/.storybook/image-snapshots/expected/components_forms_Select_Select_With Placeholder.png and b/.storybook/image-snapshots/expected/components_forms_Select_Select_With Placeholder.png differ
diff --git a/src/components/forms/Select/CreatableSelect.stories.tsx b/src/components/forms/Select/CreatableSelect.stories.tsx
index 704be2004..4de115eed 100644
--- a/src/components/forms/Select/CreatableSelect.stories.tsx
+++ b/src/components/forms/Select/CreatableSelect.stories.tsx
@@ -202,3 +202,13 @@ export const AsyncSelect: StoryFn<CreatableSelectProps<false>> = () => {
 AsyncSelect.parameters = {
   screenshot: { skip: true },
 };
+
+export const DarkMode = CreatableSelectTemplate.bind({});
+DarkMode.args = {
+  ...Playground.args,
+};
+DarkMode.parameters = {
+  themes: {
+    themeOverride: 'Dark',
+  },
+};
diff --git a/src/components/forms/Select/Select.stories.tsx b/src/components/forms/Select/Select.stories.tsx
index b17b3d3e9..0696196b5 100644
--- a/src/components/forms/Select/Select.stories.tsx
+++ b/src/components/forms/Select/Select.stories.tsx
@@ -477,3 +477,24 @@ MultiSelectWithControlledValue.args = {
 MultiSelectWithControlledValue.parameters = {
   screenshot: { skip: true },
 };
+
+export const DarkMode: Story = (args) => <Select {...args} />;
+DarkMode.args = {
+  ...OptionsGroup.args,
+  isMenuPositionRelative: true,
+  isMulti: true,
+  defaultValue: [options[4]],
+  isClearable: true,
+  menuActions: [
+    {
+      label: 'Action A',
+      name: 'Action A',
+      onClick: action('click-action-a'),
+    },
+  ],
+};
+DarkMode.parameters = {
+  themes: {
+    themeOverride: 'Dark',
+  },
+};
diff --git a/src/components/forms/Select/Select.styles.tsx b/src/components/forms/Select/Select.styles.tsx
index 244690ea4..7e689a9de 100644
--- a/src/components/forms/Select/Select.styles.tsx
+++ b/src/components/forms/Select/Select.styles.tsx
@@ -31,74 +31,69 @@ import { PaddingTypes } from '../../layout/Padbox/Padbox.enums';
 import { Icon } from '../../Icon';
 import { MenuActionArgs, Option as OptionType } from './Select.types';
 import { getPaddingSpace } from '../../../utils/space';
-import { getColor, getSpace, getToken, pxToRem } from '../../../utils';
+import { pxToRem } from '../../../utils';
 import { SpaceSizes } from '../../../theme';
 import { Spinner } from '../../Spinner';
 import PillWrapper from '../../Pill/PillWrapper';
 import PillLabel from '../../Pill/PillLabel';
 import PillRemoveButton from '../../Pill/PillRemoveButton';
 
-export const reactSelectTheme: (DSTheme: DefaultTheme) => ThemeConfig =
-  () => (selectTheme) => ({
-    ...selectTheme,
-    colors: {
-      primary: 'var(--sscds-primary-400)',
-      primary75: 'var(--sscds-primary-400)',
-      primary50: 'var(--sscds-primary-200)',
-      primary25: 'var(--sscds-primary-50)',
-      danger: 'var(--sscds-error-500)',
-      dangerLight: 'var(--sscds-error-50)',
-      neutral0: 'var(--sscds-neutral-0)',
-      neutral5: 'var(--sscds-neutral-100)',
-      neutral10: 'var(--sscds-neutral-200)',
-      neutral20: 'var(--sscds-neutral-300)',
-      neutral30: 'var(--sscds-neutral-400)',
-      neutral40: 'var(--sscds-neutral-500)',
-      neutral50: 'var(--sscds-neutral-600)',
-      neutral60: 'var(--sscds-neutral-700)',
-      neutral70: 'var(--sscds-neutral-800)',
-      neutral80: 'var(--sscds-neutral-900)',
-      neutral90: 'var(--sscds-neutral-1000)',
-    },
-    spacing: { ...selectTheme.spacing },
-  });
+export const reactSelectTheme: () => ThemeConfig = () => (selectTheme) => ({
+  ...selectTheme,
+  colors: {
+    primary: 'var(--sscds-color-primary-8)',
+    primary75: 'var(--sscds-color-primary-8)',
+    primary50: 'var(--sscds-color-primary-6)',
+    primary25: 'var(--sscds-color-primary-3)',
+    danger: 'var(--sscds-color-danger-800)',
+    dangerLight: 'var(--sscds-color-danger-050)',
+    neutral0: 'var(--sscds-color-neutral-0)',
+    neutral5: 'var(--sscds-color-neutral-2)',
+    neutral10: 'var(--sscds-color-neutral-3)',
+    neutral20: 'var(--sscds-color-neutral-4)',
+    neutral30: 'var(--sscds-color-neutral-7)',
+    neutral40: 'var(--sscds-color-neutral-8)',
+    neutral50: 'var(--sscds-color-neutral-9)',
+    neutral60: 'var(--sscds-color-neutral-10)',
+    neutral70: 'var(--sscds-color-neutral-11)',
+    neutral80: 'var(--sscds-color-neutral-12)',
+    neutral90: 'var(--sscds-color-neutral-13)',
+  },
+  spacing: { ...selectTheme.spacing },
+});
 
-const stateStyles = (color, width) => ({
+const stateStyles = (
+  color: `var(--sscds-${string})`,
+  width: `${string}px`,
+) => ({
   boxShadow: `inset 0 0 0 ${width} ${color}`,
 });
 
-const invalidStyles = (DSTheme) => ({
-  ...stateStyles(
-    DSTheme.forms.invalidBorderColor,
-    DSTheme.forms.statefulBorderWidth,
-  ),
-});
+const invalidStyles = {
+  ...stateStyles('var(--sscds-color-border-input-error)', '2px'),
+};
 
-const focusStyles = (DSTheme) => ({
-  ...stateStyles(
-    DSTheme.forms.focusBorderColor,
-    DSTheme.forms.statefulBorderWidth,
-  ),
-});
+const focusStyles = {
+  ...stateStyles('var(--sscds-color-border-input-focused)', '2px'),
+};
 
-const disabledStyles = (DSTheme) => ({
-  ...stateStyles(DSTheme.forms.disabledBorderColor, DSTheme.forms.borderWidth),
-  background: DSTheme.forms.disabledBgColor,
-});
+const disabledStyles = {
+  ...stateStyles('var(--sscds-color-border-input-disabled)', '1px'),
+  background: 'var(--sscds-color-background-input-disabled)',
+};
 
-const indicatorStyles = (DSTheme) => ({
+const indicatorStyles = {
   display: 'flex',
   justifyContent: 'center',
   alignItems: 'center',
-  color: DSTheme.forms.indicatorColor,
+  color: 'var(--sscds-color-icon-subtle)',
   cursor: 'pointer',
-  padding: `0rem ${pxToRem(18)}`,
-  height: pxToRem(34),
-  margin: pxToRem(1, 0),
+  width: '2rem',
+  height: '1.75rem',
   ':hover': {
-    color: DSTheme.forms.hoverIndicatorColor,
+    color: 'var(--sscds-color-icon-default)',
   },
-});
+};
 
 export const selectStyles: (
   DSTheme: DefaultTheme,
@@ -121,18 +116,17 @@ export const selectStyles: (
         alignItems: 'center',
         width: '100%',
         minHeight: DSTheme.forms.fieldHeight,
-        background: DSTheme.forms.bgColor,
-        boxShadow: `inset 0 0 0 ${DSTheme.forms.borderWidth} ${DSTheme.forms.borderColor}`,
-        borderRadius: DSTheme.radii.default,
-        color: DSTheme.forms.color,
-        fontSize: DSTheme.typography.size.md,
-        lineHeight: DSTheme.forms.fieldLineHeight,
+        background: 'var(--sscds-color-background-input-default)',
+        boxShadow: `inset 0 0 0 1px var(--sscds-color-border-input-default)`,
+        borderRadius: 'var(--sscds-radii-input)',
+        color: 'var(--sscds-color-text-default)',
+        fontSize: 'var(--sscds-font-size-body-md)',
+        lineHeight: 'var(--sscds-font-lineheight-body-md)',
         outline: 'none',
 
-        ...(isInvalid && invalidStyles(DSTheme)),
-        ...((isFocused || includes('focus', className)) &&
-          focusStyles(DSTheme)),
-        ...(isDisabled && disabledStyles(DSTheme)),
+        ...(isInvalid && invalidStyles),
+        ...((isFocused || includes('focus', className)) && focusStyles),
+        ...(isDisabled && disabledStyles),
       };
     },
     valueContainer: (styles, { selectProps: { isMulti, value } }) => {
@@ -140,13 +134,13 @@ export const selectStyles: (
         ...styles,
         display: 'flex',
         alignItems: 'center',
-        fontSize: DSTheme.typography.size.md,
-        lineHeight: DSTheme.typography.lineHeight.md,
-        padding: pxToRem(DSTheme.space.xs),
+        fontSize: 'var(--sscds-font-size-body-md)',
+        lineHeight: 'var(--sscds-font-lineheight-body-md)',
+        padding: 'var(--sscds-space-1x)',
         paddingLeft:
           isMulti && isNotNilOrEmpty(value)
             ? undefined
-            : pxToRem(DSTheme.space.md),
+            : 'var(--sscds-space-4x)',
       };
     },
     singleValue: assoc('margin', 0),
@@ -163,20 +157,22 @@ export const selectStyles: (
       display: 'flex',
       alignItems: 'center',
       '> div > input': {
-        fontFamily: DSTheme.typography.family.base,
-        lineHeight: DSTheme.forms.fieldLineHeight,
+        fontFamily: 'var(--sscds-font-family-body)',
+        lineHeight: 'var(--sscds-font-lineheight-body-md)',
       },
     }),
     placeholder: (_, { children }) => ({
-      color: DSTheme.forms.placeholderColor,
-      fontSize: DSTheme.typography.size.md,
-      lineHeight: DSTheme.typography.lineHeight.md,
+      color: 'var(--sscds-color-text-subtle)',
+      fontSize: 'var(--sscds-font-size-body-md)',
+      lineHeight: 'var(--sscds-font-lineheight-body-md)',
       display: isEmptyString(children) ? 'none' : 'block',
       position: 'absolute',
     }),
     indicatorsContainer: (styles) => ({
       ...styles,
       alignItems: 'flex-start',
+      padding: 'var(--sscds-space-1x)',
+      paddingLeft: 0,
     }),
     indicatorSeparator: (
       styles,
@@ -184,32 +180,33 @@ export const selectStyles: (
     ) => ({
       ...styles,
       display: (isClearable && hasValue) || isProcessing ? 'block' : 'none',
-      backgroundColor: DSTheme.colors.neutral[500],
-      margin: pxToRem(DSTheme.space.xs, 0),
-    }),
-    dropdownIndicator: () => ({
-      ...indicatorStyles(DSTheme),
+      backgroundColor: 'var(--sscds-color-border-default)',
+      height: 'calc(100% - var(--sscds-space-2x))',
+      margin: 'var(--sscds-space-1x) 0',
     }),
+    dropdownIndicator: () => indicatorStyles,
     clearIndicator: (_, { selectProps: { isProcessing } }) => ({
-      ...indicatorStyles(DSTheme),
+      ...indicatorStyles,
       display: isProcessing ? 'none' : 'flex',
       ':hover': {
-        color: DSTheme.colors.error[500],
+        color: 'var(--sscds-color-text-danger)',
         backgroundColor: 'transparent',
       },
       ':focus': {
-        color: DSTheme.colors.error[500],
+        color: 'var(--sscds-color-text-danger)',
       },
     }),
     menu: (styles, { selectProps: { isMenuPositionRelative } }) => ({
       ...styles,
       ...(isMenuPositionRelative ? { position: 'relative' } : {}),
-      border: `1px solid ${DSTheme.colors.neutral[300]}`,
-      boxShadow: `0px 1px 4px var(--sscds-slateA-slateA6)`,
-      marginBottom: pxToRem(DSTheme.space.xs),
-      marginTop: pxToRem(DSTheme.space.xs),
-      paddingTop: pxToRem(DSTheme.space.sm),
-      paddingBottom: pxToRem(DSTheme.space.sm),
+      backgroundColor: 'var(--sscds-color-background-surface-default)',
+      border: `1px solid var(--sscds-color-border-surface-default)`,
+      borderRadius: 'var(--sscds-radii-surface-md)',
+      boxShadow: 'var(--sscds-shadow-1x)',
+      marginBottom: 'var(--sscds-space-1x)',
+      marginTop: 'var(--sscds-space-1x)',
+      paddingTop: 'var(--sscds-space-2x)',
+      paddingBottom: 'var(--sscds-space-2x)',
     }),
     menuList: (styles) => ({
       ...styles,
@@ -218,33 +215,32 @@ export const selectStyles: (
     option: (styles, { isDisabled, isSelected, isFocused }) => ({
       ...styles,
       backgroundColor: isSelected
-        ? DSTheme.colors.neutral[300]
+        ? 'var(--sscds-color-background-selectable-active)'
         : isFocused
-        ? DSTheme.colors.primary[50]
+        ? 'var(--sscds-color-background-selectable-hover)'
         : 'transparent',
-      color: isDisabled ? DSTheme.colors.neutral[600] : DSTheme.forms.color,
-      fontSize: DSTheme.typography.size.md,
-      lineHeight: DSTheme.typography.lineHeight.md,
+      color: isDisabled
+        ? 'var(--sscds-color-text-disabled)'
+        : 'var(--sscds-color-text-default)',
+      fontSize: 'var(--sscds-font-size-body-md)',
+      lineHeight: 'var(--sscds-font-lineheight-body-md)',
       padding: menuItemPadding,
       ':active': {
         ...styles[':active'],
-        backgroundColor: DSTheme.colors.primary[200],
+        backgroundColor: 'var(--sscds-color-background-selectable-active)',
       },
     }),
-    group: (styles, { isMulti }) => ({
+    group: (styles) => ({
       ...styles,
       padding: 0,
-      marginTop: pxToRem(DSTheme.space.sm),
-      '[class$="-option"]': {
-        paddingLeft: !isMulti && pxToRem(DSTheme.space.mdPlus),
-      },
+      marginTop: 'var(--sscds-space-2x)',
     }),
     groupHeading: (styles) => ({
       ...styles,
-      fontWeight: DSTheme.typography.weight.bold,
-      color: DSTheme.colors.neutral[900],
-      fontSize: DSTheme.typography.size.md,
-      lineHeight: DSTheme.typography.lineHeight.md,
+      fontWeight: 'var(--sscds-font-weight-body-strong)',
+      color: 'var(--sscds-color-text-default)',
+      fontSize: 'var(--sscds-font-size-body-md)',
+      lineHeight: 'var(--sscds-font-lineheight-body-md)',
       textTransform: 'none',
       margin: 0,
       padding: menuItemPadding,
@@ -252,9 +248,9 @@ export const selectStyles: (
     noOptionsMessage: (styles) => ({
       ...styles,
       padding: menuItemPadding,
-      fontSize: DSTheme.typography.size.md,
-      lineHeight: DSTheme.typography.lineHeight.md,
-      color: DSTheme.forms.disabledActiveColor,
+      fontSize: 'var(--sscds-font-size-body-md)',
+      lineHeight: 'var(--sscds-font-lineheight-body-md)',
+      color: 'var(--sscds-color-text-subtle)',
       textAlign: 'left',
     }),
   };
@@ -321,9 +317,9 @@ export const MultiValueRemove: ComponentType<{
 );
 
 const ActionsMenu = styled.div`
-  margin-top: ${getSpace(SpaceSizes.sm)};
-  border-top: 1px solid ${getColor('neutral.300')};
-  padding-top: ${getSpace(SpaceSizes.sm)};
+  margin-top: var(--sscds-space-2x);
+  border-top: 1px solid var(--sscds-color-border-surface-default);
+  padding-top: var(--sscds-space-2x);
 `;
 
 const SelectActionButton = styled(Button)`
@@ -418,21 +414,9 @@ export const ValueContainer = (props) => {
   return <components.ValueContainer {...props} />;
 };
 
-const CreateNewOption = styled.div.attrs<{ variant: 'text'; color: 'primary' }>(
-  () => ({
-    variant: 'text',
-    color: 'primary',
-  }),
-)`
+const CreateNewOption = styled.div`
   cursor: pointer;
-  color: ${getToken('color-action-primary')};
-
-  &:hover {
-    color: ${getToken('color-action-primary-hover')};
-  }
-  &:active {
-    color: ${getToken('color-action-primary-active')};
-  }
+  color: var(--sscds-color-text-action);
 `;
 
 const StyledCheckbox = styled(Checkbox)`
@@ -502,7 +486,7 @@ export const IndicatorsContainer: ComponentType<
           borderWidth={2}
           height={16}
           horizontalMargin={16}
-          verticalMargin={10}
+          verticalMargin={6}
           width={16}
           dark
         />
diff --git a/src/components/forms/Select/useSelectProps.ts b/src/components/forms/Select/useSelectProps.ts
index d1775fab5..3651b3347 100644
--- a/src/components/forms/Select/useSelectProps.ts
+++ b/src/components/forms/Select/useSelectProps.ts
@@ -70,7 +70,7 @@ export const useSelectProps = <IsMulti extends boolean>({
     options: sortedOptions,
     placeholder,
     styles: selectStyles(DSTheme),
-    theme: reactSelectTheme(DSTheme),
+    theme: reactSelectTheme(),
     classNamePrefix: 'ssc',
     maxVisibleItem,
     maxPillLabelLength,
diff --git a/src/tokens/color.css b/src/tokens/color.css
index d3fe5da38..aacd49748 100644
--- a/src/tokens/color.css
+++ b/src/tokens/color.css
@@ -236,7 +236,7 @@
   --sscds-color-background-surface-default: var(--sscds-color-neutral-0);
   --sscds-color-background-surface-dynamic: var(--sscds-color-neutral-alpha-2);
   --sscds-color-background-surface-none: var(--sscds-color-clear);
-  --sscds-color-background-surface-hover: var(--sscds-color-neutral-2)
+  --sscds-color-background-surface-hover: var(--sscds-color-neutral-2);
 
   --sscds-color-background-input-default: var(--sscds-color-neutral-0);
   --sscds-color-background-input-hover: var(--sscds-color-neutral-0);
@@ -279,6 +279,9 @@
   --sscds-color-background-action-danger-ghost-active: var(--sscds-color-background-action-ghost-active);
   --sscds-color-background-action-danger-ghost-disabled: var(--sscds-color-background-action-ghost-disabled);
 
+  --sscds-color-background-selectable-hover: var(--sscds-color-neutral-3);
+  --sscds-color-background-selectable-active: var(--sscds-color-primary-3);
+
   --sscds-color-background-pill-blue-default: var(--blue-3);
   --sscds-color-background-pill-blue-hover: var(--blue-4);
   --sscds-color-background-pill-turquoise-default: var(--cyan-3);
@@ -312,9 +315,9 @@
   --sscds-color-border-surface-dynamic: var(--sscds-color-neutral-alpha-5);
   --sscds-color-border-surface-none: var(--sscds-color-clear);
   --sscds-color-border-surface-hover: var(--sscds-color-neutral-8);
-  --sscds-color-border-surface-active: var(--sscds-color-border-action-focused)
+  --sscds-color-border-surface-active: var(--sscds-color-border-action-focused);
 
-  --sscds-color-border-input-default: var(--sscds-color-neutral-8);
+  --sscds-color-border-input-default: var(--sscds-color-neutral-7); /* change to 8 when input fields get tokenized */
   --sscds-color-border-input-hover: var(--sscds-color-neutral-8);
   --sscds-color-border-input-focused: var(--indigo-9);
   --sscds-color-border-input-disabled: var(--sscds-color-neutral-8);