diff --git a/app/Http/Controllers/Admin/UiElementController.php b/app/Http/Controllers/Admin/UiElementController.php
index c638b25..6ed6a8f 100644
--- a/app/Http/Controllers/Admin/UiElementController.php
+++ b/app/Http/Controllers/Admin/UiElementController.php
@@ -27,13 +27,28 @@ class UiElementController extends Controller
     // 頁籤一：UI 元素列表（素材庫）
     // ==================================================================
 
-    public function uiElements()
+    public function uiElements(Request $request)
     {
-        $elements = UiElement::orderByDesc('id')->get();
+        $perPage = (int) $request->input('per_page', 10);
+        $perPage = in_array($perPage, [10, 25, 50, 100], true) ? $perPage : 10;
+
+        $search = trim((string) $request->input('search', ''));
+
+        $query = UiElement::orderByDesc('id');
+        if ($search !== '') {
+            $query->where(function ($q) use ($search) {
+                $q->where('name', 'like', "%{$search}%")
+                    ->orWhere('part_key', 'like', "%{$search}%");
+            });
+        }
+
+        $elements = $query->paginate($perPage)->withQueryString();
 
         return view('admin.app.ui-elements.index', [
             'elements' => $elements,
             'parts' => $this->activeParts(),
+            'perPage' => $perPage,
+            'search' => $search,
         ]);
     }
 
diff --git a/lang/en.json b/lang/en.json
index 405dc89..06a67c9 100644
--- a/lang/en.json
+++ b/lang/en.json
@@ -2348,6 +2348,8 @@
     "Saved and update pushed to machine.": "Saved and update pushed to machine.",
     "Saved. Machine will apply on next sync/reboot.": "Saved. Machine will apply on next sync/reboot.",
     "No data": "No data",
+    "entries": "entries",
+    "Search name or category...": "Search name or category...",
     "Back": "Back",
     "Rename": "Rename",
     "Content Settings": "Content Settings",
diff --git a/lang/zh_TW.json b/lang/zh_TW.json
index 9b92b62..206969e 100644
--- a/lang/zh_TW.json
+++ b/lang/zh_TW.json
@@ -2349,6 +2349,8 @@
     "Saved and update pushed to machine.": "已儲存，並已推送更新到機台（機台將立即重拉並套用）。",
     "Saved. Machine will apply on next sync/reboot.": "已儲存。推送未成功（機台可能離線），將於下次同步／重開機時套用。",
     "No data": "無資料",
+    "entries": "筆",
+    "Search name or category...": "搜尋名稱或類別…",
     "Back": "返回",
     "Rename": "重新命名",
     "Content Settings": "內容設定",
diff --git a/resources/views/admin/app/ui-elements/index.blade.php b/resources/views/admin/app/ui-elements/index.blade.php
index 168198b..2055969 100644
--- a/resources/views/admin/app/ui-elements/index.blade.php
+++ b/resources/views/admin/app/ui-elements/index.blade.php
@@ -9,6 +9,28 @@
         </button>
     </x-app-tabs>
 
+    {{-- 控制列：每頁筆數 + 搜尋 --}}
+    <form method="GET" action="{{ route('admin.app.ui-elements') }}" class="flex flex-wrap items-center justify-between gap-3 mb-4">
+        <div class="flex items-center gap-2 text-sm text-gray-600 dark:text-gray-400">
+            <span>{{ __('Show') }}</span>
+            <select name="per_page" onchange="this.form.submit()" class="luxury-input py-1.5 px-2 text-sm w-auto">
+                @foreach([10, 25, 50, 100] as $n)
+                    <option value="{{ $n }}" {{ $perPage === $n ? 'selected' : '' }}>{{ $n }}</option>
+                @endforeach
+            </select>
+            <span>{{ __('entries') }}</span>
+        </div>
+        <div class="flex items-center gap-2">
+            <input type="text" name="search" value="{{ $search }}" placeholder="{{ __('Search name or category...') }}" class="luxury-input py-2 px-3 text-sm sm:w-72">
+            <button type="submit" class="p-2.5 rounded-xl bg-cyan-500 text-white hover:bg-cyan-600 shadow-lg shadow-cyan-500/25 transition-all active:scale-95" title="{{ __('Search') }}">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="2.5"><path stroke-linecap="round" stroke-linejoin="round" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" /></svg>
+            </button>
+            <a href="{{ route('admin.app.ui-elements') }}" class="p-2.5 rounded-xl bg-slate-100 dark:bg-slate-800 text-slate-500 hover:bg-slate-200 dark:hover:bg-slate-700 transition-all active:scale-95" title="{{ __('Reset') }}">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="2.5"><path stroke-linecap="round" stroke-linejoin="round" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" /></svg>
+            </a>
+        </div>
+    </form>
+
     <div class="overflow-x-auto">
         <table class="min-w-full bg-white dark:bg-gray-800 rounded-lg overflow-hidden">
             <thead class="bg-gray-100 dark:bg-gray-700">
@@ -49,6 +71,10 @@
         </table>
     </div>
 
+    <div class="mt-4">
+        {{ $elements->links() }}
+    </div>
+
     {{-- 新增 UI 元素 Modal --}}
     <div x-show="showCreate" x-cloak class="fixed inset-0 z-50 overflow-y-auto" @keydown.escape.window="showCreate = false">
         <div class="flex items-center justify-center min-h-screen px-4 pt-4 pb-20 text-center sm:p-0">