diff --git a/server/ui-src/components/AboutMailpit.vue b/server/ui-src/components/AboutMailpit.vue
index d22950c..17a7250 100644
--- a/server/ui-src/components/AboutMailpit.vue
+++ b/server/ui-src/components/AboutMailpit.vue
@@ -130,7 +130,7 @@ export default {
 									<div class="col-6">
 										<div class="card border-secondary text-center">
 											<div class="card-header">Database size</div>
-											<div class="card-body text-secondary">
+											<div class="card-body text-muted">
 												<h5 class="card-title">{{ getFileSize(mailbox.appInfo.DatabaseSize) }}
 												</h5>
 											</div>
@@ -139,7 +139,7 @@ export default {
 									<div class="col-6">
 										<div class="card border-secondary text-center">
 											<div class="card-header">RAM usage</div>
-											<div class="card-body text-secondary">
+											<div class="card-body text-muted">
 												<h5 class="card-title">
 													{{ getFileSize(mailbox.appInfo.RuntimeStats.Memory) }}
 												</h5>
@@ -157,7 +157,7 @@ export default {
 											Refresh
 										</button>
 									</div>
-									<div class="card-body text-secondary">
+									<div class="card-body text-muted">
 										<table class="table table-sm table-borderless mb-0">
 											<tbody>
 												<tr>
@@ -182,7 +182,7 @@ export default {
 													</td>
 													<td>
 														{{ formatNumber(mailbox.appInfo.RuntimeStats.SMTPAccepted) }}
-														<small class="text-secondary">
+														<small class="text-muted">
 															({{
 																getFileSize(mailbox.appInfo.RuntimeStats.SMTPAcceptedSize)
 															}})
diff --git a/server/ui-src/components/AjaxLoader.vue b/server/ui-src/components/AjaxLoader.vue
index 237a4d5..80e8f58 100644
--- a/server/ui-src/components/AjaxLoader.vue
+++ b/server/ui-src/components/AjaxLoader.vue
@@ -9,7 +9,7 @@ export default {
 <template>
 	<div class="loader" v-if="loading > 0">
 		<div class="d-flex justify-content-center align-items-center h-100">
-			<div class="spinner-border text-secondary" role="status">
+			<div class="spinner-border text-muted" role="status">
 				<span class="visually-hidden">Loading...</span>
 			</div>
 		</div>
diff --git a/server/ui-src/components/ListMessages.vue b/server/ui-src/components/ListMessages.vue
index a81f85b..2f34582 100644
--- a/server/ui-src/components/ListMessages.vue
+++ b/server/ui-src/components/ListMessages.vue
@@ -176,7 +176,7 @@ export default {
 	</template>
 	<template v-else>
 		<p class="text-center mt-5">
-			<span v-if="loadingMessages > 0" class="text-secondary">
+			<span v-if="loadingMessages > 0" class="text-muted">
 				Loading messages...
 			</span>
 			<template v-else-if="getSearch()">No results for <code>{{ getSearch() }}</code></template>
diff --git a/server/ui-src/components/message/HTMLCheck.vue b/server/ui-src/components/message/HTMLCheck.vue
index a96b593..68cb899 100644
--- a/server/ui-src/components/message/HTMLCheck.vue
+++ b/server/ui-src/components/message/HTMLCheck.vue
@@ -323,7 +323,7 @@ export default {
 									{{ round2dm(summary.Total.Unsupported) }}% not supported
 								</span>
 							</p>
-							<p class="small text-secondary">
+							<p class="small text-muted">
 								calculated from {{ formatNumber(check.Total.Tests) }} tests
 							</p>
 						</template>
@@ -343,7 +343,7 @@ export default {
 						<input class="form-check-input" type="checkbox" role="switch" :value="k" v-model="platforms"
 							:aria-label="p" :id="'Check_' + k">
 						<label class="form-check-label" :for="'Check_' + k"
-							:class="platforms.indexOf(k) !== -1 ? '' : 'text-secondary'" :title="families(k).join(', ')"
+							:class="platforms.indexOf(k) !== -1 ? '' : 'text-muted'" :title="families(k).join(', ')"
 							data-bs-toggle="tooltip" :data-bs-title="families(k).join(', ')">
 							{{ p }}
 						</label>
@@ -451,7 +451,7 @@ export default {
 				</div>
 			</div>
 
-			<p class="text-center text-secondary small mt-4">
+			<p class="text-center text-muted small mt-4">
 				Scores based on <b>{{ check.Total.Tests }}</b> tests of HTML and CSS properties using
 				compatibility data from <a href="https://www.caniemail.com/" target="_blank">caniemail.com</a>.
 			</p>
diff --git a/server/ui-src/components/message/LinkCheck.vue b/server/ui-src/components/message/LinkCheck.vue
index 51e3cd6..e4af48b 100644
--- a/server/ui-src/components/message/LinkCheck.vue
+++ b/server/ui-src/components/message/LinkCheck.vue
@@ -194,7 +194,7 @@ export default {
 		</div>
 
 		<div v-if="!check">
-			<p class="text-secondary">
+			<p class="text-muted">
 				Link check scans your email text &amp; HTML for unique links, testing the response status codes.
 				This includes links to images and remote CSS stylesheets.
 			</p>
@@ -219,7 +219,7 @@ export default {
 			<div class="card mb-3">
 				<div class="card-header h4" :class="s.Class">
 					Status {{ s.StatusCode }}
-					<small v-if="s.Status != ''" class="ms-2 small text-secondary">({{ s.Status }})</small>
+					<small v-if="s.Status != ''" class="ms-2 small text-muted">({{ s.Status }})</small>
 				</div>
 				<ul class="list-group list-group-flush">
 					<li v-for="u in s.URLS" class="list-group-item">
diff --git a/server/ui-src/components/message/Message.vue b/server/ui-src/components/message/Message.vue
index 089c8b7..0ec8319 100644
--- a/server/ui-src/components/message/Message.vue
+++ b/server/ui-src/components/message/Message.vue
@@ -438,7 +438,7 @@ export default {
 							:class="showUnsubscribe ? '' : 'd-none'">
 							<th>Unsubscribe</th>
 							<td>
-								<span v-if="message.ListUnsubscribe.Links.length" class="text-secondary small me-2">
+								<span v-if="message.ListUnsubscribe.Links.length" class="text-muted small me-2">
 									<template v-for="(u, i) in message.ListUnsubscribe.Links">
 										<template v-if="i > 0">, </template>
 										&lt;{{ u }}&gt;