diff --git a/ui/CHANGELOG.md b/ui/CHANGELOG.md
index 05cac6938a..3a69289d56 100644
--- a/ui/CHANGELOG.md
+++ b/ui/CHANGELOG.md
@@ -21,6 +21,7 @@ All notable changes to the **Prowler UI** are documented in this file.
 
 - Field for `Assume Role` in AWS role credentials form shown again [(#8484)](https://github.com/prowler-cloud/prowler/pull/8484)
 - `GitHub` submenu to High Risk Findings [(#8488)](https://github.com/prowler-cloud/prowler/pull/8488)
+- Improved Overview chart `Findings by Severity` spacing [(#8491)](https://github.com/prowler-cloud/prowler/pull/8491)
 
   
 ---
diff --git a/ui/components/overview/findings-by-severity-chart/findings-by-severity-chart.tsx b/ui/components/overview/findings-by-severity-chart/findings-by-severity-chart.tsx
index ae4d704731..cc09da9bf6 100644
--- a/ui/components/overview/findings-by-severity-chart/findings-by-severity-chart.tsx
+++ b/ui/components/overview/findings-by-severity-chart/findings-by-severity-chart.tsx
@@ -73,15 +73,15 @@ export const FindingsBySeverityChart = ({
     <Card className="h-full dark:bg-prowler-blue-400">
       <CardBody>
         <div className="my-auto">
-          <ChartContainer config={chartConfig}>
+          <ChartContainer
+            config={chartConfig}
+            className="aspect-auto h-[450px] w-full"
+          >
             <BarChart
               accessibilityLayer
               data={chartData}
               layout="vertical"
-              barGap={2}
-              height={200}
-              margin={{ left: 50 }}
-              width={500}
+              margin={{ left: 72, right: 16, top: 8, bottom: 8 }}
             >
               <YAxis
                 dataKey="severity"
@@ -104,7 +104,7 @@ export const FindingsBySeverityChart = ({
                 dataKey="findings"
                 layout="vertical"
                 radius={12}
-                barSize={20}
+                barSize={26}
                 onClick={(data) => {
                   const severity = data.severity as keyof typeof chartConfig;
                   const link = chartConfig[severity]?.link;
@@ -119,6 +119,14 @@ export const FindingsBySeverityChart = ({
                   offset={5}
                   className="fill-foreground font-bold"
                   fontSize={11}
+                  formatter={(value: number) => (value === 0 ? "" : value)}
+                />
+                <LabelList
+                  position="insideLeft"
+                  offset={6}
+                  className="fill-foreground font-bold"
+                  fontSize={11}
+                  formatter={(value: number) => (value === 0 ? "0" : "")}
                 />
               </Bar>
             </BarChart>
diff --git a/ui/components/overview/findings-by-status-chart/findings-by-status-chart.tsx b/ui/components/overview/findings-by-status-chart/findings-by-status-chart.tsx
index f928c1fee9..cd27c6d8e0 100644
--- a/ui/components/overview/findings-by-status-chart/findings-by-status-chart.tsx
+++ b/ui/components/overview/findings-by-status-chart/findings-by-status-chart.tsx
@@ -121,7 +121,7 @@ export const FindingsByStatusChart: React.FC<FindingsByStatusChartProps> = ({
   return (
     <Card className="h-full dark:bg-prowler-blue-400">
       <CardBody>
-        <div className="flex h-full flex-col items-center justify-between">
+        <div className="flex h-full flex-col items-center justify-around">
           <ChartContainer
             config={chartConfig}
             className="aspect-square w-[250px] min-w-[250px]"