diff --git a/src/Components/Projects/Contribution/Box/index.js b/src/Components/Projects/Contribution/Box/index.js
new file mode 100644
index 00000000..ce1cba6d
--- /dev/null
+++ b/src/Components/Projects/Contribution/Box/index.js
@@ -0,0 +1,33 @@
+import React from 'react';
+import { StyleSheet, View} from 'react-native';
+
+
+const ContributionBox = ({ commitCount }) => {
+    var hue = 0;
+    if(commitCount < 2) {
+        hue = .4;
+    } else if (commitCount >=2 && commitCount < 4) {
+        hue = .6;
+    } else if (commitCount >=4 && commitCount < 8 ) {
+        hue = .7;
+    } else if (commitCount >=8 && commitCount < 12) {
+        hue = .9;
+    } else {
+        hue = 1;
+    }
+        
+    var colorCode = 'rgba(0, 113, 188,' + hue + ')';
+    return (
+        <View style={[style.box, {backgroundColor: colorCode}]}/>
+    );
+};
+
+const style = StyleSheet.create({
+    box: {
+        width: 20,
+        height: 20,
+        margin: 2.5, 
+    }
+});
+
+export default ContributionBox;
diff --git a/src/Components/Projects/Contribution/ContributionRow.js b/src/Components/Projects/Contribution/ContributionRow.js
new file mode 100644
index 00000000..328a85d2
--- /dev/null
+++ b/src/Components/Projects/Contribution/ContributionRow.js
@@ -0,0 +1,78 @@
+import React ,{useState} from 'react';
+import { View, Text, StyleSheet } from 'react-native';
+import ContributionBox from './Box';
+
+function ContributionRow ({...props}) {
+     let [data ,setData] = useState(null);
+    React.useEffect( () => {
+        const endpoint = props.detail.link;
+        const headers = {
+            "Authorization" : process.env.ACCESS_TOKEN
+        }
+        fetch(endpoint, {
+            "method" :"GET",
+            "headers" : headers
+        })
+        .then((resp) => resp.json())
+        .then((obj) => {
+            setData( obj) ;
+        });
+    }, [])
+        let Contributionrow = [];
+        const reponame = props.detail.name;
+        const take = () =>{
+            Contributionrow.push(<Text key={0} style={styles.desc}>{reponame}</Text>);
+            let week = 0;
+            let days =0;
+            while (true) {
+                for (let i=6;i>=0;i--)
+                {
+                    Contributionrow.push( 
+                        <ContributionBox key={days+1} commitCount={data[51-week].days[i]} />
+                        );
+                    days++;
+                    if(days>=30)break;
+                }
+                week++;
+                if(days>=30)break; 
+            }
+            return null;
+        }
+
+        return (
+
+            <View>
+                {data === null ?
+                    <Text style={styles.desc}>loading...</Text>
+                :    
+                <View style={{
+                    flexDirection: 'row',
+                    flexWrap: 'wrap',
+                }}
+                >
+                    {take()}
+                    {Contributionrow}
+                </View>
+                }
+            </View>      
+        
+        );
+    //}
+};
+
+const styles = StyleSheet.create({
+    desc: {
+        color: '#0071BC',
+        fontSize: 16,
+        fontWeight: '400',
+        width: 190,
+        margin:4,
+    },
+    box: {
+        flexDirection: 'row',
+        flexWrap: 'wrap',
+        marginTop: 8,
+    }
+})
+
+export default ContributionRow;
\ No newline at end of file
diff --git a/src/Components/Projects/Contribution/index.js b/src/Components/Projects/Contribution/index.js
new file mode 100644
index 00000000..a282ccd7
--- /dev/null
+++ b/src/Components/Projects/Contribution/index.js
@@ -0,0 +1,51 @@
+import React from 'react';
+import { View, StyleSheet, Text, ScrollView } from 'react-native';
+import SectionHeader from './../../SectionHeader';
+import ContributionRow from './ContributionRow';
+import ContributionBox from './Box';
+import { getrepoData } from './../../../content/projects_content';
+
+
+function Contribution ()  {
+    const repoData = getrepoData();
+        return (
+            <View >
+                <SectionHeader title={'Last 30 Days Contribution'} />
+                <ScrollView horizontal={true}>
+                <View style={{margin: 32}}>
+                    {repoData.data.map((repo,index) => (
+                        <ContributionRow detail={repo} key={index} />
+                        ))
+                    }
+                <View style={styles.description}>
+                   <Text style={styles.text}>Less</Text> 
+                   <ContributionBox commitCount={1} />
+                   <ContributionBox commitCount={3} />
+                   <ContributionBox commitCount={6} />
+                   <ContributionBox commitCount={10} />
+                   <ContributionBox commitCount={13} />
+                   <Text style={styles.text}>More</Text>
+                </View>
+                </View>
+                </ScrollView>
+            </View>
+        );
+    
+}
+
+const styles = StyleSheet.create({
+    description: {
+        flexDirection: 'row',
+        flexWrap: 'wrap',
+        alignSelf: 'flex-end',
+        
+    },
+    text: {
+        color: '#0071BC',
+        fontSize: 12,
+        fontWeight: '400',
+        padding: 4,
+    },
+});
+
+export default Contribution;
\ No newline at end of file
diff --git a/src/Components/Projects/ProjectCard/ProjectCardBadge/index.js b/src/Components/Projects/ProjectCard/ProjectCardBadge/index.js
index 321f0fbf..2eb21d6f 100644
--- a/src/Components/Projects/ProjectCard/ProjectCardBadge/index.js
+++ b/src/Components/Projects/ProjectCard/ProjectCardBadge/index.js
@@ -21,8 +21,8 @@ const styles = StyleSheet.create({
     marginTop: 8,
   },
   image: {
-    width: 24,
-    height: 24,
+    width: 32,
+    height: 32,
   },
   title: {
     color: '#103B81',
diff --git a/src/Components/Projects/index.js b/src/Components/Projects/index.js
index 39b22c6b..7ef10abb 100644
--- a/src/Components/Projects/index.js
+++ b/src/Components/Projects/index.js
@@ -5,6 +5,9 @@ import { View } from 'react-native';
 import ImageTextSection from './../ImageTextSection';
 import { getProjects } from './../../content/projects_content';
 import ProjectCard from './ProjectCard';
+import Calender from './Contribution';
+
+
 
 function Projects(props) {
   const projects = getProjects();
@@ -45,6 +48,7 @@ function Projects(props) {
       {/* 
       <SectionHeader title="Partners" />
       <Sponsors /> */}
+     <Calender/>
     </View>
   );
 }
diff --git a/src/assets/events_and_highlights/calendar.png b/src/assets/events_and_highlights/calendar.png
new file mode 100644
index 00000000..7d425bb7
Binary files /dev/null and b/src/assets/events_and_highlights/calendar.png differ
diff --git a/src/assets/events_and_highlights/location.png b/src/assets/events_and_highlights/location.png
new file mode 100644
index 00000000..9925c3e9
Binary files /dev/null and b/src/assets/events_and_highlights/location.png differ
diff --git a/src/assets/events_and_highlights/time.png b/src/assets/events_and_highlights/time.png
new file mode 100644
index 00000000..31d514d5
Binary files /dev/null and b/src/assets/events_and_highlights/time.png differ
diff --git a/src/content/events_and_highlights.json b/src/content/events_and_highlights.json
deleted file mode 100644
index 7808ae81..00000000
--- a/src/content/events_and_highlights.json
+++ /dev/null
@@ -1,110 +0,0 @@
-{
-  "sections": [
-    {
-      "title": "Our Events and Highlights",
-      "content": [
-        {
-          "par": "AnitaB.org Open Source Events convenes members from all backgrounds and levels of expertise throughout the year to bridge the diversity gap in Open Source development."
-        },
-        {
-          "par": "Our events aim to give members insights from industry experts and female-identifying leaders on a variety of topics promoting Open Source, and covering stages of Open Source development right from Introduction to Quality Assurance."
-        }
-      ]
-    },
-    {
-      "events": [
-        {
-          "title": "Why I contribute to Open source?",
-          "date": "July 4, 2020",
-          "location": "Virtual",
-          "timings": "1am (UTC)",
-          "description": [
-            {
-              "par": "Heard about Open Source, not sure what’s in it for you? Need a boost to begin?"
-            },
-            {
-              "par": "This event will give you an understanding of the motivation behind individuals who contribute to open source"
-            },
-            {
-              "par": "Open Source contributors with varying experiences will be there to share their journey, and answer your questions!"
-            }
-          ],
-          "highlights": "../src/assets/events_and_highlights/1.png",
-          "know more": "Feel free to contact AnitaB.org Open Source on Zulip (https://anitab-org.zulipchat.com) if you need any further information about this event."
-        },
-        {
-          "title": "Engaging Open Source community in Quality Assurance",
-          "date": "August 9, 2020",
-          "location": "Virtual",
-          "timings": "9am (EST)",
-          "description": [
-            {
-              "par": "Wondered how Quality Assurance (QA) for software is performed in companies or what are the roles and responsibilities of an QA engineer?"
-            },
-            {
-              "par": "This talk will help members grasp concepts of traditional QA methods such as formalized testing, writing and tracking bugs which are equally relevant for Open Source development."
-            },
-            {
-              "par": "We will explore the contrasting nature of software quality assurance under the Open Source model and traditional software development models. Consequently, their translation in practical advantages."
-            },
-            {
-              "par": "It will draw attention to pragmatic quality assurance practices in upstream Open Source projects like Fedora."
-            },
-            {
-              "par": "This will certainly give members a head-start by laying out some of the best practices and common challenges faced while quality testing Open Source products."
-            }
-          ],
-          "highlights": "../src/assets/events_and_highlights/2.png",
-          "know more": "Feel free to contact AnitaB.org Open Source on Zulip (https://anitab-org.zulipchat.com) if you need any further information about this event."
-        },
-        {
-          "title": "Hopper India 2020",
-          "date": "August 6 — August 7,2020",
-          "location": "Virtual",
-          "timings": "9:30am - 4pm (IST)",
-          "description": [
-            {
-              "par": "Our vibrant community of women in technology from Chennai, Delhi, Hyderabad, and Pune is coming together to present this two-day virtual event modeled after the popular Grace Hopper Celebration India (GHCI) conference for women in technology."
-            },
-            {
-              "par": "This immersive event brings together women technologists at all levels from industry, academia, research and startups to build connections, learn, and advance their careers."
-            },
-            {
-              "par": "Attend inspiring keynotes and sessions led by charismatic women carrying a zeal to learn, grow and lead."
-            },
-            {
-              "par": "Don’t miss out on the opportunity to network with peers, and gain important resources to help you succeed in and further your career."
-            },
-            {
-              "par": "Our Career Fair, hosting tech giants, research labs, and financial-tech companies, offers immense job opportunities to both students and professionals."
-            }
-          ],
-          "highlights": "../src/assets/events_and_highlights/3.png",
-          "know more": "Visit our official Grace Hopper Celebration India website (https://ghcindia.anitab.org/) for details about registration, eligibility, scholarships, conference sessions and FAQs."
-        },
-        {
-          "title": "Grace Hopper Celebration 2020",
-          "date": "September 29 — October 3,2020",
-          "location": "Virtual",
-          "timings": "11am - 3pm (PT)",
-          "description": [
-            {
-              "par": "AnitaB.org’s flagship event Grace Hopper Celebration brings the research and career interests of women in computing to the forefront."
-            },
-            {
-              "par": "Grace Hopper Celebration (GHC), world’s largest gathering of women technologists, commemorates, celebrates, fosters and encourages the magnificent women in technology who dared to shed their inhibitions, and recognized the genius in them."
-            },
-            {
-              "par": "Attend inspiring keynotes and sessions, network with peers, and gain important resources to help you succeed in and further your career."
-            },
-            {
-              "par": "The celebration consists of a combination of technical sessions, poster sessions, career fairs, award ceremonies and more."
-            }
-          ],
-          "highlights": "../src/assets/events_and_highlights/4.png",
-          "know more": "Visit our official Grace Hopper Celebration website (https://ghc.anitab.org) for details about registration, eligibility, scholarships, conference sessions and FAQs."
-        }
-      ]
-    }
-  ]
-}
\ No newline at end of file
diff --git a/src/content/projects_content.js b/src/content/projects_content.js
index 561a10fc..9aa36d56 100644
--- a/src/content/projects_content.js
+++ b/src/content/projects_content.js
@@ -346,6 +346,39 @@ const projects = {
   ],
 };
 
+const repoData = {
+  data: [
+    {
+        name :   'Anitab-org.github.io',
+        link :  'https://api.github.com/repos/anitab-org/anitab-org.github.io/stats/commit_activity',
+    },
+    {
+        name :   'Mentorship-backend',
+        link :  'https://api.github.com/repos/anitab-org/mentorship-backend/stats/commit_activity',
+    },
+    {
+        name :   'Mentorship-android',
+        link :  'https://api.github.com/repos/anitab-org/mentorship-android/stats/commit_activity',
+    },
+    {
+        name :   'Mentorship-ios',
+        link :  'https://api.github.com/repos/anitab-org/mentorship-ios/stats/commit_activity',
+    },
+    {
+        name :   'Portal',
+        link :  'https://api.github.com/repos/anitab-org/portal/stats/commit_activity',
+    },
+    {
+        name :   'Vms',
+        link :  'https://api.github.com/repos/anitab-org/vms/stats/commit_activity',
+    }
+  ]
+};
+
+export const getrepoData = () => {
+  return repoData;
+}
+
 export const getProjects = () => {
   return projects;
 };