> ## Documentation Index
> Fetch the complete documentation index at: https://docs.useshipd.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Create a variant flag

> Define a flag with named variants and read it with getVariant.

## Overview

A variant flag serves one of a fixed set of string values. In this guide you add `search-variant` with the variants `control`, `semantic`, and `hybrid`, push it, and switch on the served value in code.

## Steps

**1. Define the flag**

```ts TypeScript theme={null}
// shipd.config.ts
import { defineFlags } from "shipdit/config";

export default defineFlags({
  "search-variant": {
    type: "variant",
    variants: ["control", "semantic", "hybrid"] as const,
    default: "control",
    description: "Search ranking variant",
    tags: ["search"],
  },
});
```

```go Go theme={null}
// Entries inside config.ShipdConfig (import github.com/alasti-company/useshipd.com/sdks/go/config).
"search-variant": {Type: "variant", Default: "control",
    Variants: []string{"control", "semantic", "hybrid"}},
```

For Go, add definitions to `Config` in `shipd.config.go`, then run `shipd push`. See [Define flags in code](/config-as-code/define-flags#go-definitions) for the complete file.

`default` must be one of `variants`. TypeScript checks this at compile time; Go's `ShipdConfig` validates it when exporting. In TypeScript, keep `as const` to preserve literal variants.

**2. Push it**

```bash theme={null}
shipd push --project web-app --env production
```

**3. Evaluate it**

```ts TypeScript theme={null}
// src/search.ts
const variant = shipd.getVariant("search-variant", { userId: "usr_8f2k19" });
// "control" | "semantic" | "hybrid"

switch (variant) {
  case "semantic":
    return semanticSearch(query);
  case "hybrid":
    return hybridSearch(query);
  default:
    return controlSearch(query);
}
```

```go Go theme={null}
// search.go
variant := client.GetVariant("search-variant", shipd.EvaluationContext{UserID: "usr_8f2k19"})
switch variant {
case "semantic":
    return semanticSearch(query)
case "hybrid":
    return hybridSearch(query)
default:
    return controlSearch(query)
}
```

In React:

```tsx src/components/search.tsx theme={null}
const variant = useVariant("search-variant");
```

See [`getVariant`](/reference/sdk#getvariant).

**4. Choose who gets which variant**

On the flag page in the dashboard, set **Fallthrough** to a variant, or add rules whose **Serve** is a variant. Click **Save environment**.

To split users randomly across variants, see [Run an A/B test](/flags/experiments).

## Create it without a config file

```bash theme={null}
shipd flags create --key search-variant --type variant --variants control,semantic,hybrid
```

`--variants` is required with `--type variant`. See [CLI reference](/reference/cli).


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.