diff --git a/front/components/CompetenciesTable.tsx b/front/components/CompetenciesTable.tsx
index 34d6e8d..6dc772c 100644
--- a/front/components/CompetenciesTable.tsx
+++ b/front/components/CompetenciesTable.tsx
@@ -1,4 +1,5 @@
-import { HStack, VStack, Text, Progress } from "native-base";
+import { useNavigation } from "@react-navigation/core";
+import { HStack, VStack, Text, Progress, Pressable } from "native-base";
 import { translate } from "../i18n/i18n";
 import Card from './Card';
 type CompetenciesTableProps = {
@@ -11,21 +12,26 @@ type CompetenciesTableProps = {
 }
 
 const CompetenciesTable = (props: CompetenciesTableProps) => {
-	return <Card padding={5}>
-		<HStack space={5} flex={1}> 
-			<VStack space={5}> 
-			{ Object.keys(props).map((competencyName) => (
-				<Text bold>{translate(competencyName as keyof CompetenciesTableProps)}</Text>
-			))}
-			</VStack>
-			<VStack space={5} flex={1}>
-			{ Object.keys(props).map((competencyName) => (
-				<Progress flex={1} value={props[competencyName as keyof CompetenciesTableProps]} />
-			))}
-			</VStack>
-		</HStack>
-		
-	</Card>
+	const navigation = useNavigation();
+	return <Pressable onPress={() => navigation.navigate('User')}>
+	{({ isHovered,  isFocused }) => (
+		<Card padding={5} bg={(isHovered || isFocused) ? 'coolGray.200' : undefined }>
+			<HStack space={5} flex={1}> 
+				<VStack space={5}> 
+				{ Object.keys(props).map((competencyName) => (
+					<Text bold>{translate(competencyName as keyof CompetenciesTableProps)}</Text>
+				))}
+				</VStack>
+				<VStack space={5} flex={1}>
+				{ Object.keys(props).map((competencyName) => (
+					<Progress flex={1} value={props[competencyName as keyof CompetenciesTableProps]} />
+				))}
+				</VStack>
+			</HStack>
+				
+		</Card>
+	)}
+	</Pressable>
 }
 
 export default CompetenciesTable
\ No newline at end of file