diff --git a/templates/repo/contributors.tmpl b/templates/repo/contributors.tmpl
index f7f5d796f4..c71312fc6c 100644
--- a/templates/repo/contributors.tmpl
+++ b/templates/repo/contributors.tmpl
@@ -1,6 +1,7 @@
 {{if .Permission.CanRead $.UnitTypeCode}}
 	<div id="repo-contributors-chart"
 		data-repo-link="{{.RepoLink}}"
+		data-repo-default-branch-name="{{.Repository.DefaultBranch}}"
 		data-locale-filter-label="{{ctx.Locale.Tr "repo.contributors.contribution_type.filter_label"}}"
 		data-locale-contribution-type-commits="{{ctx.Locale.Tr "repo.contributors.contribution_type.commits"}}"
 		data-locale-contribution-type-additions="{{ctx.Locale.Tr "repo.contributors.contribution_type.additions"}}"
diff --git a/tests/e2e/repo-activity-contributors.test.e2e.ts b/tests/e2e/repo-activity-contributors.test.e2e.ts
new file mode 100644
index 0000000000..ece62cfaba
--- /dev/null
+++ b/tests/e2e/repo-activity-contributors.test.e2e.ts
@@ -0,0 +1,17 @@
+// Copyright 2024 The Forgejo Authors. All rights reserved.
+// SPDX-License-Identifier: GPL-3.0-or-later
+
+// @watch start
+// web_src/js/features/contributors.js
+// web_src/js/components/RepoContributors.vue
+// templates/repo/*
+// @watch end
+
+import {expect} from '@playwright/test';
+import {test} from './utils_e2e.ts';
+
+test('Contributor graph', async ({page}) => {
+  await page.goto('/user2/commits_search_test/activity/contributors');
+  await page.getByRole('link', {name: '2 Commits'}).click();
+  await expect(page.getByRole('cell', {name: 'Bob'})).toHaveCount(2);
+});
diff --git a/web_src/js/components/RepoContributors.vue b/web_src/js/components/RepoContributors.vue
index dec2599c0d..07ad336cf7 100644
--- a/web_src/js/components/RepoContributors.vue
+++ b/web_src/js/components/RepoContributors.vue
@@ -1,5 +1,6 @@
 <script>
 import {SvgIcon} from '../svg.js';
+import dayjs from 'dayjs';
 import {
   Chart,
   Title,
@@ -22,6 +23,7 @@ import {chartJsColors} from '../utils/color.js';
 import {sleep} from '../utils.js';
 import 'chartjs-adapter-dayjs-4/dist/chartjs-adapter-dayjs-4.esm';
 import $ from 'jquery';
+import {pathEscapeSegments} from '../utils/url.js';
 
 const customEventListener = {
   id: 'customEventListener',
@@ -61,6 +63,10 @@ export default {
       type: String,
       required: true,
     },
+    repoDefaultBranchName: {
+      type: String,
+      required: true,
+    },
   },
   data: () => ({
     isLoading: false,
@@ -96,6 +102,15 @@ export default {
         .slice(0, 100);
     },
 
+    getContributorSearchQuery(contributorEmail) {
+      const min = dayjs(this.xAxisMin).format('YYYY-MM-DD');
+      const max = dayjs(this.xAxisMax).format('YYYY-MM-DD');
+      const params = new URLSearchParams({
+        'q': `after:${min}, before:${max}, author:${contributorEmail}`,
+      });
+      return `${this.repoLink}/commits/branch/${pathEscapeSegments(this.repoDefaultBranchName)}/search?${params.toString()}`;
+    },
+
     async fetchGraphData() {
       this.isLoading = true;
       try {
@@ -163,7 +178,7 @@ export default {
         // for details.
         user.max_contribution_type += 1;
 
-        filteredData[key] = {...user, weeks: filteredWeeks};
+        filteredData[key] = {...user, weeks: filteredWeeks, email: key};
       }
 
       return filteredData;
@@ -376,7 +391,7 @@ export default {
         <div class="ui top attached header tw-flex tw-flex-1">
           <b class="ui right">#{{ index + 1 }}</b>
           <a :href="contributor.home_link">
-            <img class="ui avatar tw-align-middle" height="40" width="40" :src="contributor.avatar_link">
+            <img class="ui avatar tw-align-middle" height="40" width="40" :src="contributor.avatar_link" alt="">
           </a>
           <div class="tw-ml-2">
             <a v-if="contributor.home_link !== ''" :href="contributor.home_link"><h4>{{ contributor.name }}</h4></a>
@@ -384,7 +399,11 @@ export default {
               {{ contributor.name }}
             </h4>
             <p class="tw-text-12 tw-flex tw-gap-1">
-              <strong v-if="contributor.total_commits">{{ contributor.total_commits.toLocaleString() }} {{ locale.contributionType.commits }}</strong>
+              <strong v-if="contributor.total_commits">
+                <a class="silenced" :href="getContributorSearchQuery(contributor.email)">
+                  {{ contributor.total_commits.toLocaleString() }} {{ locale.contributionType.commits }}
+                </a>
+              </strong>
               <strong v-if="contributor.total_additions" class="text green">{{ contributor.total_additions.toLocaleString() }}++ </strong>
               <strong v-if="contributor.total_deletions" class="text red">
                 {{ contributor.total_deletions.toLocaleString() }}--</strong>
diff --git a/web_src/js/features/contributors.js b/web_src/js/features/contributors.js
index 79b3389fee..c0106b6350 100644
--- a/web_src/js/features/contributors.js
+++ b/web_src/js/features/contributors.js
@@ -8,6 +8,7 @@ export async function initRepoContributors() {
   try {
     const View = createApp(RepoContributors, {
       repoLink: el.getAttribute('data-repo-link'),
+      repoDefaultBranchName: el.getAttribute('data-repo-default-branch-name'),
       locale: {
         filterLabel: el.getAttribute('data-locale-filter-label'),
         contributionType: {