diff --git a/src/components/DailyCodingTimeChart/DailyCodingTimeChart.tsx b/src/components/DailyCodingTimeChart/DailyCodingTimeChart.tsx
index 4949ce04..6bf39b34 100644
--- a/src/components/DailyCodingTimeChart/DailyCodingTimeChart.tsx
+++ b/src/components/DailyCodingTimeChart/DailyCodingTimeChart.tsx
@@ -109,6 +109,9 @@ export const DailyCodingTimeChart = ({
             data: data.map((entry) => entry.duration),
             borderColor: "#1f78b4",
             borderWidth: 4,
+            // Avoid sharp "miter" spikes at vertices when drawing straight segments.
+            borderJoinStyle: "round",
+            borderCapStyle: "round",
             pointRadius: 2,
             // Avoid "overshoot" where the smoothed curve goes above/below actual points.
             cubicInterpolationMode: smoothCharts ? "monotone" : "default",
diff --git a/src/components/MonthlyCodingTimeChart/MonthlyCodingTimeChart.tsx b/src/components/MonthlyCodingTimeChart/MonthlyCodingTimeChart.tsx
index b33b1c28..1699e69e 100644
--- a/src/components/MonthlyCodingTimeChart/MonthlyCodingTimeChart.tsx
+++ b/src/components/MonthlyCodingTimeChart/MonthlyCodingTimeChart.tsx
@@ -119,6 +119,9 @@ export const MonthlyCodingTimeChart = ({
             data: data.map((entry) => entry.duration),
             borderColor: "#1f78b4",
             borderWidth: 4,
+            // Avoid sharp "miter" spikes at vertices when drawing straight segments.
+            borderJoinStyle: "round",
+            borderCapStyle: "round",
             pointRadius: 2,
             // Avoid "overshoot" where the smoothed curve goes above/below actual points.
             cubicInterpolationMode: smoothCharts ? "monotone" : "default",