diff --git a/src/client/components/SetupsView.tsx b/src/client/components/SetupsView.tsx
index 8254974..531836e 100644
--- a/src/client/components/SetupsView.tsx
+++ b/src/client/components/SetupsView.tsx
@@ -1,8 +1,10 @@
 import { useState } from "react";
+import { useTranslation } from "react-i18next";
 import { useCreateSetup, useSetups } from "../hooks/useSetups";
 import { SetupCard } from "./SetupCard";
 
 export function SetupsView() {
+	const { t } = useTranslation(["setups", "common"]);
 	const [newSetupName, setNewSetupName] = useState("");
 	const { data: setups, isLoading } = useSetups();
 	const createSetup = useCreateSetup();
@@ -22,7 +24,7 @@ export function SetupsView() {
 					type="text"
 					value={newSetupName}
 					onChange={(e) => setNewSetupName(e.target.value)}
-					placeholder="New setup name..."
+					placeholder={t("setups:namePlaceholder")}
 					className="flex-1 px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 				/>
 				<button
@@ -30,7 +32,7 @@ export function SetupsView() {
 					disabled={!newSetupName.trim() || createSetup.isPending}
 					className="px-4 py-2 bg-gray-700 hover:bg-gray-800 disabled:opacity-50 text-white text-sm font-medium rounded-lg transition-colors"
 				>
-					{createSetup.isPending ? "Creating..." : "Create"}
+					{createSetup.isPending ? t("setups:creating") : t("common:actions.create")}
 				</button>
 			</form>
 
@@ -51,7 +53,7 @@ export function SetupsView() {
 				<div className="py-16">
 					<div className="max-w-lg mx-auto text-center">
 						<h2 className="text-xl font-semibold text-gray-900 mb-8">
-							Build your perfect loadout
+							{t("setups:emptyState.title")}
 						</h2>
 						<div className="space-y-6 text-left mb-10">
 							<div className="flex items-start gap-4">
@@ -59,9 +61,9 @@ export function SetupsView() {
 									1
 								</div>
 								<div>
-									<p className="font-medium text-gray-900">Create a setup</p>
+									<p className="font-medium text-gray-900">{t("setups:emptyState.step1Title")}</p>
 									<p className="text-sm text-gray-500">
-										Name your loadout for a specific trip or activity
+										{t("setups:emptyState.step1Description")}
 									</p>
 								</div>
 							</div>
@@ -70,9 +72,9 @@ export function SetupsView() {
 									2
 								</div>
 								<div>
-									<p className="font-medium text-gray-900">Add items</p>
+									<p className="font-medium text-gray-900">{t("setups:emptyState.step2Title")}</p>
 									<p className="text-sm text-gray-500">
-										Pick gear from your collection to include in the setup
+										{t("setups:emptyState.step2Description")}
 									</p>
 								</div>
 							</div>
@@ -81,9 +83,9 @@ export function SetupsView() {
 									3
 								</div>
 								<div>
-									<p className="font-medium text-gray-900">Track weight</p>
+									<p className="font-medium text-gray-900">{t("setups:emptyState.step3Title")}</p>
 									<p className="text-sm text-gray-500">
-										See weight breakdown and optimize your pack
+										{t("setups:emptyState.step3Description")}
 									</p>
 								</div>
 							</div>