diff --git a/examples/official-site/sqlpage/migrations/01_documentation.sql b/examples/official-site/sqlpage/migrations/01_documentation.sql
index a5f3bde3..ddac5786 100644
--- a/examples/official-site/sqlpage/migrations/01_documentation.sql
+++ b/examples/official-site/sqlpage/migrations/01_documentation.sql
@@ -657,6 +657,7 @@ INSERT INTO parameter(component, name, description, type, top_level, optional) S
     ('color', 'The name of a color in which to display the chart. If there are multiple series in the chart, this parameter can be repeated multiple times.', 'COLOR', TRUE, TRUE),
     ('stacked', 'Whether to cumulate values from different series.', 'BOOLEAN', TRUE, TRUE),
     ('toolbar', 'Whether to display a toolbar at the top right of the chart, that offers downloading the data as CSV.', 'BOOLEAN', TRUE, TRUE),
+    ('show_legend', 'Whether to display the legend listing all chart series. Defaults to true.', 'BOOLEAN', TRUE, TRUE),
     ('logarithmic', 'Display the y-axis in logarithmic scale.', 'BOOLEAN', TRUE, TRUE),
     ('horizontal', 'Displays a bar chart with horizontal bars instead of vertical ones.', 'BOOLEAN', TRUE, TRUE),
     ('height', 'Height of the chart, in pixels. By default: 250', 'INTEGER', TRUE, TRUE),
@@ -702,7 +703,7 @@ INSERT INTO example(component, description, properties) VALUES
         {"series": "Asia", "label": "China", "value": 20},
         {"series": "Asia", "label": "Japan", "value": 10}
     ]')),
-    ('chart', 'A bar chart with multiple series.', json('[{"component":"chart", "title": "Expenses", "type": "bar", "stacked": true, "toolbar": true, "ystep": 10}, '||
+    ('chart', 'A bar chart with multiple series.', json('[{"component":"chart", "title": "Expenses", "type": "bar", "stacked": true, "toolbar": true, "show_legend": false, "ystep": 10}, '||
     '{"series": "Marketing", "x": 2021, "value": 35}, '||
     '{"series": "Marketing", "x": 2022, "value": 15}, '||
     '{"series": "Human resources", "x": 2021, "value": 30}, '||
diff --git a/sqlpage/apexcharts.js b/sqlpage/apexcharts.js
index 7d30c166..60a7d29a 100644
--- a/sqlpage/apexcharts.js
+++ b/sqlpage/apexcharts.js
@@ -157,6 +157,9 @@ sqlpage_chart = (() => {
         mode: isDarkTheme ? 'dark' : 'light',
         palette: "palette4",
       },
+      legend: {
+        show: data.show_legend === null || !!data.show_legend,
+      },
       dataLabels: {
         enabled: !!data.labels,
         dropShadow: {
diff --git a/sqlpage/templates/chart.handlebars b/sqlpage/templates/chart.handlebars
index 667e5eae..34d3256e 100644
--- a/sqlpage/templates/chart.handlebars
+++ b/sqlpage/templates/chart.handlebars
@@ -31,6 +31,7 @@
     "xmax": {{stringify xmax}},
     "ymax": {{stringify ymax}},
     "toolbar": {{stringify toolbar}},
+    "show_legend": {{stringify show_legend}},
     "logarithmic": {{stringify logarithmic}},
     "horizontal": {{stringify horizontal}},
     "stacked": {{stringify stacked}},
diff --git a/tests/end-to-end/official-site.spec.ts b/tests/end-to-end/official-site.spec.ts
index eda20e7e..8b2c6b3f 100644
--- a/tests/end-to-end/official-site.spec.ts
+++ b/tests/end-to-end/official-site.spec.ts
@@ -24,6 +24,17 @@ test("chart", async ({ page }) => {
   await expect(page.locator(".apexcharts-canvas").first()).toBeVisible();
 });
 
+test("chart supports hiding legend", async ({ page }) => {
+  await page.goto(`${BASE}/documentation.sql?component=chart#component`);
+
+  const expensesChart = page.locator(".card", {
+    has: page.getByRole("heading", { name: "Expenses" }),
+  });
+
+  await expect(expensesChart.locator(".apexcharts-canvas")).toBeVisible();
+  await expect(expensesChart.locator(".apexcharts-legend")).toBeHidden();
+});
+
 test("map", async ({ page }) => {
   await page.goto(`${BASE}/documentation.sql?component=map#component`);
   await expect(page.getByText("Loading...")).not.toBeVisible();