diff --git a/frontend/src/components/EditChoreModal.tsx b/frontend/src/components/EditChoreModal.tsx
new file mode 100644
index 0000000..b4f97a7
--- /dev/null
+++ b/frontend/src/components/EditChoreModal.tsx
@@ -0,0 +1,303 @@
+import React, { useState, useEffect } from 'react';
+import { choreService, Chore, UpdateChoreRequest } from '../api/chores';
+import api from '../api/axios';
+
+interface User {
+  id: number;
+  username: string;
+  full_name: string;
+  is_active: boolean;
+}
+
+interface EditChoreModalProps {
+  choreId: number;
+  onClose: () => void;
+  onSuccess: () => void;
+}
+
+const EditChoreModal: React.FC<EditChoreModalProps> = ({ choreId, onClose, onSuccess }) => {
+  const [chore, setChore] = useState<Chore | null>(null);
+  const [formData, setFormData] = useState<UpdateChoreRequest>({});
+  const [users, setUsers] = useState<User[]>([]);
+  const [isLoading, setIsLoading] = useState(true);
+  const [isSaving, setIsSaving] = useState(false);
+  const [error, setError] = useState('');
+
+  useEffect(() => {
+    loadChoreAndUsers();
+  }, [choreId]);
+
+  const loadChoreAndUsers = async () => {
+    try {
+      const [choreData, usersData] = await Promise.all([
+        choreService.getChore(choreId),
+        api.get<User[]>('/api/v1/users')
+      ]);
+      
+      setChore(choreData);
+      setUsers(usersData.data.filter(u => u.is_active));
+      
+      // Initialize form with current chore data
+      setFormData({
+        title: choreData.title,
+        description: choreData.description || '',
+        room: choreData.room,
+        frequency: choreData.frequency,
+        points: choreData.points,
+        assigned_user_ids: choreData.assigned_users.map(u => u.id),
+        due_date: choreData.due_date ? choreData.due_date.split('T')[0] : '',
+      });
+    } catch (error) {
+      console.error('Failed to load chore:', error);
+      setError('Failed to load chore details');
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setError('');
+    setIsSaving(true);
+
+    try {
+      const submitData = { ...formData };
+      if (submitData.due_date) {
+        submitData.due_date = `${submitData.due_date}T23:59:59`;
+      }
+      
+      await choreService.updateChore(choreId, submitData);
+      onSuccess();
+    } catch (err: any) {
+      let errorMessage = 'Failed to update chore';
+      
+      if (err.response?.data) {
+        const errorData = err.response.data;
+        if (Array.isArray(errorData.detail)) {
+          errorMessage = errorData.detail
+            .map((e: any) => `${e.loc?.join('.')}: ${e.msg}`)
+            .join(', ');
+        } else if (typeof errorData.detail === 'string') {
+          errorMessage = errorData.detail;
+        } else if (typeof errorData === 'string') {
+          errorMessage = errorData;
+        }
+      }
+      
+      setError(errorMessage);
+    } finally {
+      setIsSaving(false);
+    }
+  };
+
+  const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>) => {
+    const { name, value } = e.target;
+    setFormData(prev => ({
+      ...prev,
+      [name]: name === 'points' ? parseInt(value) || 0 : value,
+    }));
+  };
+
+  const toggleUserAssignment = (userId: number) => {
+    setFormData(prev => {
+      const currentIds = prev.assigned_user_ids || [];
+      const isAssigned = currentIds.includes(userId);
+      
+      return {
+        ...prev,
+        assigned_user_ids: isAssigned
+          ? currentIds.filter(id => id !== userId)
+          : [...currentIds, userId]
+      };
+    });
+  };
+
+  if (isLoading) {
+    return (
+      <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center p-4 z-50">
+        <div className="bg-white rounded-lg shadow-xl p-8">
+          <div className="animate-spin rounded-full h-12 w-12 border-b-2 border-blue-600 mx-auto"></div>
+          <p className="mt-4 text-gray-600">Loading chore...</p>
+        </div>
+      </div>
+    );
+  }
+
+  if (!chore) {
+    return null;
+  }
+
+  return (
+    <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center p-4 z-50">
+      <div className="bg-white rounded-lg shadow-xl max-w-2xl w-full max-h-[90vh] overflow-y-auto">
+        <div className="p-6">
+          <div className="flex justify-between items-center mb-6">
+            <h2 className="text-2xl font-bold text-gray-900">Edit Chore</h2>
+            <button
+              onClick={onClose}
+              className="text-gray-400 hover:text-gray-600 transition-colors"
+            >
+              <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
+              </svg>
+            </button>
+          </div>
+
+          <form onSubmit={handleSubmit} className="space-y-4">
+            {error && (
+              <div className="bg-red-50 border border-red-200 text-red-700 px-4 py-3 rounded">
+                {error}
+              </div>
+            )}
+
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+              <div className="md:col-span-2">
+                <label htmlFor="title" className="block text-sm font-medium text-gray-700 mb-2">
+                  Chore Title *
+                </label>
+                <input
+                  id="title"
+                  name="title"
+                  type="text"
+                  value={formData.title}
+                  onChange={handleChange}
+                  className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent text-gray-900"
+                  required
+                />
+              </div>
+
+              <div className="md:col-span-2">
+                <label htmlFor="description" className="block text-sm font-medium text-gray-700 mb-2">
+                  Description
+                </label>
+                <textarea
+                  id="description"
+                  name="description"
+                  value={formData.description}
+                  onChange={handleChange}
+                  rows={2}
+                  className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent text-gray-900"
+                />
+              </div>
+
+              <div>
+                <label htmlFor="room" className="block text-sm font-medium text-gray-700 mb-2">
+                  Room/Area *
+                </label>
+                <input
+                  id="room"
+                  name="room"
+                  type="text"
+                  value={formData.room}
+                  onChange={handleChange}
+                  className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent text-gray-900"
+                  required
+                />
+              </div>
+
+              <div>
+                <label htmlFor="frequency" className="block text-sm font-medium text-gray-700 mb-2">
+                  Frequency *
+                </label>
+                <select
+                  id="frequency"
+                  name="frequency"
+                  value={formData.frequency}
+                  onChange={handleChange}
+                  className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent text-gray-900"
+                  required
+                >
+                  <option value="on_trigger">On Trigger</option>
+                  <option value="daily">Daily</option>
+                  <option value="weekly">Weekly</option>
+                  <option value="fortnightly">Fortnightly</option>
+                  <option value="monthly">Monthly</option>
+                </select>
+              </div>
+
+              <div>
+                <label htmlFor="points" className="block text-sm font-medium text-gray-700 mb-2">
+                  Points ⭐
+                </label>
+                <input
+                  id="points"
+                  name="points"
+                  type="number"
+                  min="0"
+                  value={formData.points}
+                  onChange={handleChange}
+                  className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent text-gray-900"
+                />
+              </div>
+
+              <div>
+                <label htmlFor="due_date" className="block text-sm font-medium text-gray-700 mb-2">
+                  Due Date
+                </label>
+                <input
+                  id="due_date"
+                  name="due_date"
+                  type="date"
+                  value={formData.due_date}
+                  onChange={handleChange}
+                  className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent text-gray-900"
+                />
+              </div>
+            </div>
+
+            {/* Multi-User Assignment */}
+            <div className="border-t border-gray-200 pt-4">
+              <label className="block text-sm font-medium text-gray-700 mb-3">
+                Assign To (select multiple)
+              </label>
+              <div className="grid grid-cols-2 gap-2 max-h-48 overflow-y-auto border border-gray-200 rounded-lg p-3">
+                {users.map(user => (
+                  <label
+                    key={user.id}
+                    className={`flex items-center p-2 rounded cursor-pointer transition-colors ${
+                      formData.assigned_user_ids?.includes(user.id)
+                        ? 'bg-blue-50 border border-blue-300'
+                        : 'hover:bg-gray-50 border border-transparent'
+                    }`}
+                  >
+                    <input
+                      type="checkbox"
+                      checked={formData.assigned_user_ids?.includes(user.id) || false}
+                      onChange={() => toggleUserAssignment(user.id)}
+                      className="w-4 h-4 text-blue-600 rounded focus:ring-2 focus:ring-blue-500"
+                    />
+                    <span className="ml-2 text-sm text-gray-900">{user.full_name}</span>
+                  </label>
+                ))}
+              </div>
+              {formData.assigned_user_ids && formData.assigned_user_ids.length > 0 && (
+                <p className="mt-2 text-sm text-gray-600">
+                  {formData.assigned_user_ids.length} user(s) selected
+                </p>
+              )}
+            </div>
+
+            <div className="flex gap-3 pt-4">
+              <button
+                type="button"
+                onClick={onClose}
+                className="flex-1 px-4 py-2 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition-colors"
+              >
+                Cancel
+              </button>
+              <button
+                type="submit"
+                disabled={isSaving}
+                className="flex-1 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+              >
+                {isSaving ? 'Saving...' : 'Save Changes'}
+              </button>
+            </div>
+          </form>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default EditChoreModal;