diff --git a/conf/locale/locale_en-US.ini b/conf/locale/locale_en-US.ini
index 521a87e44..0a7f8ba2e 100644
--- a/conf/locale/locale_en-US.ini
+++ b/conf/locale/locale_en-US.ini
@@ -711,8 +711,11 @@ insights.contributor.num_of_deletions = "%d --"
 insights.commits = Commits
 insights.commits_by_week = "Commits by Week"
 insights.commits_in_a_week = "Commits in a Week"
-insights.code_frequency = Code Frequency
+insights.code_frequency = "Code Frequency"
+insights.code_frequency_header = "Code frequency over the history of %s"
 insights.contributors_desc = Contributions to branch %s, excluding merge commits
+insights.additions = "Additions"
+insights.deletions = "Deletions"
 
 settings = Settings
 settings.options = Options
diff --git a/internal/route/repo/insight.go b/internal/route/repo/insight.go
index 13a1e08cf..1147d54ce 100644
--- a/internal/route/repo/insight.go
+++ b/internal/route/repo/insight.go
@@ -176,6 +176,27 @@ func InsightCodeFrequencyPage(c *context.Context) {
 	c.Title("repo.insights.code_frequency")
 	c.PageIs("InsightsCodeFrequency")
 
+	// Get commit data for the default branch
+	commits, err := getCommitData(c, c.Repo.Repository.DefaultBranch, true)
+	if err != nil {
+		c.Error(err, "get commits")
+		return
+	}
+
+	// sort commits
+	sort.Slice(commits, func(i, j int) bool {
+		return commits[i].Commit.Author.When.After(commits[j].Commit.Author.When)
+	})
+
+	// get adition and deletion data
+	contributorChartData := getContributorChartData(commits, nil, nil)
+	c.Data["AdditionsChartData"] = contributorChartData.Additions
+	for i := range contributorChartData.Deletions.Dataset.Data {
+		contributorChartData.Deletions.Dataset.Data[i] = -contributorChartData.Deletions.Dataset.Data[i]
+	}
+	c.Data["DeletionsChartData"] = contributorChartData.Deletions
+
+	c.Data["RepositoryName"] = fmt.Sprintf("%s/%s", c.Repo.Owner.Name, c.Repo.Repository.Name)
 	c.Data["RequireChartJS"] = true
 	c.RequireAutosize()
 	c.Success(INSIGHT_CODE_FREQUENCY)
diff --git a/templates/repo/insights/code_frequency.tmpl b/templates/repo/insights/code_frequency.tmpl
new file mode 100644
index 000000000..636f2a9df
--- /dev/null
+++ b/templates/repo/insights/code_frequency.tmpl
@@ -0,0 +1,74 @@
+{{template "base/head" .}}
+{{$root := .}}
+<div class="repository insights code_frequency">
+	{{template "repo/header" .}}
+	<div class="ui container">
+		<div class="ui grid">
+			{{template "repo/insights/navbar" .}}
+			<div class="twelve wide column content">
+                <div class="ui top attached header">
+                    {{.i18n.Tr "repo.insights.code_frequency_header" .RepositoryName}}
+                </div>
+
+                <div class="ui attached segment">
+                    <canvas id="code-frequency"></canvas>
+                    <script>
+                        var functionsToRunOnLoad = [];
+                        function runFunctionsToRunOnLoad() {
+                            for (var i = 0; i < functionsToRunOnLoad.length; i++) {
+                                functionsToRunOnLoad[i]();
+                            }
+                        }
+                        window.onload = runFunctionsToRunOnLoad;
+
+                        functionsToRunOnLoad.push(function() {
+                            var ctx = document.getElementById('code-frequency').getContext('2d');
+                            var chart = new Chart(ctx, {
+                                type: 'line',
+                                data: {
+                                    labels: {{.AdditionsChartData.Labels}},
+                                    datasets: [
+                                        {
+                                            label: {{.i18n.Tr "repo.insights.additions"}},
+                                            data: {{.AdditionsChartData.Dataset.Data}},
+                                            fill: true,
+                                            pointStyle: false,
+                                            backgroundColor: [
+                                                'rgba(0, 255, 0, 0.2)'
+                                            ],
+                                            borderColor: [
+                                                'rgba(0, 255, 0, 0)'
+                                            ],
+                                            borderWidth: 0
+                                        },
+                                        {
+                                            label: {{.i18n.Tr "repo.insights.deletions"}},
+                                            data: {{.DeletionsChartData.Dataset.Data}},
+                                            fill: true,
+                                            pointStyle: false,
+                                            backgroundColor: [
+                                                'rgba(255, 0, 0, 0.2)'
+                                            ],
+                                            borderColor: [
+                                                'rgba(255, 0, 0, 0)'
+                                            ],
+                                            borderWidth: 0
+                                        }
+                                    ]
+                                },
+                                options: {
+                                    scales: {
+                                        y: {
+                                            beginAtZero: true
+                                        }
+                                    }
+                                }
+                            });
+                        });
+                    </script>
+                </div>
+            </div>
+		</div>
+	</div>
+</div>
+{{template "base/footer" .}}
\ No newline at end of file