Options

Give infrequent settings enough room without crowding the popup or side panel.

Add an options page

In Settings → Surfaces, click Options. ChromeShip scaffolds the page, registers the manifest, and restarts the runtime.

Edit the options page

Open src/app/options/App.tsx. Build your settings UI with shadcn and Tailwind.

import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
export default function OptionsApp() {
  return (
    <div className="mx-auto max-w-2xl p-8">
      <h1 className="text-2xl font-semibold">Settings</h1>
      <p className="mt-2 text-muted-foreground">Configure your extension preferences.</p>
    </div>
  );
}

When to use options

Put preferences, account management, advanced configuration, and other occasional tasks here. Keep quick actions in a popup and persistent workflows in a side panel.

Next

Persist user preferences with storage. Wire up theme controls. If you're adding auth, see the Supabase Backend guide.