diff --git a/resources/views/admin/settings/index.blade.php b/resources/views/admin/settings/index.blade.php
index 6cbd986..4dcd79b 100644
--- a/resources/views/admin/settings/index.blade.php
+++ b/resources/views/admin/settings/index.blade.php
@@ -105,6 +105,24 @@
             </div>
         </div>
 
+        {{-- Design / Theme --}}
+        <div class="bg-white rounded shadow p-6">
+            <h3 class="font-semibold mb-4">Design</h3>
+            <p class="text-sm text-gray-500 mb-4">Wählen Sie die Hauptfarbe Ihres Shops. Die Änderung wird sofort nach dem Speichern aktiv.</p>
+            <input type="hidden" name="theme_name" id="theme_name" value="{{ $settings['theme_name'] ?: 'default' }}">
+            <div class="flex flex-wrap gap-3">
+                @foreach(config('themes') as $key => $theme)
+                <button type="button"
+                    onclick="document.getElementById('theme_name').value='{{ $key }}'; document.querySelectorAll('.theme-btn').forEach(b=>b.classList.remove('ring-2','ring-offset-2','ring-gray-800')); this.classList.add('ring-2','ring-offset-2','ring-gray-800');"
+                    class="theme-btn flex items-center gap-2 px-4 py-2 rounded border text-sm font-medium transition
+                           {{ ($settings['theme_name'] ?: 'default') === $key ? 'ring-2 ring-offset-2 ring-gray-800' : '' }}">
+                    <span class="w-5 h-5 rounded-full inline-block border border-gray-300" style="background:{{ $theme['primary'] }}"></span>
+                    {{ $theme['name'] }}
+                </button>
+                @endforeach
+            </div>
+        </div>
+
         <div class="flex gap-3">
             <button type="submit" class="bg-blue-600 text-white px-6 py-2 rounded hover:bg-blue-700">Einstellungen speichern</button>
             <a href="{{ route('admin.shipping.index') }}" class="border px-6 py-2 rounded hover:bg-gray-50 text-sm">Versandkosten verwalten →</a>