diff --git a/example/src/sites/assets/styles/md-style.scss b/example/src/sites/assets/styles/md-style.scss
index e4ec0301..f7ab264d 100644
--- a/example/src/sites/assets/styles/md-style.scss
+++ b/example/src/sites/assets/styles/md-style.scss
@@ -16,7 +16,7 @@
 
 	a {
 		margin: 0 1px;
-		color: #646cff;
+		color: #0da6e9;
 		text-decoration-line: underline;
 
 		&:hover {
diff --git a/example/src/sites/assets/styles/theme.scss b/example/src/sites/assets/styles/theme.scss
index 7371bdbf..001fb7cd 100644
--- a/example/src/sites/assets/styles/theme.scss
+++ b/example/src/sites/assets/styles/theme.scss
@@ -11,7 +11,7 @@
 	--line-light: rgba(60, 60, 67, 0.12);
 	--text-font-color-light: rgba(60, 60, 67, 0.92);
 
-	--brand-color: #646cff;
+	--brand-color: #0da6e9;
 
 	--brand-color-light: #bcc0ff; // hover color
 
@@ -122,7 +122,7 @@ html.dark {
 	--line-light: rgba(60, 60, 67, 0.12);
 	--text-font-color-light: rgba(60, 60, 67, 0.92);
 	--text-code-font-color: #c9def1;
-	--brand-color: #646cff;
+	--brand-color: #0da6e9;
 	--brand-color-light: #bcc0ff; // hover color
 	--mute-light: #313136; // tag background
 	--line-light: rgba(82, 82, 89, 0.32);
@@ -152,7 +152,7 @@ html.dark {
 	.flyout-menu .menu-link {
 		color: rgba(255, 255, 255, 0.87);
 		&:hover {
-			color: #646cff;
+			color: #0da6e9;
 		}
 	}
 
diff --git a/example/src/sites/doc/components/Nav.vue b/example/src/sites/doc/components/Nav.vue
index d60ed8d5..54232648 100644
--- a/example/src/sites/doc/components/Nav.vue
+++ b/example/src/sites/doc/components/Nav.vue
@@ -245,7 +245,7 @@ export default defineComponent({
 
 				&:hover {
 					a {
-						color: #646cff;
+						color: #0da6e9;
 					}
 				}
 
@@ -256,7 +256,7 @@ export default defineComponent({
 
 					&.router-link-active,
 					&.active {
-						color: #646cff;
+						color: #0da6e9;
 					}
 
 					b {