diff --git a/src/App.tsx b/src/App.tsx
index 2a425ab9..1c6a0805 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,7 +1,7 @@
 import './App.css'
 import { TamaguiProvider } from 'tamagui'
 import { Provider as StatusProvider } from '@status-im/components'
-import { ResponsivePie } from '@nivo/pie'
+import { Pie } from '@nivo/pie'
 
 import config from '../tamagui.config'
 
@@ -15,16 +15,24 @@ interface MyPieProps {
   data: Data[]
 }
 
-const MyResponsivePie = (props: MyPieProps) => {
+const MyPie = (props: MyPieProps) => {
   const { data } = props
+  console.log(data.color)
   return (
     <>
-      <ResponsivePie
+      <Pie
         data={data}
-        innerRadius={0.5}
-        padAngle={0.7}
-        cornerRadius={3}
+        width={74.57}
+        height={74.57}
+        margin={{ top: 40, right: 80, bottom: 80, left: 80 }}
+        innerRadius={0.65}
+        colors={datum => datum.data.color}
+        fit={false}
         activeOuterRadiusOffset={8}
+        enableArcLinkLabels={false}
+        arcLinkLabelsColor={{ from: 'color' }}
+        enableArcLabels={false}
+        legends={[]}
       />
     </>
   )
@@ -35,41 +43,21 @@ function App() {
     {
       id: 'php',
       label: 'php',
-      value: 127,
-      color: 'hsl(236, 70%, 50%)',
+      value: 70,
+      color: '#ea5e78',
     },
     {
       id: 'javascript',
       label: 'javascript',
-      value: 540,
-      color: 'hsl(249, 70%, 50%)',
-    },
-    {
-      id: 'java',
-      label: 'java',
-      value: 240,
-      color: 'hsl(72, 70%, 50%)',
-    },
-    {
-      id: 'python',
-      label: 'python',
-      value: 435,
-      color: 'hsl(122, 70%, 50%)',
-    },
-    {
-      id: 'scala',
-      label: 'scala',
-      value: 197,
-      color: 'hsl(186, 70%, 50%)',
+      value: 30,
+      color: '#ecedf0',
     },
   ]
 
   return (
     <TamaguiProvider config={config}>
       <StatusProvider>
-        <div style={{ height: '500px', width: '300px' }}>
-          <MyResponsivePie data={data} />
-        </div>
+        <MyPie data={data} />
       </StatusProvider>
     </TamaguiProvider>
   )