diff --git a/src/lib/components/TablaUsuarios.svelte b/src/lib/components/TablaUsuarios.svelte
index 8524b6d..1077734 100644
--- a/src/lib/components/TablaUsuarios.svelte
+++ b/src/lib/components/TablaUsuarios.svelte
@@ -9,6 +9,8 @@
 	import Button from './ui/button/button.svelte';
 	import KeyIcon from '@lucide/svelte/icons/key';
 	import UserPen from '@lucide/svelte/icons/user-pen';
+	import Search from '@lucide/svelte/icons/search';
+	import Plus from '@lucide/svelte/icons/plus';
 	import { Tooltip } from './ui/tooltip';
 	import TooltipTrigger from './ui/tooltip/tooltip-trigger.svelte';
 	import TooltipContent from './ui/tooltip/tooltip-content.svelte';
@@ -21,6 +23,9 @@
 	import Input from './ui/input/input.svelte';
 	import Trash_2 from '@lucide/svelte/icons/trash-2';
 	import BorrarUsuario from './BorrarUsuario.svelte';
+	import InputGroup from './ui/input-group/input-group.svelte';
+	import InputGroupAddon from './ui/input-group/input-group-addon.svelte';
+	import InputGroupInput from './ui/input-group/input-group-input.svelte';
 
 	interface Props {
 		usuarios: UserResponseDto[];
@@ -107,13 +112,12 @@
 	// $inspect(usuarios);
 </script>
 
-<div class="mb-4">
-	<Input
-		type="text"
-		placeholder="Buscar usuario..."
-		bind:value={search}
-		class="w-full rounded border px-3 py-2"
-	/>
+<div class="mb-4 flex gap-2">
+	<InputGroup>
+		<InputGroupAddon align="inline-start"><Search></Search></InputGroupAddon>
+		<InputGroupInput type="text" placeholder="Buscar usuario..." bind:value={search} />
+	</InputGroup>
+	<Button variant="secondary" class="bg-blue-500/20"><Plus /></Button>
 </div>
 
 <Table>
@@ -135,52 +139,60 @@
 		</TableRow>
 	</TableHeader>
 	<TableBody>
-		{#each usuariosFiltrados as usuario}
+		{#if usuariosFiltrados.length == 0}
 			<TableRow>
-				<TableCell
-					>@<a href={'/' + usuario.username}>
-						{usuario.username}
-					</a>
+				<TableCell colspan={5}>
+					<p class="text-center">No hay usuarios por el nombre de: {search}</p>
 				</TableCell>
-				<TableCell>{usuario.displayName}</TableCell>
-				<TableCell class="text-center">{usuario.postsCount}</TableCell>
-				<TableCell>{usuario.createdAt.replace('Z', ' ').replace('T', ' | ')}</TableCell>
-				<TableCell class="flex gap-2">
-					<Tooltip>
-						<TooltipTrigger>
-							<Button onclick={() => handleCambiarContraseña(usuario)}><KeyIcon></KeyIcon></Button>
-						</TooltipTrigger>
-						<TooltipContent>
-							<p>Recuperar Contraseña</p>
-						</TooltipContent>
-					</Tooltip>
-					<Tooltip>
-						<TooltipTrigger>
-							<Button onclick={() => handleModificar(usuario)}><UserPen /></Button>
-						</TooltipTrigger>
-						<TooltipContent>
-							<p>Modificar Usuario</p>
-						</TooltipContent>
-					</Tooltip>
-					<Tooltip>
-						<TooltipTrigger>
-							<Button
-								disabled={usuario.isAdmin}
-								onclick={() => handleBorrar(usuario)}
-								variant="destructive"><Trash_2 /></Button
-							>
-						</TooltipTrigger>
-						<TooltipContent>
-							{#if usuario.isAdmin}
-								No se pueden eliminar usuarios Admin
-							{:else}
-								Eliminar Usuario
-							{/if}
-						</TooltipContent>
-					</Tooltip>
-				</TableCell>
-			</TableRow>
-		{/each}
+			</TableRow>{:else}
+			{#each usuariosFiltrados as usuario}
+				<TableRow>
+					<TableCell
+						>@<a href={'/' + usuario.username}>
+							{usuario.username}
+						</a>
+					</TableCell>
+					<TableCell>{usuario.displayName}</TableCell>
+					<TableCell class="text-center">{usuario.postsCount}</TableCell>
+					<TableCell>{usuario.createdAt.replace('Z', ' ').replace('T', ' | ')}</TableCell>
+					<TableCell class="flex gap-2">
+						<Tooltip>
+							<TooltipTrigger>
+								<Button onclick={() => handleCambiarContraseña(usuario)}><KeyIcon></KeyIcon></Button
+								>
+							</TooltipTrigger>
+							<TooltipContent>
+								<p>Recuperar Contraseña</p>
+							</TooltipContent>
+						</Tooltip>
+						<Tooltip>
+							<TooltipTrigger>
+								<Button onclick={() => handleModificar(usuario)}><UserPen /></Button>
+							</TooltipTrigger>
+							<TooltipContent>
+								<p>Modificar Usuario</p>
+							</TooltipContent>
+						</Tooltip>
+						<Tooltip>
+							<TooltipTrigger>
+								<Button
+									disabled={usuario.isAdmin}
+									onclick={() => handleBorrar(usuario)}
+									variant="destructive"><Trash_2 /></Button
+								>
+							</TooltipTrigger>
+							<TooltipContent>
+								{#if usuario.isAdmin}
+									No se pueden eliminar usuarios Admin
+								{:else}
+									Eliminar Usuario
+								{/if}
+							</TooltipContent>
+						</Tooltip>
+					</TableCell>
+				</TableRow>
+			{/each}
+		{/if}
 	</TableBody>
 </Table>
 <BorrarUsuario bind:open={openBorrar} usuario={usuarioBorrar} />
diff --git a/src/lib/components/ui/button/button.svelte b/src/lib/components/ui/button/button.svelte
index 6499722..a8296ae 100644
--- a/src/lib/components/ui/button/button.svelte
+++ b/src/lib/components/ui/button/button.svelte
@@ -7,12 +7,12 @@
 		base: "focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex shrink-0 items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
 		variants: {
 			variant: {
-				default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
+				default: "bg-primary text-primary-foreground hover:bg-primary/90 shadow-xs",
 				destructive:
-					"bg-destructive shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60 text-white",
+					"bg-destructive hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60 text-white shadow-xs",
 				outline:
-					"bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 border",
-				secondary: "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
+					"bg-background hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 border shadow-xs",
+				secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 shadow-xs",
 				ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
 				link: "text-primary underline-offset-4 hover:underline",
 			},