diff --git a/src/components/AmbassadorButton.tsx b/src/components/AmbassadorButton.tsx
index dbc306a..75313b7 100644
--- a/src/components/AmbassadorButton.tsx
+++ b/src/components/AmbassadorButton.tsx
@@ -18,7 +18,7 @@ export default function AmbassadorButton(props: AmbassadorButtonProps) {
   return (
     <button
       className={classes(
-        "flex shrink-0 flex-col items-center justify-start rounded-lg bg-alveus-green text-center shadow-lg outline-highlight transition-[outline,filter] hover:outline hover:brightness-125 focus:outline",
+        "flex shrink-0 flex-col items-center justify-start rounded-lg bg-alveus-green text-center shadow-lg outline-highlight transition-[outline,filter] hover:outline-3 hover:brightness-125 focus:outline-3",
         className,
       )}
       id={ambassadorKey}
diff --git a/src/components/AmbassadorCard.tsx b/src/components/AmbassadorCard.tsx
index aedcf40..63eedcd 100644
--- a/src/components/AmbassadorCard.tsx
+++ b/src/components/AmbassadorCard.tsx
@@ -243,7 +243,7 @@ export default function AmbassadorCard(props: AmbassadorCardProps) {
                 <h3 className={headingClass}>Conservation Status</h3>
                 <IconInfo
                   size={20}
-                  className="rounded-full text-alveus-green-400 outline-highlight transition-[outline] hover:outline"
+                  className="rounded-full text-alveus-green-400 outline-highlight transition-[outline] hover:outline-3"
                 />
               </div>
             </Tooltip>
diff --git a/src/pages/overlay/components/Buttons.tsx b/src/pages/overlay/components/Buttons.tsx
index b6a9e82..d2c5218 100644
--- a/src/pages/overlay/components/Buttons.tsx
+++ b/src/pages/overlay/components/Buttons.tsx
@@ -47,9 +47,9 @@ export default function Buttons<T extends ButtonsOptions = ButtonsOptions>(
           <button
             onClick={option.onClick}
             className={classes(
-              "flex cursor-pointer items-center justify-center rounded-lg bg-alveus-green p-2 shadow-sm outline-highlight transition-[outline,filter] hover:outline hover:brightness-125 focus:outline",
+              "flex cursor-pointer items-center justify-center rounded-lg bg-alveus-green p-2 shadow-sm outline-highlight transition-[outline,filter] hover:outline-3 hover:brightness-125 focus:outline-3",
               option.type === "primary" ? "h-16 w-16" : "h-12 w-12",
-              option.active && "outline",
+              option.active && "outline-3",
               // If the previous type is not the same, add a margin
               idx > 0 &&
                 optionsWithOnClick[idx - 1].type !== option.type &&
diff --git a/src/pages/overlay/components/Toggle.tsx b/src/pages/overlay/components/Toggle.tsx
index e373ef7..b2587e0 100644
--- a/src/pages/overlay/components/Toggle.tsx
+++ b/src/pages/overlay/components/Toggle.tsx
@@ -23,7 +23,7 @@ export default function Toggle(props: ToggleProps) {
       <span className="relative">
         <input
           type="checkbox"
-          className="peer block h-6 w-6 cursor-pointer appearance-none rounded-lg border-none bg-alveus-tan-100 outline-highlight transition-[outline] group-focus-within:outline group-hover:outline checked:bg-alveus-tan-200"
+          className="peer block h-6 w-6 cursor-pointer appearance-none rounded-lg border-none bg-alveus-tan-100 outline-highlight transition-[outline] group-focus-within:outline-3 group-hover:outline-3 checked:bg-alveus-tan-200"
           onChange={onChangeNative}
           checked={value}
         />
diff --git a/src/pages/overlay/components/overlay/Ambassadors.tsx b/src/pages/overlay/components/overlay/Ambassadors.tsx
index c46d2c1..a607552 100644
--- a/src/pages/overlay/components/overlay/Ambassadors.tsx
+++ b/src/pages/overlay/components/overlay/Ambassadors.tsx
@@ -130,7 +130,7 @@ export default function Ambassadors(props: OverlayOptionProps) {
               }}
               className={classes(
                 "w-full",
-                activeAmbassador.key === key && "outline outline-highlight",
+                activeAmbassador.key === key && "outline-3 outline-highlight",
               )}
             />
           ))}
diff --git a/src/pages/panel/components/Nav.tsx b/src/pages/panel/components/Nav.tsx
index ff94a5d..55f400e 100644
--- a/src/pages/panel/components/Nav.tsx
+++ b/src/pages/panel/components/Nav.tsx
@@ -21,7 +21,7 @@ export default function Nav() {
       >
         <IconInfo
           size={20}
-          className="rounded-full outline-highlight transition-[outline] group-hover:outline"
+          className="rounded-full outline-highlight transition-[outline] group-hover:outline-3"
         />
       </button>