diff --git a/app/assets/javascripts/admin/abuse_reports/components/abuse_report_row.vue b/app/assets/javascripts/admin/abuse_reports/components/abuse_report_row.vue
index 42800eb3e1a..a9fa45c6914 100644
--- a/app/assets/javascripts/admin/abuse_reports/components/abuse_report_row.vue
+++ b/app/assets/javascripts/admin/abuse_reports/components/abuse_report_row.vue
@@ -67,7 +67,7 @@ export default {
     <template #left-primary>
       <gl-link
         :href="report.reportPath"
-        class="gl-font-normal gl-text-gray-900"
+        class="gl-font-normal gl-text-default"
         data-testid="abuse-report-title"
       >
         {{ title }}
diff --git a/app/assets/javascripts/boards/components/board_card_inner.vue b/app/assets/javascripts/boards/components/board_card_inner.vue
index fc04165ca6b..dada4f2a07a 100644
--- a/app/assets/javascripts/boards/components/board_card_inner.vue
+++ b/app/assets/javascripts/boards/components/board_card_inner.vue
@@ -373,7 +373,7 @@ export default {
           v-if="shouldRenderCounter"
           v-gl-tooltip
           :title="assigneeCounterTooltip"
-          class="avatar-counter -gl-ml-3 gl-cursor-help gl-border-0 gl-bg-gray-100 gl-font-bold gl-leading-24 gl-text-gray-900"
+          class="avatar-counter -gl-ml-3 gl-cursor-help gl-border-0 gl-bg-gray-100 gl-font-bold gl-leading-24 gl-text-default"
           data-placement="bottom"
           >{{ assigneeCounterLabel }}</span
         >
diff --git a/app/assets/javascripts/ci/admin/jobs_table/admin_jobs_table_app.vue b/app/assets/javascripts/ci/admin/jobs_table/admin_jobs_table_app.vue
index 165e8457a88..f3d7a45c7a2 100644
--- a/app/assets/javascripts/ci/admin/jobs_table/admin_jobs_table_app.vue
+++ b/app/assets/javascripts/ci/admin/jobs_table/admin_jobs_table_app.vue
@@ -35,7 +35,7 @@ export default {
     cancelableJobsErrorMsg: CANCELABLE_JOBS_ERROR_MSG,
   },
   filterSearchBoxStyles:
-    'gl-my-0 gl-p-5 gl-bg-gray-10 gl-text-gray-900 gl-border-b gl-border-gray-100',
+    'gl-my-0 gl-p-5 gl-bg-gray-10 gl-text-default gl-border-b gl-border-gray-100',
   components: {
     JobsSkeletonLoader,
     JobsTableEmptyState,
diff --git a/app/assets/javascripts/ci/catalog/components/details/ci_resource_header.vue b/app/assets/javascripts/ci/catalog/components/details/ci_resource_header.vue
index 171bcbd8f55..8b9add0d838 100644
--- a/app/assets/javascripts/ci/catalog/components/details/ci_resource_header.vue
+++ b/app/assets/javascripts/ci/catalog/components/details/ci_resource_header.vue
@@ -128,7 +128,7 @@ export default {
           </div>
           <span class="gl-flex gl-items-center gl-gap-3">
             <gl-link
-              class="gl-text-lg gl-font-bold gl-text-gray-900 hover:gl-text-gray-900"
+              class="gl-text-lg gl-font-bold gl-text-default hover:gl-text-default"
               :href="resource.webPath"
             >
               {{ resource.name }}
diff --git a/app/assets/javascripts/ci/catalog/components/list/ci_resources_list_item.vue b/app/assets/javascripts/ci/catalog/components/list/ci_resources_list_item.vue
index fdca9aa22e3..00d579edbeb 100644
--- a/app/assets/javascripts/ci/catalog/components/list/ci_resources_list_item.vue
+++ b/app/assets/javascripts/ci/catalog/components/list/ci_resources_list_item.vue
@@ -173,7 +173,7 @@ export default {
       </div>
       <div class="gl-mb-1 gl-flex gl-flex-wrap gl-items-center gl-gap-2">
         <gl-link
-          class="gl-mr-1 !gl-text-gray-900"
+          class="gl-mr-1 !gl-text-default"
           :href="detailsPageHref"
           data-testid="ci-resource-link"
           @click="navigateToDetailsPage"
@@ -215,7 +215,7 @@ export default {
           <div
             v-if="hasComponents"
             data-testid="ci-resource-component-names"
-            class="gl-mt-1 gl-inline-flex gl-flex-wrap gl-text-sm gl-text-gray-900"
+            class="gl-mt-1 gl-inline-flex gl-flex-wrap gl-text-sm gl-text-default"
           >
             <span class="gl-font-bold"> &#8226; {{ $options.i18n.components }} </span>
             <gl-sprintf :message="componentNamesSprintfMessage">
diff --git a/app/assets/javascripts/ci/jobs_page/components/job_cells/job_cell.vue b/app/assets/javascripts/ci/jobs_page/components/job_cells/job_cell.vue
index 5501e064e2b..6d197671ce2 100644
--- a/app/assets/javascripts/ci/jobs_page/components/job_cells/job_cell.vue
+++ b/app/assets/javascripts/ci/jobs_page/components/job_cells/job_cell.vue
@@ -86,9 +86,7 @@ export default {
       <span v-else data-testid="job-id-limited-access">{{ jobId }}: {{ job.name }}</span>
     </div>
 
-    <div
-      class="gl-mt-1 gl-flex gl-items-center gl-justify-end gl-text-gray-700 lg:gl-justify-start"
-    >
+    <div class="gl-mt-1 gl-flex gl-items-center gl-justify-end gl-text-subtle lg:gl-justify-start">
       <div v-if="jobRef" class="gl-max-w-26 gl-truncate gl-rounded-base gl-bg-gray-50 gl-px-2">
         <gl-icon
           v-if="createdByTag"
@@ -98,7 +96,7 @@ export default {
         />
         <gl-icon v-else name="fork" :size="$options.iconSize" data-testid="fork-icon" />
         <gl-link
-          class="gl-text-sm gl-text-gray-700 gl-font-monospace hover:gl-text-gray-900"
+          class="gl-text-sm gl-text-subtle gl-font-monospace hover:gl-text-subtle"
           :href="job.refPath"
           data-testid="job-ref"
           >{{ job.refName }}</gl-link
@@ -108,7 +106,7 @@ export default {
       <div class="gl-ml-2 gl-flex gl-items-center gl-rounded-base gl-bg-gray-50 gl-px-2">
         <gl-icon class="gl-mx-2" name="commit" :size="$options.iconSize" />
         <gl-link
-          class="gl-text-sm gl-text-gray-700 gl-font-monospace hover:gl-text-gray-900"
+          class="gl-text-sm gl-text-subtle gl-font-monospace hover:gl-text-subtle"
           :href="job.commitPath"
           data-testid="job-sha"
           >{{ job.shortSha }}</gl-link
diff --git a/app/assets/javascripts/ci/jobs_page/jobs_page_app.vue b/app/assets/javascripts/ci/jobs_page/jobs_page_app.vue
index c48a9d1daa6..6a2fca992a4 100644
--- a/app/assets/javascripts/ci/jobs_page/jobs_page_app.vue
+++ b/app/assets/javascripts/ci/jobs_page/jobs_page_app.vue
@@ -23,7 +23,7 @@ export default {
     loadingAriaLabel: __('Loading'),
   },
   filterSearchBoxStyles:
-    'gl-my-0 gl-p-5 gl-bg-gray-10 gl-text-gray-900 gl-border-b gl-border-gray-100',
+    'gl-my-0 gl-p-5 gl-bg-gray-10 gl-text-default gl-border-b gl-border-gray-100',
   components: {
     GlAlert,
     GlKeysetPagination,
diff --git a/app/assets/javascripts/ci/pipeline_details/header/pipeline_header.vue b/app/assets/javascripts/ci/pipeline_details/header/pipeline_header.vue
index 7aab40256c0..88945e93efb 100644
--- a/app/assets/javascripts/ci/pipeline_details/header/pipeline_header.vue
+++ b/app/assets/javascripts/ci/pipeline_details/header/pipeline_header.vue
@@ -333,7 +333,7 @@ export default {
             <gl-link
               v-if="user"
               :href="user.webUrl"
-              class="js-user-link gl-inline-block gl-font-bold gl-text-gray-900"
+              class="js-user-link gl-inline-block gl-font-bold gl-text-default"
               :data-user-id="userId"
               :data-username="user.username"
               data-testid="pipeline-user-link"
diff --git a/app/assets/javascripts/ci/pipeline_details/jobs/components/failed_jobs_table.vue b/app/assets/javascripts/ci/pipeline_details/jobs/components/failed_jobs_table.vue
index 65a0df15c5f..0b970c5267d 100644
--- a/app/assets/javascripts/ci/pipeline_details/jobs/components/failed_jobs_table.vue
+++ b/app/assets/javascripts/ci/pipeline_details/jobs/components/failed_jobs_table.vue
@@ -83,7 +83,7 @@ export default {
       <div class="gl-flex gl-items-center gl-justify-end lg:gl-justify-start">
         <ci-icon :status="item.detailedStatus" class="gl-mr-3" />
         <div class="gl-truncate">
-          <gl-link :href="item.detailedStatus.detailsPath" class="gl-font-bold !gl-text-gray-900">
+          <gl-link :href="item.detailedStatus.detailsPath" class="gl-font-bold !gl-text-default">
             {{ item.name }}
           </gl-link>
         </div>
diff --git a/app/assets/javascripts/ci/pipeline_details/test_reports/test_summary_table.vue b/app/assets/javascripts/ci/pipeline_details/test_reports/test_summary_table.vue
index 7ea04a19f22..435ec0cddae 100644
--- a/app/assets/javascripts/ci/pipeline_details/test_reports/test_summary_table.vue
+++ b/app/assets/javascripts/ci/pipeline_details/test_reports/test_summary_table.vue
@@ -78,7 +78,7 @@ export default {
           <div role="rowheader" class="table-mobile-header gl-font-bold">
             {{ __('Suite') }}
           </div>
-          <div class="table-mobile-content underline gl-pl-5 gl-text-gray-900">
+          <div class="table-mobile-content underline gl-pl-5 gl-text-default">
             {{ testSuite.name }}
             <gl-icon
               v-if="testSuite.suite_error"
diff --git a/app/assets/javascripts/ci/pipeline_schedules/components/table/cells/pipeline_schedule_target.vue b/app/assets/javascripts/ci/pipeline_schedules/components/table/cells/pipeline_schedule_target.vue
index 56d50026f17..f6c783a6951 100644
--- a/app/assets/javascripts/ci/pipeline_schedules/components/table/cells/pipeline_schedule_target.vue
+++ b/app/assets/javascripts/ci/pipeline_schedules/components/table/cells/pipeline_schedule_target.vue
@@ -30,7 +30,7 @@ export default {
   <div data-testid="pipeline-schedule-target">
     <span v-if="refPath">
       <gl-icon :name="iconName" />
-      <gl-link :href="refPath" class="gl-text-gray-900">{{ refDisplay }}</gl-link>
+      <gl-link :href="refPath" class="gl-text-default">{{ refDisplay }}</gl-link>
     </span>
     <span v-else>
       {{ s__('PipelineSchedules|None') }}
diff --git a/app/assets/javascripts/ci/pipelines_page/components/failure_widget/failed_job_details.vue b/app/assets/javascripts/ci/pipelines_page/components/failure_widget/failed_job_details.vue
index 6aeab0aa7f0..c4bddcc075b 100644
--- a/app/assets/javascripts/ci/pipelines_page/components/failure_widget/failed_job_details.vue
+++ b/app/assets/javascripts/ci/pipelines_page/components/failure_widget/failed_job_details.vue
@@ -109,10 +109,10 @@ export default {
       class="row gl-my-3 gl-flex gl-flex-wrap gl-items-center gl-gap-y-4"
       data-testid="widget-row"
     >
-      <div class="align-items-center col-4 gl-flex gl-text-gray-900">
+      <div class="align-items-center col-4 gl-flex gl-text-default">
         <ci-icon :status="job.detailedStatus" />
         <gl-link
-          class="gl-ml-2 !gl-text-gray-900 !gl-no-underline"
+          class="gl-ml-2 !gl-text-default !gl-no-underline"
           :href="detailsPath"
           data-testid="job-name-link"
           >{{ job.name }}</gl-link
diff --git a/app/assets/javascripts/ci/pipelines_page/components/failure_widget/failed_jobs_list.vue b/app/assets/javascripts/ci/pipelines_page/components/failure_widget/failed_jobs_list.vue
index fb7cc27032d..3c502a554b0 100644
--- a/app/assets/javascripts/ci/pipelines_page/components/failure_widget/failed_jobs_list.vue
+++ b/app/assets/javascripts/ci/pipelines_page/components/failure_widget/failed_jobs_list.vue
@@ -140,7 +140,7 @@ export default {
           </template>
         </gl-sprintf>
       </gl-alert>
-      <div class="row gl-my-4 gl-text-gray-900">
+      <div class="row gl-my-4 gl-text-default">
         <div
           v-for="col in $options.columns"
           :key="col.text"
diff --git a/app/assets/javascripts/ci/pipelines_page/components/pipeline_multi_actions.vue b/app/assets/javascripts/ci/pipelines_page/components/pipeline_multi_actions.vue
index d70c77c99b5..718a914894c 100644
--- a/app/assets/javascripts/ci/pipelines_page/components/pipeline_multi_actions.vue
+++ b/app/assets/javascripts/ci/pipelines_page/components/pipeline_multi_actions.vue
@@ -144,7 +144,7 @@ export default {
     <template #header>
       <div
         aria-hidden="true"
-        class="gl-flex gl-min-h-8 gl-items-center gl-border-b-1 gl-border-b-dropdown !gl-p-4 gl-text-sm gl-font-bold gl-text-gray-900 gl-border-b-solid"
+        class="gl-flex gl-min-h-8 gl-items-center gl-border-b-1 gl-border-b-dropdown !gl-p-4 gl-text-sm gl-font-bold gl-text-strong gl-border-b-solid"
       >
         {{ $options.i18n.downloadArtifacts }}
       </div>
diff --git a/app/assets/javascripts/ci/pipelines_page/components/pipeline_url.vue b/app/assets/javascripts/ci/pipelines_page/components/pipeline_url.vue
index d832c5f34e0..ad0215751b1 100644
--- a/app/assets/javascripts/ci/pipelines_page/components/pipeline_url.vue
+++ b/app/assets/javascripts/ci/pipelines_page/components/pipeline_url.vue
@@ -153,7 +153,7 @@ export default {
       <span class="gl-flex">
         <tooltip-on-truncate
           :title="pipelineIdentifier.text"
-          class="gl-grow gl-truncate gl-text-gray-900"
+          class="gl-grow gl-truncate gl-text-default"
         >
           <gl-link :href="pipelineIdentifier.link" data-testid="pipeline-identifier-link">{{
             pipelineIdentifier.text
@@ -193,7 +193,7 @@ export default {
         >#{{ pipeline[pipelineIdType] }}</gl-link
       >
       <!--Commit row-->
-      <div class="gl-inline-flex gl-rounded-base gl-bg-gray-50 gl-px-2 gl-text-gray-700">
+      <div class="gl-inline-flex gl-rounded-base gl-bg-gray-50 gl-px-2 gl-text-subtle">
         <tooltip-on-truncate :title="tooltipTitle" truncate-target="child" placement="top">
           <gl-icon
             v-gl-tooltip
@@ -205,7 +205,7 @@ export default {
           <gl-link
             v-if="mergeRequestRef"
             :href="mergeRequestRef.path"
-            class="gl-text-sm !gl-text-gray-700 gl-font-monospace hover:!gl-text-gray-900"
+            class="gl-text-sm !gl-text-subtle gl-font-monospace"
             :class="refClass"
             data-testid="merge-request-ref"
             @click="trackClick('click_mr_ref')"
@@ -214,7 +214,7 @@ export default {
           <gl-link
             v-else
             :href="refUrl"
-            class="gl-text-sm !gl-text-gray-700 gl-font-monospace hover:!gl-text-gray-900"
+            class="gl-text-sm !gl-text-subtle gl-font-monospace"
             :class="refClass"
             data-testid="commit-ref-name"
             @click="trackClick('click_commit_name')"
@@ -234,7 +234,7 @@ export default {
         />
         <gl-link
           :href="commitUrl"
-          class="gl-mr-0 gl-text-sm !gl-text-gray-700 gl-font-monospace"
+          class="gl-mr-0 gl-text-sm !gl-text-subtle gl-font-monospace"
           data-testid="commit-short-sha"
           @click="trackClick('click_commit_sha')"
           >{{ commitShortSha }}</gl-link
diff --git a/app/assets/javascripts/ci/runner/components/runner_assigned_item.vue b/app/assets/javascripts/ci/runner/components/runner_assigned_item.vue
index 5932ee90754..a0070c7ef0f 100644
--- a/app/assets/javascripts/ci/runner/components/runner_assigned_item.vue
+++ b/app/assets/javascripts/ci/runner/components/runner_assigned_item.vue
@@ -54,7 +54,7 @@ export default {
     </gl-link>
     <div>
       <div class="gl-mb-1">
-        <gl-link :href="href" class="gl-font-bold !gl-text-gray-900">{{ fullName }}</gl-link>
+        <gl-link :href="href" class="gl-font-bold !gl-text-default">{{ fullName }}</gl-link>
         <gl-badge v-if="isOwner" variant="info">{{ s__('Runners|Owner') }}</gl-badge>
       </div>
       <div v-if="description">{{ description }}</div>
diff --git a/app/assets/javascripts/deploy_keys/components/keys_panel.vue b/app/assets/javascripts/deploy_keys/components/keys_panel.vue
index 03fbb30a0d3..f1cf03a5f79 100644
--- a/app/assets/javascripts/deploy_keys/components/keys_panel.vue
+++ b/app/assets/javascripts/deploy_keys/components/keys_panel.vue
@@ -24,7 +24,7 @@ export default {
     <template v-if="keys.length > 0">
       <div
         role="row"
-        class="gl-responsive-table-row table-row-header !gl-border-gray-100 gl-bg-gray-10 gl-text-base gl-font-bold gl-text-gray-900 md:gl-pl-5 md:gl-pr-5"
+        class="gl-responsive-table-row table-row-header !gl-border-gray-100 gl-bg-gray-10 gl-text-base gl-font-bold gl-text-strong md:gl-pl-5 md:gl-pr-5"
       >
         <div role="rowheader" class="table-section section-40">
           {{ s__('DeployKeys|Deploy key') }}
diff --git a/app/assets/javascripts/deployments/components/aside_item.vue b/app/assets/javascripts/deployments/components/aside_item.vue
index 45112045876..45aa0bae74d 100644
--- a/app/assets/javascripts/deployments/components/aside_item.vue
+++ b/app/assets/javascripts/deployments/components/aside_item.vue
@@ -3,7 +3,7 @@ export default {};
 </script>
 <template>
   <div class="gl-flex gl-flex-col">
-    <span class="gl-mb-2 gl-font-bold gl-text-gray-900">
+    <span class="gl-mb-2 gl-font-bold gl-text-heading">
       <slot name="header"></slot>
     </span>
     <slot></slot>
diff --git a/app/assets/javascripts/design_management/components/toolbar/index.vue b/app/assets/javascripts/design_management/components/toolbar/index.vue
index 50e09a1ccae..1bad0a4d45e 100644
--- a/app/assets/javascripts/design_management/components/toolbar/index.vue
+++ b/app/assets/javascripts/design_management/components/toolbar/index.vue
@@ -142,7 +142,7 @@ export default {
       <div class="gl-mr-3 gl-flex gl-overflow-hidden">
         <gl-skeleton-loader v-if="isLoading" :lines="1" />
         <h2 v-else class="gl-m-0 gl-flex gl-items-center gl-overflow-hidden gl-text-base">
-          <span class="gl-truncate gl-text-gray-900 gl-no-underline">
+          <span class="gl-truncate gl-text-heading gl-no-underline">
             {{ issueTitle }}
           </span>
           <gl-icon name="chevron-right" class="gl-shrink-0" variant="disabled" />
diff --git a/app/assets/javascripts/environments/environment_details/components/kubernetes/kubernetes_agent_info.vue b/app/assets/javascripts/environments/environment_details/components/kubernetes/kubernetes_agent_info.vue
index 71ece99fd3f..638615f1e4e 100644
--- a/app/assets/javascripts/environments/environment_details/components/kubernetes/kubernetes_agent_info.vue
+++ b/app/assets/javascripts/environments/environment_details/components/kubernetes/kubernetes_agent_info.vue
@@ -38,7 +38,7 @@ export default {
 };
 </script>
 <template>
-  <div class="gl-text-gray-900">
+  <div class="gl-text-default">
     <gl-icon name="kubernetes-agent" variant="subtle" />
     <gl-link :href="clusterAgent.webPath" class="gl-mr-3">
       <gl-sprintf :message="$options.i18n.agentId"
diff --git a/app/assets/javascripts/groups/components/group_item.vue b/app/assets/javascripts/groups/components/group_item.vue
index 6ad1025e840..5d6c13191b1 100644
--- a/app/assets/javascripts/groups/components/group_item.vue
+++ b/app/assets/javascripts/groups/components/group_item.vue
@@ -196,7 +196,7 @@ export default {
               data-testid="group-name"
               :href="group.relativePath"
               :title="group.fullName"
-              class="no-expand gl-mr-3 !gl-text-gray-900 gl-break-anywhere"
+              class="no-expand gl-mr-3 !gl-text-default gl-break-anywhere"
               :itemprop="microdata.nameItemprop"
             >
               <!-- ending bracket must be by closing tag to prevent -->
diff --git a/app/assets/javascripts/groups_projects/components/transfer_locations.vue b/app/assets/javascripts/groups_projects/components/transfer_locations.vue
index fe86197e4a8..49fb6dbf97e 100644
--- a/app/assets/javascripts/groups_projects/components/transfer_locations.vue
+++ b/app/assets/javascripts/groups_projects/components/transfer_locations.vue
@@ -279,7 +279,7 @@ export default {
             >{{ item.humanName }}</gl-dropdown-item
           >
         </div>
-        <gl-dropdown-item v-if="hasNoResults" button-class="!gl-text-gray-900" disabled>{{
+        <gl-dropdown-item v-if="hasNoResults" button-class="!gl-text-default" disabled>{{
           $options.i18n.NO_RESULTS_TEXT
         }}</gl-dropdown-item>
         <gl-loading-icon v-if="isLoading" class="gl-mb-3" size="sm" />
diff --git a/app/assets/javascripts/import_entities/import_projects/components/import_projects_table.vue b/app/assets/javascripts/import_entities/import_projects/components/import_projects_table.vue
index 25d00028ffe..9a0c94a7d00 100644
--- a/app/assets/javascripts/import_entities/import_projects/components/import_projects_table.vue
+++ b/app/assets/javascripts/import_entities/import_projects/components/import_projects_table.vue
@@ -132,7 +132,7 @@ export default {
 
 <template>
   <div>
-    <p class="gl-mt-3 gl-whitespace-nowrap gl-text-gray-900">
+    <p class="gl-mt-3 gl-whitespace-nowrap gl-text-default">
       {{ s__('ImportProjects|Select the repositories you want to import') }}
     </p>
     <template v-if="hasIncompatibleRepos">
diff --git a/app/assets/javascripts/issues/new/components/title_suggestions_item.vue b/app/assets/javascripts/issues/new/components/title_suggestions_item.vue
index e26c50eb594..543a5c739d0 100644
--- a/app/assets/javascripts/issues/new/components/title_suggestions_item.vue
+++ b/app/assets/javascripts/issues/new/components/title_suggestions_item.vue
@@ -77,7 +77,7 @@ export default {
       <gl-link
         :href="suggestion.webUrl"
         target="_blank"
-        class="suggestion str-truncated-100 gl-font-bold !gl-text-gray-900"
+        class="suggestion str-truncated-100 gl-font-bold !gl-text-default"
       >
         {{ suggestion.title }}
       </gl-link>
diff --git a/app/assets/javascripts/issues/show/components/edited.vue b/app/assets/javascripts/issues/show/components/edited.vue
index ebdd083dfb4..757b3ab8eab 100644
--- a/app/assets/javascripts/issues/show/components/edited.vue
+++ b/app/assets/javascripts/issues/show/components/edited.vue
@@ -88,7 +88,7 @@ export default {
           <time-ago-tooltip :time="updatedAt" tooltip-placement="bottom" />
         </template>
         <template #author>
-          <gl-link :href="updatedByPath" class="gl-text-gray-700 hover:gl-text-gray-900">
+          <gl-link :href="updatedByPath" class="gl-text-subtle hover:gl-text-subtle">
             {{ updatedByName }}
           </gl-link>
         </template>
diff --git a/app/assets/javascripts/jira_connect/subscriptions/components/group_item_name.vue b/app/assets/javascripts/jira_connect/subscriptions/components/group_item_name.vue
index cf2ab283485..2191c8bc8ec 100644
--- a/app/assets/javascripts/jira_connect/subscriptions/components/group_item_name.vue
+++ b/app/assets/javascripts/jira_connect/subscriptions/components/group_item_name.vue
@@ -30,7 +30,7 @@ export default {
     </div>
 
     <div>
-      <span class="gl-mr-3 gl-font-bold !gl-text-gray-900">
+      <span class="gl-mr-3 gl-font-bold !gl-text-default">
         {{ group.full_name }}
       </span>
       <div v-if="group.description">
diff --git a/app/assets/javascripts/merge_request_dashboard/components/merge_request.vue b/app/assets/javascripts/merge_request_dashboard/components/merge_request.vue
index e19ee755cb3..50d99d45992 100644
--- a/app/assets/javascripts/merge_request_dashboard/components/merge_request.vue
+++ b/app/assets/javascripts/merge_request_dashboard/components/merge_request.vue
@@ -72,7 +72,7 @@ export default {
     <td class="gl-px-3 gl-py-4 gl-align-top">
       <gl-link
         :href="mergeRequest.webUrl"
-        class="gl-font-bold gl-text-default hover:gl-text-gray-900"
+        class="gl-font-bold gl-text-default hover:gl-text-default"
       >
         {{ mergeRequest.title }}
       </gl-link>
diff --git a/app/assets/javascripts/ml/model_registry/components/model_version_create.vue b/app/assets/javascripts/ml/model_registry/components/model_version_create.vue
index 9c32e64d860..8a1c411d689 100644
--- a/app/assets/javascripts/ml/model_registry/components/model_version_create.vue
+++ b/app/assets/javascripts/ml/model_registry/components/model_version_create.vue
@@ -178,7 +178,7 @@ export default {
   <div>
     <gl-form>
       <h2 data-testid="title">{{ $options.i18n.title }}</h2>
-      <p data-testid="description" class="gl-text-gray-900">{{ $options.i18n.description }}</p>
+      <p data-testid="description" class="gl-text-default">{{ $options.i18n.description }}</p>
       <gl-form-group
         data-testid="versionDescriptionId"
         :label="$options.i18n.versionLabelText"
diff --git a/app/assets/javascripts/profile/components/snippets/snippet_row.vue b/app/assets/javascripts/profile/components/snippets/snippet_row.vue
index 1cdeee5c029..ced94c21a90 100644
--- a/app/assets/javascripts/profile/components/snippets/snippet_row.vue
+++ b/app/assets/javascripts/profile/components/snippets/snippet_row.vue
@@ -65,7 +65,7 @@ export default {
       <gl-link
         data-testid="snippet-url"
         :href="snippet.webUrl"
-        class="gl-mb-2 gl-font-bold gl-text-gray-900"
+        class="gl-mb-2 gl-font-bold gl-text-default"
         >{{ snippet.title }}</gl-link
       >
       <span class="gl-text-subtle">
@@ -77,7 +77,7 @@ export default {
             <time-ago data-testid="snippet-created-at" :time="snippet.createdAt" />
           </template>
           <template #author>
-            <gl-link data-testid="snippet-author" :href="profilePath" class="gl-text-gray-900">{{
+            <gl-link data-testid="snippet-author" :href="profilePath" class="gl-text-default">{{
               userInfo.name
             }}</gl-link>
           </template>
@@ -99,7 +99,7 @@ export default {
         <gl-link
           data-testid="snippet-comments"
           :href="`${snippet.webUrl}#notes`"
-          class="gl-mr-4 gl-text-gray-900"
+          class="gl-mr-4 gl-text-default"
           :class="{ 'gl-opacity-5': commentsCount === 0 }"
         >
           <gl-icon name="comments" />
diff --git a/app/assets/javascripts/projects/settings_service_desk/components/service_desk_setting.vue b/app/assets/javascripts/projects/settings_service_desk/components/service_desk_setting.vue
index caa96a55d61..34cbecf1676 100644
--- a/app/assets/javascripts/projects/settings_service_desk/components/service_desk_setting.vue
+++ b/app/assets/javascripts/projects/settings_service_desk/components/service_desk_setting.vue
@@ -325,7 +325,7 @@ export default {
             </gl-sprintf>
           </template>
           <template v-else #description>
-            <span class="gl-text-gray-900">
+            <span class="gl-text-default">
               <gl-sprintf
                 :message="
                   __(
diff --git a/app/assets/javascripts/search/sidebar/constants/index.js b/app/assets/javascripts/search/sidebar/constants/index.js
index 92914c2cb25..439607ad3d8 100644
--- a/app/assets/javascripts/search/sidebar/constants/index.js
+++ b/app/assets/javascripts/search/sidebar/constants/index.js
@@ -15,7 +15,7 @@ export const LABEL_DEFAULT_CLASSES = [
   'gl-flex',
   'gl-flex-row',
   'gl-flex-nowrap',
-  'gl-text-gray-900',
+  'gl-text-default',
 ];
 export const NAV_LINK_DEFAULT_CLASSES = [...LABEL_DEFAULT_CLASSES, 'gl-justify-between'];
 export const NAV_LINK_COUNT_DEFAULT_CLASSES = ['gl-text-sm', 'gl-font-normal'];
diff --git a/app/assets/javascripts/super_sidebar/components/menu_section.vue b/app/assets/javascripts/super_sidebar/components/menu_section.vue
index fb38c612455..07bc0e35760 100644
--- a/app/assets/javascripts/super_sidebar/components/menu_section.vue
+++ b/app/assets/javascripts/super_sidebar/components/menu_section.vue
@@ -141,7 +141,7 @@ export default {
         </slot>
       </span>
 
-      <span class="gl-truncate-end gl-grow gl-text-gray-900">
+      <span class="gl-truncate-end gl-grow gl-text-default">
         {{ item.title }}
       </span>
 
diff --git a/app/assets/javascripts/super_sidebar/components/nav_item.vue b/app/assets/javascripts/super_sidebar/components/nav_item.vue
index d787d5d8040..9e77c7e4276 100644
--- a/app/assets/javascripts/super_sidebar/components/nav_item.vue
+++ b/app/assets/javascripts/super_sidebar/components/nav_item.vue
@@ -271,7 +271,11 @@ export default {
           />
         </slot>
       </div>
-      <div class="gl-grow gl-text-gray-900" :class="{ 'gl-w-max': isFlyout }">
+      <div
+        class="gl-grow gl-text-default"
+        :class="{ 'gl-w-max': isFlyout }"
+        data-testid="nav-item-link-label"
+      >
         {{ item.title }}
         <div v-if="item.subtitle" class="gl-truncate-end gl-text-sm gl-text-subtle">
           {{ item.subtitle }}
diff --git a/app/assets/javascripts/super_sidebar/components/user_bar.vue b/app/assets/javascripts/super_sidebar/components/user_bar.vue
index 910cb8150a7..8da4e85aa67 100644
--- a/app/assets/javascripts/super_sidebar/components/user_bar.vue
+++ b/app/assets/javascripts/super_sidebar/components/user_bar.vue
@@ -209,7 +209,8 @@ export default {
         id="super-sidebar-search"
         v-gl-tooltip.bottom.html="searchTooltip"
         v-gl-modal="$options.SEARCH_MODAL_ID"
-        class="user-bar-button gl-block gl-w-full gl-rounded-base gl-border-none gl-bg-gray-10 gl-py-3 gl-leading-1 gl-text-gray-900"
+        class="user-bar-button gl-border-none"
+        block
         data-testid="super-sidebar-search-button"
         @click="trackEvent('click_search_button_to_activate_command_palette')"
       >
diff --git a/app/assets/javascripts/terraform/components/states_table.vue b/app/assets/javascripts/terraform/components/states_table.vue
index fe1f7495a2e..916388dd748 100644
--- a/app/assets/javascripts/terraform/components/states_table.vue
+++ b/app/assets/javascripts/terraform/components/states_table.vue
@@ -136,7 +136,7 @@ export default {
         data-testid="terraform-states-table-name"
         class="gl-align-center gl-flex gl-justify-end gl-gap-3 md:gl-justify-start"
       >
-        <p class="gl-m-0 gl-text-gray-900">
+        <p class="gl-m-0 gl-text-default">
           {{ item.name }}
         </p>
 
diff --git a/app/assets/javascripts/time_tracking/components/timelog_source_cell.vue b/app/assets/javascripts/time_tracking/components/timelog_source_cell.vue
index 2c93de54588..06c6176b82f 100644
--- a/app/assets/javascripts/time_tracking/components/timelog_source_cell.vue
+++ b/app/assets/javascripts/time_tracking/components/timelog_source_cell.vue
@@ -31,7 +31,7 @@ export default {
   <div class="gl-flex gl-flex-col gl-gap-2 !gl-text-left">
     <gl-link
       :href="subject.webUrl"
-      class="gl-font-bold gl-text-gray-900 hover:gl-text-gray-900"
+      class="gl-font-bold gl-text-default hover:gl-text-default"
       data-testid="title-container"
     >
       {{ subject.title }}
@@ -39,7 +39,7 @@ export default {
     <span>
       <gl-link
         :href="subject.webUrl"
-        class="gl-text-gray-900 hover:gl-text-gray-900"
+        class="gl-text-default hover:gl-text-default"
         data-testid="reference-container"
       >
         {{ issuableFullReference }}
diff --git a/app/assets/javascripts/time_tracking/components/timelogs_table.vue b/app/assets/javascripts/time_tracking/components/timelogs_table.vue
index d2adfc3fa1c..2e3a7cb8071 100644
--- a/app/assets/javascripts/time_tracking/components/timelogs_table.vue
+++ b/app/assets/javascripts/time_tracking/components/timelogs_table.vue
@@ -78,7 +78,7 @@ export default {
 
     <template #cell(user)="{ item: { user } }">
       <user-avatar-link
-        class="gl-flex gl-text-gray-900 hover:gl-text-gray-900"
+        class="gl-flex gl-text-default hover:gl-text-default"
         :link-href="user.webPath"
         :img-src="user.avatarUrl"
         :img-size="16"
diff --git a/app/assets/javascripts/todos/components/todo_item.vue b/app/assets/javascripts/todos/components/todo_item.vue
index bc474ea7750..2b3cbb6bac4 100644
--- a/app/assets/javascripts/todos/components/todo_item.vue
+++ b/app/assets/javascripts/todos/components/todo_item.vue
@@ -50,7 +50,7 @@ export default {
       :href="targetUrl"
       :data-track-label="trackingLabel"
       :data-track-action="$options.TRACK_ACTION"
-      class="gl-flex gl-flex-wrap gl-gap-x-2 !gl-text-gray-900 !gl-no-underline !gl-outline-none sm:gl-flex-nowrap sm:gl-items-center"
+      class="gl-flex gl-flex-wrap gl-gap-x-2 !gl-text-default !gl-no-underline !gl-outline-none sm:gl-flex-nowrap sm:gl-items-center"
     >
       <div
         class="gl-w-64 gl-flex-grow-2 gl-self-center gl-overflow-hidden gl-overflow-x-auto sm:gl-w-auto"
diff --git a/app/assets/javascripts/todos/components/todo_item_body.vue b/app/assets/javascripts/todos/components/todo_item_body.vue
index fc17aeda308..5d99b6e2d90 100644
--- a/app/assets/javascripts/todos/components/todo_item_body.vue
+++ b/app/assets/javascripts/todos/components/todo_item_body.vue
@@ -164,7 +164,7 @@ export default {
     </div>
     <div>
       <div v-if="showAuthorOnNote" class="gl-inline-flex gl-font-bold">
-        <gl-link v-if="todo.author" :href="todo.author.webUrl" class="!gl-text-gray-900">{{
+        <gl-link v-if="todo.author" :href="todo.author.webUrl" class="!gl-text-default">{{
           authorOnNote
         }}</gl-link>
         <span v-else>{{ $options.i18n.removed }}</span>
diff --git a/app/assets/javascripts/token_access/components/auth_log.vue b/app/assets/javascripts/token_access/components/auth_log.vue
index 5e2855d6675..92133985a65 100644
--- a/app/assets/javascripts/token_access/components/auth_log.vue
+++ b/app/assets/javascripts/token_access/components/auth_log.vue
@@ -194,7 +194,7 @@ export default {
               class="gl-mr-3"
               :size="24"
             />
-            <span class="gl-text-gray-900">{{ item.originProject.fullPath }}</span>
+            <span class="gl-text-default">{{ item.originProject.fullPath }}</span>
           </div>
         </template>
       </gl-table-lite>
diff --git a/app/assets/javascripts/usage_quotas/storage/components/project_list.vue b/app/assets/javascripts/usage_quotas/storage/components/project_list.vue
index 78020d81e8c..d43f20bae65 100644
--- a/app/assets/javascripts/usage_quotas/storage/components/project_list.vue
+++ b/app/assets/javascripts/usage_quotas/storage/components/project_list.vue
@@ -148,7 +148,7 @@ export default {
 
       <gl-link
         :href="getUsageQuotasUrl(project.webUrl)"
-        class="js-project-link !gl-text-gray-900 gl-break-anywhere"
+        class="js-project-link !gl-text-default gl-break-anywhere"
         data-testid="project-link"
       >
         {{ getProjectRelativePath(project.nameWithNamespace) }}
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline.vue b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline.vue
index 81b8d27e4b3..cb81ec737a5 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline.vue
@@ -290,7 +290,7 @@ export default {
               class="gl-flex gl-flex-wrap gl-items-center gl-justify-between"
             >
               <p
-                class="mr-pipeline-title !gl-m-0 !gl-mr-3 gl-self-start gl-font-bold gl-text-gray-900"
+                class="mr-pipeline-title !gl-m-0 !gl-mr-3 gl-self-start gl-font-bold gl-text-default"
               >
                 {{ pipeline.details.event_type_name }}
                 <gl-link :href="pipeline.path" class="pipeline-id" data-testid="pipeline-id"
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/new_ready_to_merge.vue b/app/assets/javascripts/vue_merge_request_widget/components/states/new_ready_to_merge.vue
index 9116882d7d9..38b640e8001 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/states/new_ready_to_merge.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/components/states/new_ready_to_merge.vue
@@ -37,7 +37,7 @@ export default {
 <template>
   <div class="mr-widget-body media">
     <status-icon status="success" />
-    <p class="media-body !gl-mb-0 gl-mt-1 gl-font-bold !gl-text-gray-900">
+    <p class="media-body !gl-mb-0 gl-mt-1 gl-font-bold !gl-text-default">
       <template v-if="canMerge">
         {{ __('Ready to merge!') }}
       </template>
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/nothing_to_merge.vue b/app/assets/javascripts/vue_merge_request_widget/components/states/nothing_to_merge.vue
index 008a472b818..11147411027 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/states/nothing_to_merge.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/components/states/nothing_to_merge.vue
@@ -24,7 +24,7 @@ export default {
   <div class="mr-widget-body media">
     <status-icon :status="statusEmpty" />
     <div>
-      <p class="media-body gl-mb-1 gl-mt-1 gl-font-bold !gl-text-gray-900">
+      <p class="media-body gl-mb-1 gl-mt-1 gl-font-bold !gl-text-default">
         {{ s__('mrWidgetNothingToMerge|Merge request contains no changes') }}
       </p>
       <p class="!gl-m-0 gl-text-subtle" data-testid="nothing-to-merge-body">
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/ready_to_merge.vue b/app/assets/javascripts/vue_merge_request_widget/components/states/ready_to_merge.vue
index c9fc1d5237f..86ca81e2dde 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/states/ready_to_merge.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/components/states/ready_to_merge.vue
@@ -783,7 +783,7 @@ export default {
               class="mr-widget-merge-details -gl-order-1 gl-w-full"
               data-testid="merged-status-content"
             >
-              <p v-if="showMergeDetailsHeader" class="gl-mb-2 gl-text-gray-900">
+              <p v-if="showMergeDetailsHeader" class="gl-mb-2 gl-text-default">
                 {{ __('Merge details') }}
               </p>
               <ul class="gl-mb-0 gl-ml-3 gl-pl-4 gl-text-subtle">
diff --git a/app/assets/javascripts/vue_shared/components/customizable_dashboard/dashboard_editor/available_visualizations_drawer.vue b/app/assets/javascripts/vue_shared/components/customizable_dashboard/dashboard_editor/available_visualizations_drawer.vue
index 3ab51e01ed7..55a5e5b6f17 100644
--- a/app/assets/javascripts/vue_shared/components/customizable_dashboard/dashboard_editor/available_visualizations_drawer.vue
+++ b/app/assets/javascripts/vue_shared/components/customizable_dashboard/dashboard_editor/available_visualizations_drawer.vue
@@ -153,7 +153,7 @@ export default {
 
     <div v-else>
       <div v-for="(category, key) in filteredCategorizedVisualizations" :key="key">
-        <div data-testid="category-title" class="gl-mb-4 gl-font-bold gl-text-gray-900">
+        <div data-testid="category-title" class="gl-mb-4 gl-font-bold gl-text-default">
           {{ category.title }}
         </div>
         <ul class="gl-mb-6 gl-list-none gl-p-0">
diff --git a/app/assets/javascripts/vue_shared/components/source_viewer/source_viewer.vue b/app/assets/javascripts/vue_shared/components/source_viewer/source_viewer.vue
index 18b363bb725..8aa0e6a0970 100644
--- a/app/assets/javascripts/vue_shared/components/source_viewer/source_viewer.vue
+++ b/app/assets/javascripts/vue_shared/components/source_viewer/source_viewer.vue
@@ -153,7 +153,7 @@ export default {
     >
       <codeowners-validation
         v-if="isCodeownersFile"
-        class="gl-text-gray-900"
+        class="gl-text-default"
         :current-ref="currentRef"
         :project-path="projectPath"
         :file-path="blob.path"
diff --git a/app/assets/javascripts/vue_shared/new_namespace/components/welcome.vue b/app/assets/javascripts/vue_shared/new_namespace/components/welcome.vue
index 2d6f8503fce..7015850dfc7 100644
--- a/app/assets/javascripts/vue_shared/new_namespace/components/welcome.vue
+++ b/app/assets/javascripts/vue_shared/new_namespace/components/welcome.vue
@@ -41,7 +41,7 @@ export default {
             <h3 class="gl-text-size-h2 gl-text-inherit">
               {{ panel.title }}
             </h3>
-            <p class="gl-text-gray-900">
+            <p class="gl-text-default">
               {{ panel.description }}
             </p>
           </div>
diff --git a/app/assets/javascripts/work_items/components/design_management/design_management_widget.vue b/app/assets/javascripts/work_items/components/design_management/design_management_widget.vue
index 9e62b2bdbb5..4c7e72d9147 100644
--- a/app/assets/javascripts/work_items/components/design_management/design_management_widget.vue
+++ b/app/assets/javascripts/work_items/components/design_management/design_management_widget.vue
@@ -260,7 +260,6 @@ export default {
       <gl-button
         v-if="isLatestVersion"
         category="tertiary"
-        class="!gl-text-gray-900"
         size="small"
         variant="link"
         :disabled="!hasDesigns"
diff --git a/app/assets/javascripts/work_items/components/design_management/design_preview/design_toolbar.vue b/app/assets/javascripts/work_items/components/design_management/design_preview/design_toolbar.vue
index 9999f0ee0b5..155e448f7d9 100644
--- a/app/assets/javascripts/work_items/components/design_management/design_preview/design_toolbar.vue
+++ b/app/assets/javascripts/work_items/components/design_management/design_preview/design_toolbar.vue
@@ -85,7 +85,7 @@ export default {
       <div class="gl-mr-3 gl-flex gl-overflow-hidden">
         <gl-skeleton-loader v-if="isLoading" :lines="1" />
         <h2 v-else class="gl-m-0 gl-flex gl-items-center gl-overflow-hidden gl-text-base">
-          <span class="gl-truncate gl-text-gray-900 gl-no-underline">
+          <span class="gl-truncate gl-text-heading gl-no-underline">
             {{ workItemTitle }}
           </span>
           <gl-icon name="chevron-right" class="gl-shrink-0" variant="disabled" />
diff --git a/app/assets/javascripts/work_items/components/shared/work_item_relationship_popover.vue b/app/assets/javascripts/work_items/components/shared/work_item_relationship_popover.vue
index 1e14a65ed1d..0e33075bd4f 100644
--- a/app/assets/javascripts/work_items/components/shared/work_item_relationship_popover.vue
+++ b/app/assets/javascripts/work_items/components/shared/work_item_relationship_popover.vue
@@ -98,7 +98,7 @@ export default {
           />
           <gl-link
             :href="workItem.webUrl"
-            class="gl-link gl-hyphens-auto gl-break-words gl-text-base gl-font-semibold gl-text-default hover:gl-text-gray-900"
+            class="gl-link gl-hyphens-auto gl-break-words gl-text-base gl-font-semibold gl-text-default hover:gl-text-default"
             @click.exact="$emit('click', $event)"
             @mouseover="$emit('mouseover')"
             @mouseout="$emit('mouseout')"
diff --git a/app/assets/javascripts/work_items/components/work_item_ancestors/disclosure_hierarchy_item.vue b/app/assets/javascripts/work_items/components/work_item_ancestors/disclosure_hierarchy_item.vue
index ccd9c8c3bd3..d6138fe0e65 100644
--- a/app/assets/javascripts/work_items/components/work_item_ancestors/disclosure_hierarchy_item.vue
+++ b/app/assets/javascripts/work_items/components/work_item_ancestors/disclosure_hierarchy_item.vue
@@ -45,7 +45,7 @@ export default {
     <gl-link
       :id="itemId"
       :href="item.webUrl"
-      class="disclosure-hierarchy-button gl-text-gray-900 hover:gl-no-underline active:!gl-no-underline"
+      class="disclosure-hierarchy-button hover:gl-no-underline active:!gl-no-underline"
       :class="{ 'gl-cursor-help': item.ancestorNotAvailable }"
     >
       <gl-icon v-if="shouldDisplayIcon(item.icon)" :name="item.icon" class="gl-mx-2 gl-shrink-0" />
diff --git a/app/assets/javascripts/work_items/components/work_item_development/work_item_development_mr_item.vue b/app/assets/javascripts/work_items/components/work_item_development/work_item_development_mr_item.vue
index e0b563ac623..0f848245e5a 100644
--- a/app/assets/javascripts/work_items/components/work_item_development/work_item_development_mr_item.vue
+++ b/app/assets/javascripts/work_items/components/work_item_development/work_item_development_mr_item.vue
@@ -64,7 +64,7 @@ export default {
   <div class="gl-mb-2 gl-flex gl-items-center gl-justify-between gl-gap-2">
     <gl-link
       :href="itemContent.webUrl"
-      class="gfm-merge_request gl-truncate gl-text-gray-900 hover:gl-text-gray-900 hover:gl-underline"
+      class="gfm-merge_request gl-truncate gl-text-default hover:gl-text-default hover:gl-underline"
       data-reference-type="merge_request"
       :data-project-path="projectPath"
       :data-iid="itemContent.iid"
diff --git a/app/assets/javascripts/work_items/components/work_item_milestone.vue b/app/assets/javascripts/work_items/components/work_item_milestone.vue
index 8773d8b44aa..d60b8defd86 100644
--- a/app/assets/javascripts/work_items/components/work_item_milestone.vue
+++ b/app/assets/javascripts/work_items/components/work_item_milestone.vue
@@ -241,7 +241,7 @@ export default {
       <div v-if="item.title">{{ item.title }}</div>
     </template>
     <template #readonly>
-      <gl-link class="!gl-text-gray-900" :href="localMilestone.webPath">
+      <gl-link class="!gl-text-default" :href="localMilestone.webPath">
         {{ localMilestone.title }}{{ expired }}
       </gl-link>
     </template>
diff --git a/app/assets/javascripts/work_items/components/work_item_parent.vue b/app/assets/javascripts/work_items/components/work_item_parent.vue
index 0a44a9aad92..7eab522a08e 100644
--- a/app/assets/javascripts/work_items/components/work_item_parent.vue
+++ b/app/assets/javascripts/work_items/components/work_item_parent.vue
@@ -285,7 +285,7 @@ export default {
       <gl-link
         v-if="localSelectedItem"
         data-testid="work-item-parent-link"
-        class="gl-inline-block gl-max-w-full gl-overflow-hidden gl-text-ellipsis gl-whitespace-nowrap gl-align-top gl-text-gray-900"
+        class="gl-inline-block gl-max-w-full gl-overflow-hidden gl-text-ellipsis gl-whitespace-nowrap gl-align-top gl-text-default"
         :href="parentWebUrl"
         >{{ listboxText }}</gl-link
       >
diff --git a/app/components/pajamas/single_stat_component.html.haml b/app/components/pajamas/single_stat_component.html.haml
index 3c21f4fb1bd..4f14e13bc88 100644
--- a/app/components/pajamas/single_stat_component.html.haml
+++ b/app/components/pajamas/single_stat_component.html.haml
@@ -4,7 +4,7 @@
       = sprite_icon(@title_icon, css_class: 'gl-mr-2')
     %span.gl-text-base.gl-font-normal.gl-text-subtle{ data: { testid: 'title-text' } }
       = title || @title
-  .gl-single-stat-content.gl-flex.gl-items-baseline.gl-font-bold.gl-text-gray-900.gl-mb-4
+  .gl-single-stat-content.gl-flex.gl-items-baseline.gl-font-bold.gl-text-default.gl-mb-4
     %span.gl-single-stat-number.gl-leading-1{ class: unit_class, data: { testid: 'displayValue' } }
       %span{ data: { testid: @stat_value_testid } }
         = stat_value || @stat_value
diff --git a/app/views/admin/dashboard/stats.html.haml b/app/views/admin/dashboard/stats.html.haml
index 4c419fcfb35..2a85fd6e355 100644
--- a/app/views/admin/dashboard/stats.html.haml
+++ b/app/views/admin/dashboard/stats.html.haml
@@ -11,14 +11,14 @@
 %table.gl-table.gl-text-subtle.gl-w-full
   = render_if_exists 'admin/dashboard/stats_active_users_row', users_statistics: @users_statistics
 
-  %tr.gl-bg-gray-10.gl-text-gray-900
+  %tr.gl-bg-gray-10.gl-text-default
     %td{ class: '!gl-p-5' }
       %strong
         = s_('AdminArea|Blocked users')
     %td.gl-text-right{ class: '!gl-p-5' }
       %strong
         = @users_statistics&.blocked
-  %tr.gl-bg-gray-10.gl-text-gray-900
+  %tr.gl-bg-gray-10.gl-text-default
     %td{ class: '!gl-p-5' }
       %strong
         = s_('AdminArea|Total users')
diff --git a/app/views/projects/_invite_members_empty_project.html.haml b/app/views/projects/_invite_members_empty_project.html.haml
index eaae27fb522..efe9dc71dc9 100644
--- a/app/views/projects/_invite_members_empty_project.html.haml
+++ b/app/views/projects/_invite_members_empty_project.html.haml
@@ -1,4 +1,4 @@
-%p.gl-font-bold.gl-text-gray-900.gl-mt-0.-gl-mt-1.gl-mb-3{ data: { testid: 'invite-member-section',
+%p.gl-font-bold.gl-text-default.gl-mt-0.-gl-mt-1.gl-mb-3{ data: { testid: 'invite-member-section',
   track_label: 'invite_members_empty_project',
   track_action: 'render' } }
   = s_('InviteMember|Invite your team')
diff --git a/app/views/users/_profile_basic_info.html.haml b/app/views/users/_profile_basic_info.html.haml
index 7dd131dbe2c..c0e9b6441df 100644
--- a/app/views/users/_profile_basic_info.html.haml
+++ b/app/views/users/_profile_basic_info.html.haml
@@ -1,4 +1,4 @@
-.gl-text-gray-900
+.gl-text-default
   = render 'middle_dot_divider', stacking: true do
     @#{@user.username}
   - if can?(current_user, :read_user_profile, @user)
diff --git a/app/views/users/_profile_sidebar.html.haml b/app/views/users/_profile_sidebar.html.haml
index 20303dbd439..e4e80725772 100644
--- a/app/views/users/_profile_sidebar.html.haml
+++ b/app/views/users/_profile_sidebar.html.haml
@@ -48,37 +48,37 @@
                 %span= s_('Member since %{date}') % { date: l(@user.created_at.to_date, format: :long) }
 
             - if has_contact_info?(@user)
-              .gl-text-gray-900
+              .gl-text-default
                 %h2.gl-text-base.gl-mb-2.gl-mt-4= s_('UserProfile|Contact')
                 - if @user.website_url.present?
                   .gl-flex.gl-gap-2.gl-mb-2
                     = sprite_icon('earth', css_class: 'gl-fill-icon-subtle gl-mt-1 flex-shrink-0')
-                    = link_to @user.short_website_url, @user.full_website_url, class: 'gl-text-gray-900', target: '_blank', rel: 'me noopener noreferrer nofollow', itemprop: 'url'
+                    = link_to @user.short_website_url, @user.full_website_url, class: 'gl-text-default', target: '_blank', rel: 'me noopener noreferrer nofollow', itemprop: 'url'
                 - if display_public_email?(@user)
                   .gl-flex.gl-gap-2.gl-mb-2
                     = sprite_icon('mail', css_class: 'gl-fill-icon-subtle gl-mt-1 flex-shrink-0')
-                    = link_to @user.public_email, "mailto:#{@user.public_email}", class: 'gl-text-gray-900', itemprop: 'email'
+                    = link_to @user.public_email, "mailto:#{@user.public_email}", class: 'gl-text-default', itemprop: 'email'
                 - if @user.skype.present?
                   .gl-flex.gl-gap-2.gl-mb-2
                     = sprite_icon('skype', css_class: 'gl-fill-icon-subtle gl-mt-1 flex-shrink-0')
-                    = link_to @user.skype, "skype:#{@user.skype}", class: 'gl-text-gray-900', title: "Skype"
+                    = link_to @user.skype, "skype:#{@user.skype}", class: 'gl-text-default', title: "Skype"
                 - if @user.linkedin.present?
                   .gl-flex.gl-gap-2.gl-mb-2
                     = sprite_icon('linkedin', css_class: 'gl-fill-icon-subtle gl-mt-1 flex-shrink-0')
-                    = link_to linkedin_name(@user), linkedin_url(@user), class: 'gl-text-gray-900', title: "LinkedIn", target: '_blank', rel: 'noopener noreferrer nofollow'
+                    = link_to linkedin_name(@user), linkedin_url(@user), class: 'gl-text-default', title: "LinkedIn", target: '_blank', rel: 'noopener noreferrer nofollow'
                 - if @user.twitter.present?
                   .gl-flex.gl-gap-2.gl-mb-2
                     = sprite_icon('x', css_class: 'gl-fill-icon-subtle gl-mt-1 flex-shrink-0')
-                    = link_to @user.twitter, twitter_url(@user), class: 'gl-text-gray-900', title: _("X (formerly Twitter)"), target: '_blank', rel: 'noopener noreferrer nofollow'
+                    = link_to @user.twitter, twitter_url(@user), class: 'gl-text-default', title: _("X (formerly Twitter)"), target: '_blank', rel: 'noopener noreferrer nofollow'
                 - if @user.bluesky.present?
                   .gl-flex.gl-gap-2.gl-mb-2
                     = sprite_icon('at', css_class: 'gl-fill-icon-subtle gl-mt-1 flex-shrink-0')
-                    = link_to @user.bluesky, bluesky_url(@user), class: 'gl-text-gray-900', title: "Bluesky", target: '_blank', rel: 'noopener noreferrer nofollow'
+                    = link_to @user.bluesky, bluesky_url(@user), class: 'gl-text-default', title: "Bluesky", target: '_blank', rel: 'noopener noreferrer nofollow'
                 - if @user.mastodon.present?
                   .gl-flex.gl-gap-2.gl-mb-2
                     = sprite_icon('mastodon', css_class: 'gl-fill-icon-subtle gl-mt-1 flex-shrink-0')
-                    = link_to @user.mastodon, mastodon_url(@user), class: 'gl-text-gray-900', title: "Mastodon", target: '_blank', rel: 'noopener noreferrer nofollow me'
+                    = link_to @user.mastodon, mastodon_url(@user), class: 'gl-text-default', title: "Mastodon", target: '_blank', rel: 'noopener noreferrer nofollow me'
                 - if @user.discord.present?
                   .gl-flex.gl-gap-2.gl-mb-2
                     = sprite_icon('discord', css_class: 'gl-fill-icon-subtle gl-mt-1 flex-shrink-0')
-                    = link_to @user.discord, discord_url(@user), class: 'gl-text-gray-900', title: "Discord", target: '_blank', rel: 'noopener noreferrer nofollow'
+                    = link_to @user.discord, discord_url(@user), class: 'gl-text-default', title: "Discord", target: '_blank', rel: 'noopener noreferrer nofollow'
diff --git a/spec/frontend/design_management/components/toolbar/__snapshots__/index_spec.js.snap b/spec/frontend/design_management/components/toolbar/__snapshots__/index_spec.js.snap
index 3bc9fab5d40..84d6f989197 100644
--- a/spec/frontend/design_management/components/toolbar/__snapshots__/index_spec.js.snap
+++ b/spec/frontend/design_management/components/toolbar/__snapshots__/index_spec.js.snap
@@ -14,7 +14,7 @@ exports[`Design management toolbar component renders design and updated data 1`]
         class="gl-flex gl-items-center gl-m-0 gl-overflow-hidden gl-text-base"
       >
         <span
-          class="gl-no-underline gl-text-gray-900 gl-truncate"
+          class="gl-no-underline gl-text-heading gl-truncate"
         >
           My precious issue
         </span>
diff --git a/spec/frontend/jira_connect/subscriptions/components/__snapshots__/group_item_name_spec.js.snap b/spec/frontend/jira_connect/subscriptions/components/__snapshots__/group_item_name_spec.js.snap
index 366547c86ab..ee80d5d0103 100644
--- a/spec/frontend/jira_connect/subscriptions/components/__snapshots__/group_item_name_spec.js.snap
+++ b/spec/frontend/jira_connect/subscriptions/components/__snapshots__/group_item_name_spec.js.snap
@@ -24,7 +24,7 @@ exports[`GroupItemName template matches the snapshot 1`] = `
   </div>
   <div>
     <span
-      class="!gl-text-gray-900 gl-font-bold gl-mr-3"
+      class="!gl-text-default gl-font-bold gl-mr-3"
     >
       Gitlab Org
     </span>
diff --git a/spec/frontend/merge_request_dashboard/components/__snapshots__/merge_request_spec.js.snap b/spec/frontend/merge_request_dashboard/components/__snapshots__/merge_request_spec.js.snap
index 49b015c82e0..abc30c4309c 100644
--- a/spec/frontend/merge_request_dashboard/components/__snapshots__/merge_request_spec.js.snap
+++ b/spec/frontend/merge_request_dashboard/components/__snapshots__/merge_request_spec.js.snap
@@ -24,7 +24,7 @@ exports[`Merge request dashboard merge request component renders template 1`] =
     class="gl-align-top gl-px-3 gl-py-4"
   >
     <gl-link-stub
-      class="gl-font-bold gl-text-default hover:gl-text-gray-900"
+      class="gl-font-bold gl-text-default hover:gl-text-default"
     >
       Merge request title
     </gl-link-stub>
diff --git a/spec/frontend/search/sidebar/components/scope_sidebar_navigation_spec.js b/spec/frontend/search/sidebar/components/scope_sidebar_navigation_spec.js
index 7c0843bf1ad..aa1daf8c759 100644
--- a/spec/frontend/search/sidebar/components/scope_sidebar_navigation_spec.js
+++ b/spec/frontend/search/sidebar/components/scope_sidebar_navigation_spec.js
@@ -46,7 +46,7 @@ describe('ScopeSidebarNavigation', () => {
   const findNavItems = () => wrapper.findAllComponents(NavItem);
   const findNavItemActive = () => wrapper.find('[aria-current=page]');
   const findNavItemActiveLabel = () =>
-    findNavItemActive().find('[class="gl-grow gl-text-gray-900"]');
+    findNavItemActive().find('[data-testid="nav-item-link-label"]');
 
   describe('scope navigation', () => {
     beforeEach(() => {
diff --git a/spec/frontend/vue_merge_request_widget/components/states/__snapshots__/new_ready_to_merge_spec.js.snap b/spec/frontend/vue_merge_request_widget/components/states/__snapshots__/new_ready_to_merge_spec.js.snap
index f19d208cc76..8957a9fa51c 100644
--- a/spec/frontend/vue_merge_request_widget/components/states/__snapshots__/new_ready_to_merge_spec.js.snap
+++ b/spec/frontend/vue_merge_request_widget/components/states/__snapshots__/new_ready_to_merge_spec.js.snap
@@ -8,7 +8,7 @@ exports[`New ready to merge state component renders permission text if canMerge
     status="success"
   />
   <p
-    class="!gl-mb-0 !gl-text-gray-900 gl-font-bold gl-mt-1 media-body"
+    class="!gl-mb-0 !gl-text-default gl-font-bold gl-mt-1 media-body"
   >
     Ready to merge by members who can write to the target branch.
   </p>
@@ -23,7 +23,7 @@ exports[`New ready to merge state component renders permission text if canMerge
     status="success"
   />
   <p
-    class="!gl-mb-0 !gl-text-gray-900 gl-font-bold gl-mt-1 media-body"
+    class="!gl-mb-0 !gl-text-default gl-font-bold gl-mt-1 media-body"
   >
     Ready to merge!
   </p>