diff --git a/src/context/QRContext.tsx b/src/context/QRContext.tsx
new file mode 100644
index 0000000..2e3d8fe
--- /dev/null
+++ b/src/context/QRContext.tsx
@@ -0,0 +1,56 @@
+import { createContext, useContext, useReducer, type ReactNode } from 'react';
+import type { QRState, QRAction } from '../types';
+
+const initialState: QRState = {
+  selectedType: 'url',
+  formData: {
+    url: { websiteUrl: '' }, text: { text: '' },
+    wifi: { networkName: '', encryption: 'WPA', password: '' },
+    email: { emailAddress: '', subject: '', message: '' },
+    sms: { phoneNumber: '', message: '' },
+    image: { imageUrl: '' }, pdf: { pdfUrl: '' },
+    mp3: { mp3Url: '' }, app: { appStoreLink: '' },
+    vcard: { firstName: '', lastName: '', phone: '', email: '', company: '', jobTitle: '', website: '', address: '' },
+  },
+  theme: 'paper', pattern: 'square',
+  qrColor: '#3D2B1F', bgColor: null,
+  downloadSize: 'social',
+  logoDataUrl: null,
+  cornerSquareStyle: 'square',
+  cornerDotStyle: 'square',
+  gradientEnabled: false,
+  gradientColor2: '#EC4899',
+  frameLabel: '',
+};
+
+function reducer(state: QRState, action: QRAction): QRState {
+  switch (action.type) {
+    case 'SET_TYPE':           return { ...state, selectedType: action.payload };
+    case 'SET_FORM_FIELD':     return { ...state, formData: { ...state.formData, [action.qrType]: { ...(state.formData[action.qrType] as unknown as Record<string,string>), [action.field]: action.value } } };
+    case 'SET_THEME':          return { ...state, theme: action.payload };
+    case 'SET_PATTERN':        return { ...state, pattern: action.payload };
+    case 'SET_QR_COLOR':       return { ...state, qrColor: action.payload };
+    case 'SET_BG_COLOR':       return { ...state, bgColor: action.payload };
+    case 'SET_DOWNLOAD_SIZE':  return { ...state, downloadSize: action.payload };
+    case 'SET_LOGO':           return { ...state, logoDataUrl: action.payload };
+    case 'SET_CORNER_SQUARE':  return { ...state, cornerSquareStyle: action.payload };
+    case 'SET_CORNER_DOT':     return { ...state, cornerDotStyle: action.payload };
+    case 'SET_GRADIENT':       return { ...state, gradientEnabled: action.payload };
+    case 'SET_GRADIENT_COLOR2':return { ...state, gradientColor2: action.payload };
+    case 'SET_FRAME_LABEL':    return { ...state, frameLabel: action.payload };
+    default:                   return state;
+  }
+}
+
+const QRContext = createContext<{ state: QRState; dispatch: React.Dispatch<QRAction> } | null>(null);
+
+export function QRProvider({ children }: { children: ReactNode }) {
+  const [state, dispatch] = useReducer(reducer, initialState);
+  return <QRContext.Provider value={{ state, dispatch }}>{children}</QRContext.Provider>;
+}
+
+export function useQR() {
+  const ctx = useContext(QRContext);
+  if (!ctx) throw new Error('useQR must be used inside QRProvider');
+  return ctx;
+}