Key features
Flags SDK
Feature Flags
The Flags SDK is a free, open-source library that gives you the tools you need to use feature flags in Next.js and SvelteKit applications. It works with any flag provider, custom setups, or no provider at all.
Flags SDK Reference
- Framework-native: Built specifically for Next.js (App Router, Pages Router, Middleware) and SvelteKit
- Provider-agnostic: Works with any flag provider or custom adapters
- Type-safe: Full TypeScript support with type inference
- Optimized for performance: Uses precompute pattern for static generation
- Integrated: Works seamlessly with Flags Explorer and Vercel observability features
Copy page
flags-sdk.dev, the official source of truth for the Flags SDK.
Core concepts
import { flag } from'flags/next';
exportconstshowNewFeature=flag({
Flags are defined using the flag() function. Each flag has a key and a decide function that returns the flag's value:
key:'show-new-feature',
});
decide: () =>false,
description:'Show the new dashboard feature',
The decide function determines a flag's value. It can be sync or async, and can access request context:
key:'experimental-ui',
},
Flags can have multiple options for A/B testing and experimentation:
decide:async () => {
exportconstexperimentalUI=flag({
constuser=awaitgetCurrentUser();
returnuser?.betaAccess ===true;
options: [
key:'theme',
{ value:'dark', label:'Dark Theme' },
exportconsttheme=flag({
{ value:'light', label:'Light Theme' },
],
});
decide: () =>'auto',
{ value:'auto', label:'Auto' },
The precompute pattern generates multiple versions of static pages with different flag values:
Reading flag values
options: [
],
{ value:'a' },
decide: () =>'a',
key:'layout-variant',
exportconstprecompute= [layoutVariant];
});
{ value:'b' },
Call your flag functions to read their values:
exportconstlayoutVariant=flag({
Learn more about precompute on flags-sdk.dev.
constisEnabled=awaitshowNewFeature();
constcurrentTheme=awaittheme();
Report flag values for observability (automatic with SDK):
import { reportValue } from'flags';
reportValue('my-flag',true);
Handle flag overrides from Flags Explorer (automatic with SDK integrations):
import { getOverrides } from'flags/next';
constoverrides=awaitgetOverrides();
Create a Flags API endpoint for Flags Explorer:
import { createFlagsDiscoveryEndpoint, getProviderData } from'flags/next';
import*as flags from'#/flags';
exportconstGET=createFlagsDiscoveryEndpoint(async () => {
returngetProviderData(flags);
});
Framework-specific guides
- Next.js: Getting started with Next.js
- SvelteKit: Getting started with SvelteKit
Provider adapters
Complete API reference
The Flags SDK works with many providers out of the box:
For the full API documentation, including all functions, types, and advanced patterns, visit:
Last updated July 15, 2026
Cross-link map: Flags SDK Reference (/docs/flags/flags-sdk-reference)From the Vercel docs graph (built 2026-09-21T05:26:59.511Z), spanning vercel.com docs + KB, nextjs.org, ai-sdk.dev, and other Vercel documentation sites. Full graph as JSON: https://vercel.com/docs/graph.jsonSemantically closest pagesUsing the Flags SDK with Vercel Flags — Integrate Vercel Flags into your Next.js or SvelteKit application using the Flags SDK.Quickstart — Learn how to start using the Flags SDK in your Next.js project.Quickstart — Using the Flags SDK in SvelteKitGetting started with Flags Explorer — Learn how to set up the Flags Explorer so you can see and override your application's feature flagsVercel FlagsPrerequisitesFlags — Control feature visibility, run experiments, and ship with confidence using Vercel's feature flags platform.This page links to (9)flags — The flags package provides the core functionality for integrating with Vercel.flags/react — APIs for working with feature flags in React.flags/next — APIs for working with feature flags in Next.js.flags/sveltekit — APIs for working with feature flags in SvelteKit.Quickstart — Learn how to start using the Flags SDK in your Next.js project.Vercel FlagsGetting started with Flags Explorer — Learn how to set up the Flags Explorer so you can see and override your application's feature flagsObservability — Track feature flag evaluations and analyze their impact with Web Analytics.Getting Started with Vercel Flags — Create your first feature flag and evaluate it in your application using the Flags SDK, OpenFeature, or the core libraryPages that link here (8)By site: vercel-changelog (1) · vercel-docs (7)From vercel-changelogVercel Flags is now generally availableFrom vercel-docsFlags — Control feature visibility, run experiments, and ship with confidence using Vercel's feature flags platform.Flags Explorer — View and override your application's feature flags from the Vercel ToolbarGetting started with Flags Explorer — Learn how to set up the Flags Explorer so you can see and override your application's feature flagsMarketplace — Connect your preferred feature flag provider through the Vercel Marketplace for a unified flags experience.Observability — Track feature flag evaluations and analyze their impact with Web Analytics.Integrate flags with Vercel Web Analytics — Learn how to tag your page views and custom events with feature flagsUsing the Flags SDK with Vercel Flags — Integrate Vercel Flags into your Next.js or SvelteKit application using the Flags SDK.
