diff --git a/apps/web/src/components/settings/ExpandableText.tsx b/apps/web/src/components/settings/ExpandableText.tsx
index de18739e5090bebe63d69b0d680bb21f6dcc2a82..fa5fb94aadd1045b02ec290b25cfdcfc5406e682 100644
--- a/apps/web/src/components/settings/ExpandableText.tsx
+++ b/apps/web/src/components/settings/ExpandableText.tsx
@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useId, useState } from "react";
 
 import { cn } from "../../lib/utils";
 
@@ -17,12 +17,14 @@ export function ExpandableText({
   collapsedClassName?: string;
   expandLabel?: string;
 }) {
+  const textId = useId();
   const [expanded, setExpanded] = useState(false);
   const canExpand = text.length > 180 || text.includes("\n");
 
   return (
     <div className={cn("min-w-0", className)}>
       <div
+        id={textId}
         className={cn(
           "whitespace-pre-wrap break-words",
           !expanded && canExpand ? collapsedClassName : null,
@@ -33,6 +35,8 @@ export function ExpandableText({
       {canExpand ? (
         <button
           type="button"
+          aria-expanded={expanded}
+          aria-controls={textId}
           className="cursor-pointer mt-1 text-[11px] font-medium text-foreground/70 underline-offset-2 hover:text-foreground hover:underline"
           onClick={() => setExpanded((value) => !value)}
         >