🛡️
Developer/CSP Generator

CSP Generator

Build a Content-Security-Policy header with per-directive guidance. Hardens against XSS by default.

100% LOCAL12 directivesSafe defaultsLive policy100% local
Fallback for every other fetch directive
JavaScript sources — the most important XSS defense
Stylesheets
Images and icons
Web fonts
fetch/XHR/WebSocket endpoints
Audio and video sources
Flash/Java embeds — should be none
Iframe sources
Limits <base> href — set to self to block injection
Where <form> may submit
Who may embed this page — replaces X-Frame-Options
12 directives · 308 chars
[object Object] 'self'; [object Object] 'self'; [object Object] 'self' 'unsafe-inline'; [object Object] 'self' data:; [object Object] 'self'; [object Object] 'self'; [object Object] 'self'; [object Object] 'none'; [object Object] 'none'; [object Object] 'self'; [object Object] 'self'; [object Object] 'none'
Data Source & Legal Disclaimer
Effective: 2026Last updated: TodayUpdate: Manual review
Sources: Content Security Policy — MDN

The policy is generated locally from your selections. Nothing is uploaded.

See all data sources & update policy →

What a CSP actually defends against — illustrated

A Content-Security-Policy is a whitelist the browser enforces: scripts, styles, images, and connections may only come from origins you allow. Its headline win is XSS mitigation — even if an attacker injects a <script> tag, the browser refuses to run it unless script-src permits its origin. Use 'none' for things you truly do not need (object-src, frame-ancestors), avoid unsafe-inline in script-src if at all possible, and ship the header with report-only mode first (Content-Security-Policy-Report-Only) to catch breakage before enforcing.

Browser fetches → checked against your whitelist → blocked if not allowed
Page requestsscript · style · imgfont · connect · frameCSP whitelistdefault-src · script-srcimg-src · frame-ancestors…allowed → loads'self', data:, …else → blockede.g. injected evil.jsXSS bluntedinjected scriptnever executestest with Content-Security-Policy-Report-Only first — then flip to enforcing

The policy is metadata about your page: the browser refuses any resource outside the allow-list.

Hardening a marketing site — Priya's policy

Priya ships a static marketing site with self-hosted fonts and one Google Analytics tag, and wants a tight policy.

  1. Start from defaults:The tool pre-fills safe defaults: everything self, object-src and frame-ancestors none
  2. Allow the exceptions:She adds the Analytics origin to script-src and connect-src, and data: to img-src for inline icon SVGs — four edits total
  3. Remove unsafe-inline from scripts:style-src keeps unsafe-inline for her inline critical CSS, but script-src does not — the strictest line in the whole policy
  4. Roll out safely:She deploys as Report-Only for a week, watches the console reports come back empty, then flips the header to enforcing
↩ Back to generator

About this tool

What is this tool?

Generate a Content-Security-Policy header online free: 12 guided directives with safe defaults and live preview.

12 directivesSafe defaultsLive policy100% local

Why CSP Is the XSS Backstop

Input validation and output encoding reduce the chance of injection, but a Content-Security-Policy limits the blast radius when something slips through: a browser that refuses to run scripts from unapproved origins cannot execute an injected payload. CSP is the last line of defense, and it costs one header.

Directive by Directive, in Plain English

The generator exposes 12 directives - default-src, script-src, style-src, img-src, font-src, connect-src, media-src, object-src, frame-src, frame-ancestors, base-uri, and form-action - each with a one-line explanation of what it gates. Safe defaults pre-load the form so the common case (self everywhere, nothing exotic) is one click, and every edit updates the policy live.

Frequently Asked Questions

What is a Content-Security-Policy header?

It is an HTTP header that tells browsers exactly which sources of scripts, styles, images, and connections your page may load. Anything not allow-listed is blocked, which is the single most effective defense against cross-site scripting (XSS) attacks.

What are the safe defaults?

The generator starts from a conservative baseline: default-src set to self, scripts and styles limited to self plus unsafe-inline only where frameworks genuinely need it, and object-src set to none. Each of the 12 directives ships with a plain-English explanation so you know what you are allowing before you allow it.

How do I test the policy without breaking my site?

Deploy it first as Content-Security-Policy-Report-Only instead of the enforcing header. Browsers report violations to the console without blocking anything; once the reports are quiet, switch to the enforcing header.

Related tools

Joke of the Day
Sep 7

Why did the elephant paint its toenails red?

100% Free, Forever

Keep Tools Free for Everyone

No paywalls, no signups, no data sold. Built by a solo developer who believes useful tools should be accessible to everyone.

Support me on Ko-fi— keep tools free

100% of proceeds go towards hosting & building more free tools.