diff --git a/components/search/SearchWidget.vue b/components/search/SearchWidget.vue
index 2a3801a0..c210431a 100644
--- a/components/search/SearchWidget.vue
+++ b/components/search/SearchWidget.vue
@@ -52,7 +52,7 @@ const activate = () => {
 
 <template>
   <div ref="el" relative px4 py2 group>
-    <div bg-base border="~ base" h10 rounded-full flex="~ row" items-center relative outline-primary outline-1 focus-within:outline>
+    <div bg-base border="~ base" h10 rounded-full flex="~ row" items-center relative focus-within:box-shadow-outline>
       <div i-ri:search-2-line mx4 absolute pointer-events-none text-secondary mt="1px" />
       <input
         ref="input"
diff --git a/unocss.config.ts b/unocss.config.ts
index 4e7e6a6c..db0ad0f4 100644
--- a/unocss.config.ts
+++ b/unocss.config.ts
@@ -103,5 +103,6 @@ export default defineConfig({
       res += `\n${res.replace('{scrollbar-width:none;}', '::-webkit-scrollbar{display: none;}')}`
       return res
     }],
+    ['box-shadow-outline', { 'box-shadow': '0 0 0 1px var(--c-primary)' }],
   ],
 })