Build Content Security Policy headers locally. Free, private, runs in your browser.
100% private — your files and text never leave your browser. All processing happens locally on your device.
Content-Security-Policy: default-src 'self'; script-src 'self' 'nonce-PLACEHOLDER'; style-src 'self' 'unsafe-inline'; img-src 'self' data: blob: https:; connect-src 'self' https://api.example.com; font-src 'self' data:; object-src 'none'; base-uri 'self'; form-action 'self'; frame-ancestors 'none'
CSP Generator Report Mode: HTTP header Directives: 10 Issues: None.
CSP Generator assembles Content Security Policy directives into an HTTP header or meta tag. Source-expression validation catches obvious typos such as semicolons, malformed directives, and invalid tokens.
The default policy includes practical placeholders for nonces, report endpoints, and common sources. Replace placeholders in your application code before enforcing the policy.
A strict CSP can break production pages by blocking scripts, styles, images, fonts, frames, workers, or API calls. Use Report-Only mode and browser reports before switching to enforcement.
No. It only builds a policy from the directives and source expressions you enter.
Yes. CSP can block scripts, styles, images, frames, fonts, workers, or API calls. Test with Content-Security-Policy-Report-Only first.
Yes. You can use placeholders such as 'nonce-PLACEHOLDER' or hash placeholders, then replace them in your app.
Prefer an HTTP header. Meta tag mode is available for quick prototypes but cannot reliably support directives such as frame-ancestors and reporting.
No. It validates source-expression shape locally but does not inspect browser reports or fetch URLs.