Build Content-Security-Policy headers visually. No more syntax headaches.
Content Security Policy (CSP) is an HTTP header that tells browsers which sources of content are allowed to load on your page. It's the most effective defense against Cross-Site Scripting (XSS) attacks — if a malicious script is injected into your page, CSP prevents it from executing if its source isn't whitelisted.
CSP works through directives that control specific resource types: script-src for JavaScript, style-src for CSS, img-src for images, and default-src as a fallback. The value 'self' means "same origin only," while 'none' blocks the resource type entirely.
The most impactful quick win is script-src 'self' — this blocks all inline scripts and scripts from other domains. For sites using Google Fonts, analytics, or CDNs, you'll need to add those domains explicitly. object-src 'none' blocks Flash and other plugins. This tool lets you build the header visually instead of memorizing the syntax.
This tool in other languages:
Français:
Générateur d'en-tête CSP
Español:
Generador de encabezado CSP
Deutsch:
CSP-Header-Generator
Português:
Gerador de cabeçalho CSP
日本語:
CSPヘッダージェネレーター
中文:
CSP 安全策略头生成器
한국어:
CSP 헤더 생성기
العربية:
مولد رأس CSP
Pick the directives you need (default-src, script-src, style-src, etc.) and add sources for each ('self', specific domains, 'unsafe-inline', etc.). The full CSP header string is generated live and copyable with one click.
CSP is an HTTP header that tells the browser which sources of scripts, styles, images, and other resources are allowed to load. A correctly configured CSP blocks the vast majority of XSS attacks by preventing malicious injected scripts from executing, even if an attacker manages to inject content into your page.
default-src is the fallback for every resource type not explicitly set. script-src (and style-src, img-src, font-src, etc.) override the default for that specific resource type. Set a restrictive default-src 'self' and open up specific types as needed.
Avoid it for script-src — it undoes much of CSP's XSS protection. For style-src, it's sometimes unavoidable (many libraries inject inline styles), but prefer nonces or hashes. If you must use 'unsafe-inline', pair it with 'nonce-xyz' so only explicitly-marked inline content is allowed.
Use Content-Security-Policy-Report-Only instead of Content-Security-Policy. The browser reports violations to the console (and optionally to a reporting endpoint) but doesn't actually block anything. Deploy in report-only mode first, fix the violations you see, then switch to enforcement.