diff --git a/frontend/src/design-system/DesignSystemApp.tsx b/frontend/src/design-system/DesignSystemApp.tsx
index edb916a..cc517c7 100644
--- a/frontend/src/design-system/DesignSystemApp.tsx
+++ b/frontend/src/design-system/DesignSystemApp.tsx
@@ -43,6 +43,22 @@ function DesignSystemShell() {
     root.classList.add(theme);
   }, [theme]);
 
+  // 단축키: 'a' 입력 시 테마 전환 (input/textarea 등 편집 중에는 무시)
+  useEffect(() => {
+    const handler = (e: KeyboardEvent) => {
+      if (e.key !== 'a' && e.key !== 'A') return;
+      if (e.ctrlKey || e.metaKey || e.altKey) return;
+      const target = e.target as HTMLElement | null;
+      const tag = target?.tagName;
+      if (tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT' || target?.isContentEditable) {
+        return;
+      }
+      setTheme((prev) => (prev === 'dark' ? 'light' : 'dark'));
+    };
+    window.addEventListener('keydown', handler);
+    return () => window.removeEventListener('keydown', handler);
+  }, []);
+
   // 스크롤 감지로 현재 네비 하이라이트
   useEffect(() => {
     const observer = new IntersectionObserver(
@@ -87,9 +103,11 @@ function DesignSystemShell() {
           <button
             type="button"
             onClick={() => setTheme(theme === 'dark' ? 'light' : 'dark')}
-            className="px-3 py-1 rounded-md border border-slate-600/40 text-xs text-label hover:bg-slate-700/30"
+            title="단축키: A"
+            className="px-3 py-1 rounded-md border border-slate-600/40 text-xs text-label hover:bg-slate-700/30 flex items-center gap-1.5"
           >
-            {theme === 'dark' ? '☾ Dark' : '☀ Light'}
+            <span>{theme === 'dark' ? '☾ Dark' : '☀ Light'}</span>
+            <kbd className="text-[9px] font-mono text-hint border border-slate-600/40 rounded px-1 py-0">A</kbd>
           </button>
         </div>
       </header>