🛡️

CSP Builder

Visual Content Security Policy header generator with directive toggles, presets, and security rating.

csp buildercontent security policy generatorcsp header generatorcsp policy builder

Presets

Security Rating

Permissive (30/100)

Directives

default-src
script-src
style-src
img-src
font-src
connect-src
media-src
frame-src
object-src
base-uri
form-action
frame-ancestors

Warnings

  • Missing 'default-src': browsers use default-src as a fallback for other directives.

Generated CSP

HTTP Header
<meta> Tag

What is CSP Builder?

CSP Builder is a free online tool that helps you visually construct Content Security Policy (CSP) headers for your website. Toggle individual directives, pick source keywords like 'self' or 'unsafe-inline', add custom domains, and instantly see the generated header string and equivalent meta tag. A built-in security rating and warnings panel highlight potential issues before you deploy.

Common Use Cases

New Web Projects

Start with a strict preset and relax only the directives your application actually needs, following the principle of least privilege.

Migrating Legacy Sites

Gradually build a CSP by enabling one directive at a time, testing in report-only mode, and tightening sources as you remove inline scripts.

Security Audits

Quickly evaluate and adjust an existing CSP header by toggling sources and reviewing the warnings panel for unsafe combinations.

Team Collaboration

Generate a human-readable CSP string and share it with your team, along with the meta tag variant for static HTML deployments.

How to Use This Tool

  1. Choose a preset (Strict, Moderate, Permissive, or API-only) to pre-fill common configurations
  2. Enable or disable individual directives using the checkboxes
  3. Toggle source keywords (self, none, unsafe-inline, unsafe-eval, strict-dynamic) per directive
  4. Add custom domains in the text input for each directive (comma or space separated)
  5. Copy the generated HTTP header or meta tag from the output section

Frequently Asked Questions

What is a Content Security Policy?
A Content Security Policy (CSP) is an HTTP response header that tells browsers which sources of content are allowed to load on your page. It helps prevent cross-site scripting (XSS), clickjacking, and other code-injection attacks.
Should I use the HTTP header or the meta tag?
The HTTP header is preferred because it supports all directives including frame-ancestors and report-uri. The meta tag is a convenient fallback for static sites where you cannot control server headers.
Why does the tool warn about unsafe-inline?
Using 'unsafe-inline' allows any inline script or style to execute, which significantly weakens your CSP against XSS attacks. Prefer nonce-based or hash-based approaches when possible.
Is my CSP data sent to any server?
No. Everything runs entirely in your browser. No data is transmitted or stored anywhere.

Related Tools

Learn More