diff --git a/packages/dify-ui/src/segmented-control/__tests__/index.spec.tsx b/packages/dify-ui/src/segmented-control/__tests__/index.spec.tsx
index cf01712fb5..46adc5122d 100644
--- a/packages/dify-ui/src/segmented-control/__tests__/index.spec.tsx
+++ b/packages/dify-ui/src/segmented-control/__tests__/index.spec.tsx
@@ -25,7 +25,7 @@ describe('SegmentedControl wrappers', () => {
     await expect.element(screen.getByRole('button', { name: 'One' })).toHaveClass(
       'data-pressed:bg-components-segmented-control-item-active-bg',
       'data-pressed:text-text-accent-light-mode-only',
-      'focus-visible:z-10',
+      'focus-visible:ring-inset',
     )
   })
 
diff --git a/packages/dify-ui/src/segmented-control/index.tsx b/packages/dify-ui/src/segmented-control/index.tsx
index ceb3454cc6..ba347b58f1 100644
--- a/packages/dify-ui/src/segmented-control/index.tsx
+++ b/packages/dify-ui/src/segmented-control/index.tsx
@@ -33,7 +33,7 @@ export function SegmentedControlItem<Value extends string = string>({
 }: SegmentedControlItemProps<Value>) {
   return (
     <BaseToggle
-      className={cn('relative flex h-7 min-w-0 touch-manipulation items-center justify-center gap-0.5 overflow-hidden whitespace-nowrap rounded-lg border-[0.5px] border-transparent px-2 py-1 system-sm-medium text-text-secondary transition-colors duration-150 hover:bg-state-base-hover hover:text-text-secondary focus-visible:z-10 focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-state-accent-solid data-pressed:border-components-segmented-control-item-active-border data-pressed:bg-components-segmented-control-item-active-bg data-pressed:text-text-accent-light-mode-only data-pressed:shadow-xs data-pressed:shadow-shadow-shadow-3 data-disabled:cursor-not-allowed data-disabled:bg-transparent data-disabled:text-text-disabled data-disabled:shadow-none data-disabled:hover:bg-transparent data-disabled:hover:text-text-disabled motion-reduce:transition-none', className)}
+      className={cn('relative flex h-7 min-w-0 touch-manipulation items-center justify-center gap-0.5 overflow-hidden whitespace-nowrap rounded-lg border-[0.5px] border-transparent px-2 py-1 system-sm-medium text-text-secondary transition-colors duration-150 hover:bg-state-base-hover hover:text-text-secondary focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-state-accent-solid focus-visible:ring-inset data-pressed:border-components-segmented-control-item-active-border data-pressed:bg-components-segmented-control-item-active-bg data-pressed:text-text-accent-light-mode-only data-pressed:shadow-xs data-pressed:shadow-shadow-shadow-3 data-disabled:cursor-not-allowed data-disabled:bg-transparent data-disabled:text-text-disabled data-disabled:shadow-none data-disabled:hover:bg-transparent data-disabled:hover:text-text-disabled motion-reduce:transition-none', className)}
       {...props}
     />
   )