# style-src-attr (/en/docs/web-security/policies/content-security-policy/directives/style-src-attr)



The `style-src-attr` directive in a Content Security Policy (CSP) controls inline `style=` attributes, the CSS written directly on an element such as `style="color:red"`. It does not cover stylesheets or `<style>` blocks, those belong to [`style-src-elem`](/en/docs/web-security/policies/content-security-policy/directives/style-src-elem). Use `style-src-attr` to apply a separate rule, usually stricter, to inline style attributes.

A minimal safe policy for this directive, blocking every inline `style=` attribute:

```http
Content-Security-Policy: style-src-attr 'none'
```

## Fallback chain [#fallback-chain]

`style-src-attr` falls back to [`style-src`](/en/docs/web-security/policies/content-security-policy/directives/style-src), then to [`default-src`](/en/docs/web-security/policies/content-security-policy/directives/default-src). If you do not set `style-src-attr`, inline `style=` attributes are checked against `style-src`, and if that is absent, against `default-src`. Setting `style-src-attr` replaces `style-src` for `style=` attributes only.

Most policies do not need `style-src-attr`, since `style-src` already covers `style=` attributes. The usual reason to set it is to block inline style attributes outright with `'none'` while still allowing stylesheets through `style-src`.

## Values [#values]

`style-src-attr` takes the same value kinds as `style-src`, but only a few of them can match an inline `style=` attribute.

| Value             | Status  | Description                                                                              |
| ----------------- | ------- | ---------------------------------------------------------------------------------------- |
| `'none'`          | ✅ Good  | Blocks every inline `style=` attribute. Used alone.                                      |
| `'sha256-...'`    | ✅ Good  | Digest of the exact attribute text; matches only together with `'unsafe-hashes'`.        |
| `'unsafe-hashes'` | ❌ Risky | Lets hashes match `style=` attributes; re-enables that surface, use as a migration step. |
| `'report-sample'` | ✅ Good  | Adds the first 40 characters of the blocked attribute to reports.                        |
| `'unsafe-inline'` | ❌ Risky | Allows every `style=` attribute, including injected ones.                                |

The grammar also accepts `'self'`, host, scheme, and nonce sources, but an inline attribute has no URL for them to match. In practice `style-src-attr` is used with a small set of values:

* `'none'` to block every inline `style=` attribute.
* `'unsafe-inline'` to allow them all (discouraged).
* A [hash](/en/docs/web-security/policies/content-security-policy/values/csp-hashes-nonce) together with the [`'unsafe-hashes'`](/en/docs/web-security/policies/content-security-policy/values/csp-keywords) keyword, which is what lets a hash match a `style=` attribute.

A nonce cannot tag an attribute, so inline `style=` attributes are allowed by `'unsafe-inline'` or by a hash plus `'unsafe-hashes'`, not by a nonce.

## Examples [#examples]

Block all inline style attributes while letting stylesheets load normally:

```http
Content-Security-Policy:
    style-src 'self' 'nonce-r4nd0m';
    style-src-attr 'none'
```

## Common use [#common-use]

`style-src-attr 'none'` is the clean target, it forces styling into stylesheets and nonce-tagged `<style>` blocks. Where a legacy template sets a few static `style=` attributes you cannot remove yet, hash them and add `'unsafe-hashes'`, then plan to migrate them. The [hash generator](/tools/csp-hash) computes the digest and the [CSP evaluator](/tools/csp-evaluator) flags weak rules. See also the how-to on [removing unsafe-inline](/en/blog/unsafe-inline-csp).

## Security notes [#security-notes]

Inline `style=` attributes are a vector for CSS injection used in phishing overlays and selector-based data exfiltration. `style-src-attr 'none'` removes that vector.

* `'unsafe-inline'` allows every `style=` attribute, including injected ones, so it undoes the protection.
* `'unsafe-hashes'` only widens hash matching to `style=` attributes (and inline event handlers). It does not allow whole inline `<style>` blocks on its own.

## Known bypasses and risks [#known-bypasses-and-risks]

The main risk is leaving inline style attributes open by accident. If `style-src-attr` is unset and `style-src` (or `default-src`) carries `'unsafe-inline'`, every `style=` attribute applies, even with a tight rule on stylesheets. Set `style-src-attr 'none'` to close that gap.

Hashed attributes are fixed strings, so any change to the attribute text breaks the hash. Treat hashed `style=` attributes as a migration step toward removing them, not a permanent state.

## Recommendation [#recommendation]

Nonce or hash the styles you control on `style-src` and block inline `style=` attributes outright:

```http
Content-Security-Policy:
    style-src 'self' 'nonce-{RANDOM}';
    style-src-attr 'none'
```

This keeps styling in stylesheets and nonce-tagged `<style>` blocks, with no `'unsafe-inline'` anywhere. If a legacy attribute cannot move yet, hash it with `'unsafe-hashes'` as a temporary step and plan its removal.

## Reporting [#reporting]

A blocked inline style attribute produces a [csp-violation report](/en/docs/web-security/reporting-api/reports/csp-violation) with `style-src-attr` as the effective directive. Add `'report-sample'` to include a short sample so you can locate the attribute. CentralCSP aggregates these reports so you can find and remove inline `style=` attributes before tightening the directive.

## Browser support [#browser-support]

Widely supported across current browsers.

## See also [#see-also]

* [style-src](/en/docs/web-security/policies/content-security-policy/directives/style-src)
* [style-src-elem](/en/docs/web-security/policies/content-security-policy/directives/style-src-elem)
* [default-src](/en/docs/web-security/policies/content-security-policy/directives/default-src)
* [CSP keyword values](/en/docs/web-security/policies/content-security-policy/values/csp-keywords)
* [Hash generator](/tools/csp-hash)

## Sources [#sources]

* [MDN, CSP style-src-attr](https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Content-Security-Policy/style-src-attr)
* [W3C, Content Security Policy Level 3](https://www.w3.org/TR/CSP3/)