diff --git a/app/Livewire/Mod/Listing.php b/app/Livewire/Mod/Listing.php
index f8ee7de..78942e2 100644
--- a/app/Livewire/Mod/Listing.php
+++ b/app/Livewire/Mod/Listing.php
@@ -9,6 +9,7 @@ use Illuminate\Contracts\View\View;
 use Illuminate\Database\Eloquent\Collection;
 use Illuminate\Support\Facades\Cache;
 use Livewire\Attributes\Computed;
+use Livewire\Attributes\Locked;
 use Livewire\Attributes\Session;
 use Livewire\Attributes\Url;
 use Livewire\Component;
@@ -32,8 +33,18 @@ class Listing extends Component
     #[Url]
     public string $order = 'created';
 
+    /**
+     * The number of results to show on a single page.
+     */
+    #[Session]
     #[Url]
-    public int $resultsPerPage = 12;
+    public int $perPage = 12;
+
+    /**
+     * The options that are available for the per page setting.
+     */
+    #[Locked]
+    public array $perPageOptions = [6, 12, 24, 50];
 
     /**
      * The SPT versions filter value.
@@ -83,6 +94,8 @@ class Listing extends Component
      */
     public function render(): View
     {
+        $this->validatePerPage();
+
         // Fetch the mods using the filters saved to the component properties.
         $filters = [
             'query' => $this->query,
@@ -90,13 +103,32 @@ class Listing extends Component
             'order' => $this->order,
             'sptVersions' => $this->sptVersions,
         ];
-        $mods = (new ModFilter($filters))->apply()->paginate($this->resultsPerPage);
+
+        $mods = (new ModFilter($filters))->apply()->paginate($this->perPage);
 
         $this->redirectOutOfBoundsPage($mods);
 
         return view('livewire.mod.listing', compact('mods'));
     }
 
+    /**
+     * Validate that the option selected is an option that is available by setting it to the closest available version.
+     */
+    public function validatePerPage(): void
+    {
+        $this->perPage = collect($this->perPageOptions)->pipe(function ($data) {
+            $closest = null;
+
+            foreach ($data as $item) {
+                if ($closest === null || abs($this->perPage - $closest) > abs($item - $this->perPage)) {
+                    $closest = $item;
+                }
+            }
+
+            return $closest;
+        });
+    }
+
     /**
      * Check if the current page is greater than the last page. Redirect if it is.
      */
diff --git a/resources/views/livewire/mod/listing.blade.php b/resources/views/livewire/mod/listing.blade.php
index 820b3dc..c25c960 100644
--- a/resources/views/livewire/mod/listing.blade.php
+++ b/resources/views/livewire/mod/listing.blade.php
@@ -105,14 +105,14 @@
                         <div class="flex">
                             {{-- Large display can show full text --}}
                             <button type="button" @click="isResultsPerPageOpen = !isResultsPerPageOpen" class="hidden lg:flex group inline-flex justify-center text-sm font-medium text-gray-700 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100" id="menu-button" :aria-expanded="isResultsPerPageOpen.toString()" aria-haspopup="true">
-                                {{ __('Results Per Page') }}
+                                {{ __('Per Page') }}
                                 <svg class="-mr-1 ml-1 h-5 w-5 flex-shrink-0 text-gray-400 group-hover:text-gray-500" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                                     <path fill-rule="evenodd" d="M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z" clip-rule="evenodd" />
                                 </svg>
                             </button>
                             {{-- Only show selected number on smaller screens --}}
-                            <button type="button" @click="isResultsPerPageOpen = !isResultsPerPageOpen" class="lg:hidden group inline-flex justify-center text-sm font-medium text-gray-700 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100" id="menu-button" :aria-expanded="isResultsPerPageOpen.toString()" aria-haspopup="true">
-                                {{ $resultsPerPage }}
+                            <button type="button" @click="isResultsPerPageOpen = !isResultsPerPageOpen" class="lg:hidden group inline-flex justify-center text-sm font-medium text-gray-700 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100" id="menu-button" :aria-expanded="isResultsPerPageOpen.toString()" aria-haspopup="true" title="{{ __(':perPage results per page', ['perPage' => $perPage]) }}">
+                                {{ __(':perPage/p', ['perPage' => $perPage]) }}
                                 <svg class="-mr-1 ml-1 h-5 w-5 flex-shrink-0 text-gray-400 group-hover:text-gray-500" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                                     <path fill-rule="evenodd" d="M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z" clip-rule="evenodd" />
                                 </svg>
@@ -129,11 +129,9 @@
                              class="absolute top-7 right-0 z-10 flex w-full min-w-[12rem] flex-col divide-y divide-slate-300 overflow-hidden rounded-xl border border-gray-300 bg-gray-100 dark:divide-gray-700 dark:border-gray-700 dark:bg-gray-800"
                              role="menu" aria-orientation="vertical" aria-labelledby="menu-button" tabindex="-1">
                             <div class="flex flex-col py-1.5">
-                                <x-filter-menu-item filterName="resultsPerPage" filter="6" :currentFilter="$resultsPerPage">6</x-filter-menu-item>
-                                <x-filter-menu-item filterName="resultsPerPage" filter="12" :currentFilter="$resultsPerPage">12</x-filter-menu-item>
-                                <x-filter-menu-item filterName="resultsPerPage" filter="24" :currentFilter="$resultsPerPage">24</x-filter-menu-item>
-                                <x-filter-menu-item filterName="resultsPerPage" filter="50" :currentFilter="$resultsPerPage">50</x-filter-menu-item>
-                                <x-filter-menu-item filterName="resultsPerPage" filter="100" :currentFilter="$resultsPerPage">100</x-filter-menu-item>
+                                @foreach($perPageOptions as $option)
+                                    <x-filter-menu-item filterName="perPage" :filter="$option" :currentFilter="$perPage">{{ $option }}</x-filter-menu-item>
+                                @endforeach
                             </div>
                         </div>
                     </div>