# X-Frame-Options Header — Syntax, Values & Examples

> Controls whether the page may be shown inside a frame, protecting against clickjacking.

Clickjacking hides your page in an invisible iframe on another site and tricks users into clicking it. X-Frame-Options tells the browser whether framing is allowed at all (`DENY`) or only by your own site (`SAMEORIGIN`).

- Type: Response header
- Category: Security
- Defined in: [RFC 7034 — HTTP Header Field X-Frame-Options](https://www.rfc-editor.org/rfc/rfc7034)

## Syntax

```http
X-Frame-Options: DENY | SAMEORIGIN
```

## Values

| Value | Meaning |
|---|---|
| `DENY` | never allow the page in a frame |
| `SAMEORIGIN` | allow framing only by pages on the same origin |
| `ALLOW-FROM <uri>` | obsolete — ignored by modern browsers |

## Examples

```http
X-Frame-Options: DENY
```

never allow framing

```http
X-Frame-Options: SAMEORIGIN
```

allow your own pages to frame it

## Good to know

- CSP `frame-ancestors` is the modern replacement and can name specific origins: `frame-ancestors 'self' https://partner.example`.
- When both are present, browsers that support `frame-ancestors` use it and ignore X-Frame-Options.
- It does nothing in a `<meta>` tag — send it as a header.

## How to set X-Frame-Options

### Express

```
res.set("X-Frame-Options", "DENY");
```

### Next.js (next.config.js)

```
module.exports = {
  async headers() {
    return [
      {
        source: "/(.*)",
        headers: [{ key: "X-Frame-Options", value: "DENY" }],
      },
    ];
  },
};
```

### nginx

```
add_header X-Frame-Options "DENY" always;
```

### Apache (.htaccess)

```
Header always set X-Frame-Options "DENY"
```

## Check it

Fetch only the response headers and filter for X-Frame-Options. In the browser, it's under Response Headers in DevTools → Network.

```sh
curl -sI https://example.com/ | grep -i '^x-frame-options:'
```

## FAQ

### How do I let one specific site frame my page?

X-Frame-Options can't — ALLOW-FROM was dropped by browsers. Use Content-Security-Policy: frame-ancestors 'self' https://partner.example.

## Related headers

- [Content-Security-Policy](https://www.devkult.com/headers/content-security-policy.md): Restricts where a page may load scripts, styles, images and frames from — the main defence against cross-site scripting.
- [X-Content-Type-Options](https://www.devkult.com/headers/x-content-type-options.md): With nosniff, stops browsers guessing a response's type, so a text file can't be run as a script.
- [Strict-Transport-Security](https://www.devkult.com/headers/strict-transport-security.md): Tells browsers to use only HTTPS for the site for a set period, blocking downgrade attacks.

## Further reading

- [Security headers checklist](https://www.devkult.com/blog/security-headers-checklist.md)
- [Security headers generator](https://www.devkult.com/tools/security/security-headers-generator.md)

Open the interactive page: https://www.devkult.com/headers/x-frame-options