--- title: Add feature flags you can test in preview deployments description: Put one feature behind a safe default and add Vercel Toolbar overrides so your team can review both states in previews. url: "https://vercel.com/kb/prompts/add-preview-feature-flags" last_updated: 2026-11-07 related_resources: "[Get started with Flags Explorer](https://vercel.com/docs/flags/flags-explorer/getting-started)": "Expose your application’s flags in Vercel Toolbar." "[Flags Explorer reference](https://vercel.com/docs/flags/flags-explorer/reference)": "Configure discovery access, server secrets, and reviewer overrides." "[Vercel Flags environments](https://vercel.com/docs/flags/vercel-flags/dashboard/feature-flag)": "Review environment-specific configuration when using Vercel Flags." --- # Add feature flags you can test in preview deployments Put one feature behind a safe default and add Vercel Toolbar overrides so your team can review both states in previews. Review a feature before enabling it for real users. This prompt adds one feature flag and connects it to the Vercel Toolbar so teammates can inspect both states in preview deployments. Open or import the application and identify the feature you want to gate. The handoff includes prompt text only; repository access, Vercel project access, and credentials must be available separately. Expect a safe default, a preview override flow, and checks that flag states stay isolated between visitors. The prompt prepares the implementation locally and leaves production targeting and release decisions for a separate step. ## Agent prompt ```text Put one existing feature behind a feature flag and make both states reviewable in preview deployments through Vercel Toolbar. Read repository instructions and inspect the framework, package manager, flag provider, installed Flags SDK, environment configuration, authentication, and rendering/cache patterns. If the intended project is missing, ask me to open or import it. Ask which feature to gate if unclear. Reuse the existing provider and SDK integration. If none exists, propose a supported integration for this framework and explain required account setup before assuming it is available. Read installed-version documentation before choosing APIs. Use a descriptive flag name and a default that preserves current behavior. Keep the enabled branch scoped to the chosen feature. Evaluate flags on the server when they control server behavior, private data, or access to a server action. Enforce authorization independently of the flag, including direct requests to the underlying endpoint. A flag override must never grant permissions. Connect flag definitions and observed values to Flags Explorer using its documented integration. Protect discovery and override verification with the supported server-side mechanisms; keep secrets out of the browser bundle. Use Development and Preview configuration intentionally and leave Production targeting unchanged. Inspect credential scoping so a locally supplied key cannot accidentally select production settings. Do not create a general unauthenticated query parameter that enables features. Make preview overrides explicit and reversible. Document how a reviewer selects each state and clears the override. Keep the initial rendered state consistent with hydration and navigation. Inspect caching so one visitor’s override or user-specific evaluation cannot leak to another visitor, and describe any change to static rendering or cache behavior. Using existing test tools, cover the default, enabled state, cleared override, missing provider configuration, invalid override, direct unauthorized endpoint access, and two visitors with different states. Check keyboard access and loading/error behavior in both feature states. Run local checks and document any Toolbar interaction that needs an actual preview deployment. Proceed with local code and fixtures. Ask before provisioning services, changing shared environment variables, deploying, or changing production targeting. Report the implementation, actual checks and results, blocked checks, configuration and local run steps, preview review instructions, and remaining rendering or override limitations. ``` ## Related resources - [Get started with Flags Explorer](https://vercel.com/docs/flags/flags-explorer/getting-started): Expose your application’s flags in Vercel Toolbar. - [Flags Explorer reference](https://vercel.com/docs/flags/flags-explorer/reference): Configure discovery access, server secrets, and reviewer overrides. - [Vercel Flags environments](https://vercel.com/docs/flags/vercel-flags/dashboard/feature-flag): Review environment-specific configuration when using Vercel Flags. ## Try other prompts - [Add regression tests for a critical user flow](/kb/prompts/add-critical-flow-regression-tests): Protect a key Next.js user journey with isolated tests for visible outcomes, failure recovery, and relevant access boundaries. - [Reduce the JavaScript your app sends to browsers](/kb/prompts/reduce-client-javascript): Trim client JavaScript on one Next.js route, measure the difference, and preserve the interactions your users need. ## Reference Architecture Choose a stack and work through the decisions behind it, with curated documentation, guides, templates, and courses to help you build. - [Agent stack](/kb/architecture/agents): Build and operate agents with models, tools, and durable workflows. - [Web applications](/kb/architecture/web): Choose rendering, data, authentication, and caching approaches. - [Backends](/kb/architecture/backends): Choose a runtime, connect services, and run background work. [Browse all stacks](/kb/architecture)