diff --git a/packages/frontend/@n8n/design-system/src/components/AskAssistantChat/__snapshots__/AskAssistantChat.test.ts.snap b/packages/frontend/@n8n/design-system/src/components/AskAssistantChat/__snapshots__/AskAssistantChat.test.ts.snap
index d6c9c2fe59e..22640a0ff28 100644
--- a/packages/frontend/@n8n/design-system/src/components/AskAssistantChat/__snapshots__/AskAssistantChat.test.ts.snap
+++ b/packages/frontend/@n8n/design-system/src/components/AskAssistantChat/__snapshots__/AskAssistantChat.test.ts.snap
@@ -1,90 +1,5 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`AskAssistantChat > does not render retry button if no error is present 1`] = `
-<div>
-  <div
-    class="container"
-  >
-    <div
-      class="header"
-    >
-      <div
-        class="chatTitle"
-      >
-        <div
-          class="headerText"
-        >
-          <assistant-icon-stub
-            size="large"
-            theme="default"
-          />
-          <assistant-text-stub
-            size="large"
-            text="assistantChat.aiAssistantLabel"
-          />
-        </div>
-        
-        
-      </div>
-      <div
-        class="back"
-        data-test-id="close-chat-button"
-      >
-        <n8n-icon-stub
-          color="text-base"
-          icon="arrow-right"
-          spin="false"
-        />
-      </div>
-    </div>
-    <div
-      class="body"
-    >
-      <div
-        class="messages"
-      >
-        <div>
-          
-          <data
-            data-test-id="chat-message-assistant"
-          >
-            <div
-              data-test-id="message-wrapper-stub"
-              is-first-of-role="true"
-              is-last-message="true"
-              streaming="false"
-              user="[object Object]"
-            >
-              {"id":"1","type":"text","role":"assistant","content":"Hi Max! Here is my top solution to fix the error in your **Transform data** node👇","read":false}
-            </div>
-            <!--v-if-->
-          </data>
-          
-        </div>
-        <!--v-if-->
-      </div>
-    </div>
-    <div
-      class="inputWrapper"
-      data-test-id="chat-input-wrapper"
-    >
-      <n8n-prompt-input-stub
-        data-test-id="chat-input"
-        disabled="false"
-        maxlength="1000"
-        maxlinesbeforescroll="6"
-        minlines="1"
-        modelvalue=""
-        placeholder="assistantChat.inputPlaceholder"
-        refocusaftersend="true"
-        showaskownertooltip="false"
-        streaming="false"
-      />
-    </div>
-  </div>
-</div>
-`;
-
 exports[`AskAssistantChat > limits maximum input length when maxCharacterLength prop is specified 1`] = `
 <div>
   <div
diff --git a/packages/frontend/@n8n/design-system/src/components/InlineAskAssistantButton/InlineAskAssistantButton.vue b/packages/frontend/@n8n/design-system/src/components/InlineAskAssistantButton/InlineAskAssistantButton.vue
index 49b6d4b3257..46c8019b817 100644
--- a/packages/frontend/@n8n/design-system/src/components/InlineAskAssistantButton/InlineAskAssistantButton.vue
+++ b/packages/frontend/@n8n/design-system/src/components/InlineAskAssistantButton/InlineAskAssistantButton.vue
@@ -53,12 +53,10 @@ const onClick = () => {
 		data-test-id="ask-assistant-button"
 		@click="onClick"
 	>
-		<div>
-			<div :style="{ padding: sizes[size].padding }">
-				<AssistantIcon :size="size" :class="$style.icon" :theme="asked ? 'disabled' : 'default'" />
-				<span v-if="asked">{{ t('inlineAskAssistantButton.asked') }}</span>
-				<AssistantText v-else :size="size" :text="t('askAssistantButton.askAssistant')" />
-			</div>
+		<div :style="{ padding: sizes[size].padding }">
+			<AssistantIcon :size="size" :class="$style.icon" :theme="asked ? 'disabled' : 'default'" />
+			<span v-if="asked">{{ t('inlineAskAssistantButton.asked') }}</span>
+			<AssistantText v-else :size="size" :text="t('askAssistantButton.askAssistant')" />
 		</div>
 	</button>
 </template>
@@ -67,49 +65,41 @@ const onClick = () => {
 .button {
 	border-radius: var(--border-radius-base);
 	position: relative;
-	border: 0;
-	padding: 1px;
+	border: 1px solid transparent;
+	padding: 0;
+	overflow: hidden;
 
-	background: var(--color-assistant-highlight-gradient);
+	background:
+		var(--color-askAssistant-button-background-gradient) padding-box,
+		var(--color-assistant-highlight-gradient) border-box;
 
 	> div {
-		background-color: var(--color-askAssistant-button-background);
-		border-radius: inherit;
 		height: 100%;
-		overflow: hidden;
-
-		> div {
-			height: 100%;
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			line-height: unset;
-		}
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		line-height: unset;
 	}
 }
 
 .hoverable {
 	&:hover {
 		cursor: pointer;
-		background: var(--color-assistant-highlight-reverse);
+		background:
+			var(--color-askAssistant-button-background-gradient-hover) padding-box,
+			var(--color-assistant-highlight-reverse) border-box;
 
 		> div {
-			background: var(--color-askAssistant-button-background-hover);
-		}
-
-		> div > div {
 			background: var(--color-assistant-inner-highlight-hover);
 		}
 	}
 
 	&:active {
-		background: var(--color-assistant-highlight-gradient);
+		background:
+			var(--color-askAssistant-button-background-gradient-active) padding-box,
+			var(--color-assistant-highlight-reverse) border-box;
 
 		> div {
-			background: var(--color-askAssistant-button-background-active);
-		}
-
-		> div > div {
 			background: var(--color-assistant-inner-highlight-active);
 		}
 	}
diff --git a/packages/frontend/@n8n/design-system/src/css/_tokens.dark.scss b/packages/frontend/@n8n/design-system/src/css/_tokens.dark.scss
index 81a018ff5cb..210c860811d 100644
--- a/packages/frontend/@n8n/design-system/src/css/_tokens.dark.scss
+++ b/packages/frontend/@n8n/design-system/src/css/_tokens.dark.scss
@@ -48,11 +48,15 @@
 	--color-assistant-highlight-1: #8c90f2;
 	--color-assistant-highlight-2: #a977f0;
 	--color-assistant-highlight-3: #f0778b;
-	--color-askAssistant-button-background: #2e2e2e;
-	--color-askAssistant-button-background-hover: #383839;
-	--color-askAssistant-button-background-active: #414244;
-	--color-assistant-inner-highlight-hover: var(--color-askAssistant-button-background-hover);
-	--color-assistant-inner-highlight-active: var(--color-askAssistant-button-background-active);
+	--color-askAssistant-button-background-gradient: linear-gradient(#2e2e2e, #2e2e2e);
+	--color-askAssistant-button-background-gradient-hover: linear-gradient(#383839, #383839);
+	--color-askAssistant-button-background-gradient-active: linear-gradient(#414244, #414244);
+	--color-assistant-inner-highlight-hover: var(
+		--color-askAssistant-button-background-gradient-hover
+	);
+	--color-assistant-inner-highlight-active: var(
+		--color-askAssistant-button-background-gradient-active
+	);
 
 	--color-assistant-highlight-gradient: linear-gradient(
 		105deg,
diff --git a/packages/frontend/@n8n/design-system/src/css/_tokens.scss b/packages/frontend/@n8n/design-system/src/css/_tokens.scss
index b8d05674c40..ae8a7de40bb 100644
--- a/packages/frontend/@n8n/design-system/src/css/_tokens.scss
+++ b/packages/frontend/@n8n/design-system/src/css/_tokens.scss
@@ -131,9 +131,18 @@
 	--color-sticky-border-7: var(--p-gray-120);
 
 	// AI Assistant
-	--color-askAssistant-button-background: var(--color-background-xlight);
-	--color-askAssistant-button-background-hover: var(--color-background-xlight);
-	--color-askAssistant-button-background-active: var(--color-background-xlight);
+	--color-askAssistant-button-background-gradient: linear-gradient(
+		var(--color-background-xlight),
+		var(--color-background-xlight)
+	);
+	--color-askAssistant-button-background-gradient-hover: linear-gradient(
+		var(--color-background-xlight),
+		var(--color-background-xlight)
+	);
+	--color-askAssistant-button-background-gradient-active: linear-gradient(
+		var(--color-background-xlight),
+		var(--color-background-xlight)
+	);
 
 	--color-assistant-highlight-1: #5b60e8;
 	--color-assistant-highlight-2: #aa7bec;