diff --git a/components/contas/account-card.tsx b/components/contas/account-card.tsx
index f080e69..97375a3 100644
--- a/components/contas/account-card.tsx
+++ b/components/contas/account-card.tsx
@@ -71,7 +71,7 @@ export function AccountCard({
 	].filter((action) => typeof action.onClick === "function");
 
 	return (
-		<Card className={cn("h-full w-96 gap-0", className)}>
+		<Card className={cn("h-full w-full gap-0", className)}>
 			<CardContent className="flex flex-1 flex-col gap-4">
 				<div className="flex items-center gap-2">
 					{icon ? (
diff --git a/components/contas/accounts-page.tsx b/components/contas/accounts-page.tsx
index eca7509..e41130f 100644
--- a/components/contas/accounts-page.tsx
+++ b/components/contas/accounts-page.tsx
@@ -133,7 +133,7 @@ export function AccountsPage({
 		}
 
 		return (
-			<div className="flex flex-wrap gap-4">
+			<div className="grid gap-4 grid-cols-1 sm:grid-cols-2 xl:grid-cols-3">
 				{list.map((account) => {
 					const logoSrc = resolveLogoSrc(account.logo);