diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index e92ec66..b21b01c 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -9,6 +9,7 @@
 	import type { Post } from '../types';
 	import ModalEditar from './[perfil]/modalEditar.svelte';
 	import { updatePost } from '@/hooks/updatePost';
+	import { fade, slide } from 'svelte/transition';
 
 	$effect(() => {
 		(async () => {
@@ -61,8 +62,10 @@
 					</Content>
 				</Card>
 			{:else}
-				{#each $posts as post}
-					<PostCard {post} bind:postAModificar />
+				{#each $posts as post (post.id)}
+					<div transition:slide>
+						<PostCard {post} bind:postAModificar />
+					</div>
 				{/each}
 			{/if}
 		</div>
diff --git a/src/routes/[perfil]/+page.svelte b/src/routes/[perfil]/+page.svelte
index 69cb778..e1160cc 100644
--- a/src/routes/[perfil]/+page.svelte
+++ b/src/routes/[perfil]/+page.svelte
@@ -109,8 +109,8 @@
 			</div>
 		{:else}
 			<div class="flex flex-col gap-2">
-				{#each $posts as post}
-					<div out:slide>
+				{#each $posts as post (post.id)}
+					<div transition:slide>
 						<PostCard {post} bind:postAModificar />
 					</div>
 				{/each}