Category: Developer tools
CSP Generator
Build a Content-Security-Policy header from directives
Set the source list for each Content-Security-Policy directive — default-src, script-src, style-src and more — and get the finished header value plus a readable table of what each directive allows. Built locally in your browser.
| Directive | Sources |
|---|---|
default-src | 'self' |
script-src | 'self' |
style-src | 'self' 'unsafe-inline' |
img-src | 'self' data: |
font-src | 'self' |
connect-src | 'self' |
frame-ancestors | 'none' |
object-src | 'none' |
base-uri | 'self' |
form-action | 'self' |
upgrade-insecure-requests | — |
default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' data:; font-src 'self'; connect-src 'self'; frame-ancestors 'none'; object-src 'none'; base-uri 'self'; form-action 'self'; upgrade-insecure-requests;
Everything on this page is processed in your browser. Nothing is uploaded.
What this tool does
A Content-Security-Policy header tells the browser which sources of scripts, styles, images and other resources a page is allowed to load, which is one of the strongest defenses against cross-site scripting. Each directive takes a space-separated source list such as 'self', 'unsafe-inline', https: or a specific domain, and getting the syntax right by hand is fiddly. This tool builds the header from one field per directive and shows the same policy as a table so you can review what you are actually allowing before shipping it.
How to use it
- Set the source list for each directive you want to restrict.
- Toggle upgrade-insecure-requests or block-all-mixed-content if needed.
- Review the directive table, then copy the header value.
- Send it as the Content-Security-Policy response header, or start with Content-Security-Policy-Report-Only while testing.
Privacy
This tool runs entirely in your browser. Your input is never uploaded, stored or shared — closing the tab removes it.
Frequently asked questions
- What does an empty directive mean?
- A directive left blank here is omitted from the header entirely, which usually means it falls back to default-src. Set default-src to a sensible baseline such as 'self' first.
- Should I test with Report-Only first?
- Yes — sending the same header value as Content-Security-Policy-Report-Only instead lets you see what the policy would have blocked, via the browser console or a report-uri, without breaking the page while you tune it.
- Is the policy sent anywhere to be built?
- No. The header string is assembled from your input directly in the browser.