diff --git a/src/components/Card.astro b/src/components/Card.astro
index 67ac2d5..c02a9a7 100644
--- a/src/components/Card.astro
+++ b/src/components/Card.astro
@@ -5,13 +5,12 @@ interface Props {
 	className?: string;
 	title: string;
 	body: string;
-	href: string;
 	tags: string[];
 	repoUrl: string;
 	demoUrl: string;
 }
 
-const { image, className, title, body, href, tags, repoUrl, demoUrl } = Astro.props;
+const { image, className, title, body, tags, repoUrl, demoUrl } = Astro.props;
 ---
 
 <li class=`list-none text-white rounded-md hover:bg-gradient ${className || ''}`>
@@ -30,13 +29,13 @@ const { image, className, title, body, href, tags, repoUrl, demoUrl } = Astro.pr
 		</ul>
 		<ul class="links flex justify-end gap-2 mt-2">
 			<li>
-				<a href={repoUrl}>
+				<a href={repoUrl} target="_blank">
 					<Icon icon="github" />
 					<span>código</span>
 				</a>
 			</li>
 			<li>
-				<a href={demoUrl}>
+				<a href={demoUrl} target="_blank">
 					<Icon icon="web" />
 					<span>demo</span>
 				</a>
diff --git a/src/components/Icon.astro b/src/components/Icon.astro
index 72b54f4..5980d2b 100644
--- a/src/components/Icon.astro
+++ b/src/components/Icon.astro
@@ -1,13 +1,12 @@
 ---
-import {IconName} from "../types";
+import type {IconName} from "../types";
 import {ICONS} from "../constants";
 interface Props {
 	icon: IconName;
-	className?: string;
 }
 
-const { icon, className } = Astro.props;
+const { icon } = Astro.props;
 const { default: innerHTML } = await import(`../icons/${ICONS[icon]}.svg?raw`);
 ---
 
-<Fragment class={className} set:html={innerHTML} />
\ No newline at end of file
+<Fragment set:html={innerHTML} />
\ No newline at end of file
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 91f4db3..1f6a07f 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -1,6 +1,6 @@
 ---
 import Icon from "../components/Icon.astro";
-import {IconName} from "../types";
+import type {IconName} from "../types";
 interface Props {
 	title: string;
 }
@@ -50,7 +50,7 @@ const SOCIAL_LINKS: SocialLink[] = [
 		<div class="social-links mt-2 flex justify-center gap-2 text-white text-2xl">
 			{
 				SOCIAL_LINKS.map(({ name, href, icon }, index) => (
-					<a class={index % 2 == 0 ? 'text-primary' : 'text-accent'} href={href} target="_blank">
+					<a class={index % 2 == 0 ? 'text-primary' : 'text-accent'} href={href} target="_blank" title={name}>
 						<Icon icon={icon} />
 					</a>
 				))
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 1d0ee7b..480b978 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -6,9 +6,10 @@ const projects = [
 	{
 		image: "https://placehold.co/1200x400",
 		title: "[000] 101 Proyectos",
-		href: "/projects/001-101-projects",
 		description: "La página de los 101 proyectos de Daniel H. Alcojor (sí, esta misma que estás visitando ahora mismo).",
 		tags: ["astro", "learning in public"],
+		repoUrl: "https://github.com/dhAlcojor/101-projects",
+		demoUrl: "https://dhalcojor.github.io/101-projects/",
 	},
 ]
 ---
@@ -23,15 +24,15 @@ const projects = [
 			<strong>101 Proyectos</strong> es un repositorio de proyectos de código abierto para aprender y compartir con la comunidad.
 		</p>
 		<ul role="list" class="grid grid-cols-1 md:max-w-[67%] lg:grid-cols-3 lg:gap-4 mt-8 p-0 mx-auto">
-			{projects.map((project, index) => (
+			{projects.map((project) => (
 				<Card
 					className="md:col-start-2"
-					key={index}
 					image={project.image}
-					href={project.href}
 					title={project.title}
 					body={project.description}
 					tags={project.tags}
+					repoUrl={project.repoUrl}
+					demoUrl={project.demoUrl}
 				/>
 			))}
 		</ul>
diff --git a/src/types.ts b/src/types.ts
index 05cdba3..c105e3d 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -1 +1,3 @@
+import type {ICONS} from "./constants.ts";
+
 export type IconName = keyof typeof ICONS;
\ No newline at end of file