diff --git a/main/background.ts b/main/background.ts
index adf7c48846b5d9661b137e95fa3a1ab5845f9263..b0f74219b337c54d0e865e69dfa119f83437a153 100644
--- a/main/background.ts
+++ b/main/background.ts
@@ -22,7 +22,9 @@ if (isProd) {
     width: 1000,
     height: 600,
     frame: true,
-    autoHideMenuBar: true
+    autoHideMenuBar: true,
+    minWidth: 1000,
+    minHeight: 600
   });
 
   if (isProd) {
diff --git a/renderer/components/charts/Doughnut.tsx b/renderer/components/charts/Doughnut.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..a52f4d9db879affe5da15b63012f4123575554c4
--- /dev/null
+++ b/renderer/components/charts/Doughnut.tsx
@@ -0,0 +1,41 @@
+import { Box } from '@chakra-ui/layout';
+import { ChartOptions } from 'chart.js';
+import React from 'react';
+import { ChartProps, Doughnut } from 'react-chartjs-2';
+
+const DoughnutChart = ({ title, stats, labels, colors }) => {
+
+    const data = {
+        labels: labels,
+        datasets: [
+          {
+            label: title,
+            data: stats,
+            fill: false,
+            backgroundColor: colors,
+            borderColor: colors,
+          },
+        ],
+      };
+      
+      const options : ChartProps = {
+        scales: {
+          y: {
+            beginAtZero: false
+          }
+        },
+        plugins: {
+          legend: {
+            onClick: null
+          }
+        }
+      };
+
+    return (
+    <Box boxSize="400px" mx={5} height="max-content">
+      <Doughnut data={data} options={options} />
+    </Box>
+    )
+};
+
+export default DoughnutChart;
\ No newline at end of file
diff --git a/renderer/pages/stats/[country].tsx b/renderer/pages/stats/[country].tsx
index b1ac070f8d17862a7def3d1248155b404a55ff0c..a5372d8ae12410ebad086168763e4c0a99282388 100644
--- a/renderer/pages/stats/[country].tsx
+++ b/renderer/pages/stats/[country].tsx
@@ -5,6 +5,7 @@ import { useRouter } from "next/router";
 import Line from "../../components/charts/Line";
 import BaseLayout from "../../components/BaseLayout";
 import { getCountries, getCountryData } from "../../lib/handler";
+import DoughnutChart from "../../components/charts/Doughnut";
 
 const DisplayStat = ({label, children}) => {
     return (
@@ -33,8 +34,6 @@ export default function Country({ data, countries }) {
     const NOW = data.week[0]
     const LAST = data.week[1]
 
-    console.log(NOW.new)
-
     return (
         <BaseLayout countries={countries} pageTitle={data.name}>
         {!_.isEmpty(data.week) && (
@@ -56,7 +55,7 @@ export default function Country({ data, countries }) {
                 </DisplayStat>
             </Flex>
             
-            <Flex px={5} justifyContent="center">
+            <Flex px={5} justifyContent="center" wrap="wrap">
                 <Box>
                 <Line color="#ff6124" title={"New Cases"} stats={data.week.map(day => day.new.cases).reverse()} labels={data.week.map(day => (WEEK_DAYS[new Date(day.date).getDay()])).reverse()} />
                 <DisplayStat>
@@ -67,7 +66,23 @@ export default function Country({ data, countries }) {
                 <Box>
                 <Line color="#000" title={"Daily Deaths"} stats={data.week.map(day => day.new.deaths).reverse()} labels={data.week.map(day => (WEEK_DAYS[new Date(day.date).getDay()])).reverse()} />
                 <DisplayStat>
-                    <Text fontSize="20px"><StatArrow type={NOW.new.cases-LAST.new.cases < 0 ? "decrease" : "increase"} boxSize="25px" /> {Math.abs(NOW.new.deaths-LAST.new.deaths).toLocaleString(undefined)} deaths since yesterday</Text>
+                    <Text fontSize="20px"><StatArrow type={NOW.new.deaths-LAST.new.deaths < 0 ? "decrease" : "increase"} boxSize="25px" /> {Math.abs(NOW.new.deaths-LAST.new.deaths).toLocaleString(undefined)} deaths since yesterday</Text>
+                </DisplayStat>
+                </Box>
+            </Flex>
+
+            <Flex px={5} justifyContent="center" my={"50px"}>
+                <Box>
+                <DoughnutChart colors={["#56fb5e", "#fa5d5f"]} title={"Recovery Rate"} stats={[data.rates.recovery,100-data.rates.recovery]} labels={["Recovered", "Not Recovered"]} />
+                <DisplayStat>
+                    <Text fontSize="20px"><StatArrow type={data.rates.recovery < 70 ? "decrease" : "increase"} boxSize="25px" /> {data.name} has a {data.rates.recovery.toFixed(2)}% recovery rate</Text>
+                </DisplayStat>
+                </Box>
+
+                <Box>
+                <DoughnutChart colors={["#000", "#4b63fd"]} title={"Death Rate"} stats={[data.rates.death, 100-data.rates.death]} labels={["Lethal", "Not Lethal"]} />
+                <DisplayStat>
+                    <Text fontSize="20px"><StatArrow type={data.rates.death > 10 ? "decrease" : "increase"} boxSize="25px" /> {data.name} has a {data.rates.death.toFixed(2)}% death rate</Text>
                 </DisplayStat>
                 </Box>
             </Flex>