diff --git a/CHANGELOG.md b/CHANGELOG.md
index beb9eb9d..975f5ca4 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,8 @@
 
 ## unreleased
 
+- Now a tab with a `color` is underlined only when it is active. ([#791](https://github.com/sqlpage/SQLPage/issues/791))
+
 - Shell submenus stay open again when you click inside them. ([#1011](https://github.com/sqlpage/SQLPage/issues/1011))
 
 - Refined the official website with muted blue accents, simpler navigation, a clearer primary action, and a level SQL ribbon with vertical separators, and a grounded studio scene with brushed metal and physical reflections. Restored visible progress in the streaming comparison animation.
diff --git a/examples/official-site/sqlpage/migrations/13_tab.sql b/examples/official-site/sqlpage/migrations/13_tab.sql
index bccbaca2..162386f1 100644
--- a/examples/official-site/sqlpage/migrations/13_tab.sql
+++ b/examples/official-site/sqlpage/migrations/13_tab.sql
@@ -48,7 +48,7 @@ VALUES (
     (
         'tab',
         'color',
-        'Color of the tab. See preview.tabler.io/colors.html for a list of available colors.',
+        'Color of the tab''s text, and of its underline when it is active. See preview.tabler.io/colors.html for a list of available colors.',
         'TEXT',
         FALSE,
         TRUE
diff --git a/sqlpage/templates/tab.handlebars b/sqlpage/templates/tab.handlebars
index eb6980c6..3196ee05 100644
--- a/sqlpage/templates/tab.handlebars
+++ b/sqlpage/templates/tab.handlebars
@@ -5,7 +5,7 @@
             class="nav-link {{#if active~}}
                 active
             {{~/if}} {{#if color~}}
-                text-{{color}} border-{{color}}
+                text-{{color}}{{#if active}} border-{{color}}{{/if}}
             {{~/if}} {{#if center~}}
                 mx-auto
             {{~/if}}"
diff --git a/tests/end-to-end/fixtures/tab/colored/index.sql b/tests/end-to-end/fixtures/tab/colored/index.sql
new file mode 100644
index 00000000..754f7beb
--- /dev/null
+++ b/tests/end-to-end/fixtures/tab/colored/index.sql
@@ -0,0 +1,3 @@
+SELECT 'tab' AS component;
+SELECT 'Red' AS title, 'red' AS color;
+SELECT 'Green' AS title, 'green' AS color, TRUE AS active;
diff --git a/tests/end-to-end/fixtures/tab/colored/test.ts b/tests/end-to-end/fixtures/tab/colored/test.ts
new file mode 100644
index 00000000..1830b1b8
--- /dev/null
+++ b/tests/end-to-end/fixtures/tab/colored/test.ts
@@ -0,0 +1,13 @@
+import { expect, test } from "../../../fixture.ts";
+
+test("only the active colored tab is underlined, in its color", async ({
+  page,
+}) => {
+  const inactive = page.getByRole("link", { name: "Red" });
+  const active = page.getByRole("link", { name: "Green" });
+  await expect(inactive).toHaveCSS("border-bottom-color", "rgba(0, 0, 0, 0)");
+  const activeColor = await active.evaluate(
+    (link) => getComputedStyle(link).color,
+  );
+  await expect(active).toHaveCSS("border-bottom-color", activeColor);
+});