diff --git a/apps/dokploy/components/dashboard/project/add-template.tsx b/apps/dokploy/components/dashboard/project/add-template.tsx
index 0cb5e70cc..f7a6a5469 100644
--- a/apps/dokploy/components/dashboard/project/add-template.tsx
+++ b/apps/dokploy/components/dashboard/project/add-template.tsx
@@ -238,8 +238,8 @@ export const AddTemplate = ({ projectId }: Props) => {
 								className={cn(
 									"grid gap-6",
 									viewMode === "detailed"
-										? "grid-cols-1 sm:grid-cols-2 lg:grid-cols-6"
-										: "grid-cols-2 sm:grid-cols-4 lg:grid-cols-8",
+										? "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5"
+										: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6",
 								)}
 							>
 								{templates?.map((template, index) => (
@@ -340,6 +340,7 @@ export const AddTemplate = ({ projectId }: Props) => {
 											<AlertDialog>
 												<AlertDialogTrigger asChild>
 													<Button
+														variant="secondary"
 														size="sm"
 														className={cn(
 															"w-auto",