diff --git a/src/components/CenterPanel/forms/WiFiForm.tsx b/src/components/CenterPanel/forms/WiFiForm.tsx
new file mode 100644
index 0000000..ec0ee71
--- /dev/null
+++ b/src/components/CenterPanel/forms/WiFiForm.tsx
@@ -0,0 +1,35 @@
+import { useQR } from '../../../context/QRContext';
+import { TextInput } from '../../ui/TextInput';
+import { SegmentedControl } from '../../ui/SegmentedControl';
+import type { WifiEncryption } from '../../../types';
+
+const ENCRYPTION_OPTIONS: { label: string; value: WifiEncryption }[] = [
+  { label: 'WPA', value: 'WPA' },
+  { label: 'WEP', value: 'WEP' },
+  { label: 'None', value: 'None' },
+];
+
+export function WiFiForm() {
+  const { state, dispatch } = useQR();
+  const { networkName, encryption, password } = state.formData.wifi;
+
+  const set = (field: string, value: string) =>
+    dispatch({ type: 'SET_FORM_FIELD', qrType: 'wifi', field, value });
+
+  return (
+    <div className="flex flex-col gap-4">
+      <TextInput label="Network Name" value={networkName} onChange={(v) => set('networkName', v)} placeholder="My WiFi Network" />
+      <div className="flex flex-col gap-2">
+        <label className="text-[15px] font-semibold text-gray-900">Encryption</label>
+        <SegmentedControl
+          options={ENCRYPTION_OPTIONS}
+          value={encryption}
+          onChange={(v) => set('encryption', v)}
+        />
+      </div>
+      {encryption !== 'None' && (
+        <TextInput label="Password" value={password} onChange={(v) => set('password', v)} placeholder="Enter password" type="password" />
+      )}
+    </div>
+  );
+}