diff --git a/src/components/RightPanel/FrameLabelSection.tsx b/src/components/RightPanel/FrameLabelSection.tsx
new file mode 100644
index 0000000..585a279
--- /dev/null
+++ b/src/components/RightPanel/FrameLabelSection.tsx
@@ -0,0 +1,46 @@
+import { useQR } from '../../context/QRContext';
+
+const PRESETS = ['SCAN ME', 'SCAN HERE', 'VISIT US', 'FOLLOW US', 'CONNECT'];
+
+export function FrameLabelSection() {
+ const { state, dispatch } = useQR();
+ const set = (v: string) => dispatch({ type: 'SET_FRAME_LABEL', payload: v });
+
+ return (
+
+
Frame Label
+
+
set(e.target.value)}
+ placeholder="e.g. SCAN ME"
+ className="h-11 px-3 rounded-[10px] text-[13px] font-semibold uppercase tracking-widest outline-none transition-all"
+ style={{ background: 'var(--bg-input)', border: '1px solid var(--border-sub)', color: 'var(--text-primary)', letterSpacing: '0.18em' }}
+ onFocus={e => { e.currentTarget.style.borderColor = '#7C6FE0'; e.currentTarget.style.boxShadow = '0 0 0 3px rgba(124,111,224,0.12)'; }}
+ onBlur={e => { e.currentTarget.style.borderColor = 'var(--border-sub)'; e.currentTarget.style.boxShadow = 'none'; }}
+ />
+
+ {/* Quick presets */}
+
+ {PRESETS.map(p => (
+
+ ))}
+ {state.frameLabel && !PRESETS.includes(state.frameLabel) && (
+
+ )}
+
+
Appears below the QR in preview & download.
+
+ );
+}