> AI agents: this is one page from PostHog's docs. Full index of Markdown docs for LLMs: https://posthog.com/llms.txt
# Web Feature Flags installation
1. 1
## Choose an installation method
Required
You can either add the JavaScript snippet directly to your HTML or install the JavaScript SDK via your package manager.
## HTML snippet
Add this snippet to your website within the `` tag. This can also be used in services like Google Tag Manager:
HTML
```html
```
## JavaScript SDK
Install the PostHog JavaScript library using your package manager. Then, import and initialize the PostHog library with your project token and host:
### npm
```bash
npm install posthog-js
```
### yarn
```bash
yarn add posthog-js
```
### pnpm
```bash
pnpm add posthog-js
```
### bun
```bash
bun add posthog-js
```
JavaScript
```javascript
import posthog from 'posthog-js'
posthog.init('', {
api_host: 'https://us.i.posthog.com',
defaults: '2026-05-30'
})
```
2. 2
## Send events
Recommended
Once installed, PostHog will automatically start capturing events. You can also manually send events to test your integration:
Click around and view a couple pages to generate some events. PostHog automatically captures pageviews, clicks, and other interactions for you.
If you'd like, you can also manually capture custom events:
JavaScript
```javascript
posthog.capture('my_custom_event', { property: 'value' })
```
3. 3
## Use boolean feature flags
Required
Check if a feature flag is enabled:
```javascript
if (posthog.isFeatureEnabled('flag-key')) {
// Do something differently for this user
// Optional: fetch the payload
const matchedFlagPayload = posthog.getFeatureFlagResult('flag-key')?.payload
}
```
4. 4
## Use multivariate feature flags
Optional
For multivariate flags, check which variant the user has been assigned:
```javascript
const matchedFlag = posthog.getFeatureFlagResult('flag-key')
if (matchedFlag?.variant == 'variant-key') { // replace 'variant-key' with the key of your variant
// Do something differently for this user
// Optional: read the payload from the same result
const matchedFlagPayload = matchedFlag?.payload
}
```
5. 5
## Use feature flag payloads
Optional
Feature flags can include payloads with additional data. Fetch the payload like this:
```javascript
const matchedFlagPayload = posthog.getFeatureFlagResult('flag-key')?.payload
```
6. 6
## Ensure flags are loaded
Optional
Every time a user loads a page, we send a request in the background to fetch the feature flags that apply to that user. We store those flags in your chosen persistence option (local storage by default).
This means that for most pages, the feature flags are available immediately — **except for the first time a user visits**.
To handle this, you can use the `onFeatureFlags` callback to wait for the feature flag request to finish:
```javascript
posthog.onFeatureFlags(function (flags, flagVariants, { errorsLoading }) {
// feature flags are guaranteed to be available at this point
if (posthog.isFeatureEnabled('flag-key')) {
// do something
}
})
```
7. 7
## Reload feature flags
Optional
Feature flag values are cached. If something has changed with your user and you'd like to refetch their flag values:
```javascript
posthog.reloadFeatureFlags()
```
8. 8
## Running experiments
Optional
Experiments run on top of our feature flags. Once you've implemented the flag in your code, you run an experiment by creating a new experiment in the PostHog dashboard.
9. 9
## Next steps
Recommended
Now that you're evaluating flags, continue with the resources below to learn what else Feature Flags enables within the PostHog platform.
| Resource | Description |
| --- | --- |
| [Creating a feature flag](/docs/feature-flags/creating-feature-flags.md) | How to create a feature flag in PostHog |
| [Adding feature flag code](/docs/feature-flags/adding-feature-flag-code.md) | How to check flags in your code for all platforms |
| [Framework-specific guides](/docs/feature-flags/tutorials.md#framework-guides) | Setup guides for React Native, Next.js, Flutter, and other frameworks |
| [How to do a phased rollout](/tutorials/phased-rollout.md) | Gradually roll out features to minimize risk |
| [More tutorials](/docs/feature-flags/tutorials.md) | Other real-world examples and use cases |
### Still have questions?
Ask PostHog AI
### Was this page useful?
HelpfulCould be better