CSP Generator
Write a Content-Security-Policy without memorising its syntax. Fill in where each kind of resource may come from, and the generator adds the quotes keywords need, rejects invalid sources, warns about settings that weaken the policy, and writes the header for your server or platform. A built-in helper calculates the SHA-256 hash of an inline script or style.
- Runs in your browser
- No sign-up
- Free to use
How to use CSP Generator
- Pick a preset close to your site, such as Static site or Google Analytics & Fonts.
- Add the hosts your pages load scripts, styles, images, fonts and API calls from.
- Read the notes and fix any warnings.
- Choose the output format, deploy in report-only mode first, then enforce.
CSP Generator features
Every common directive
Fourteen fetch and navigation directives plus upgrade-insecure-requests.
Source validation
Adds missing quotes to keywords and drops invalid sources with a message.
Security review
Flags wildcards, data: scripts, unsafe-inline, unsafe-eval and missing object-src or base-uri.
Inline hashes
Calculates sha256 sources for inline blocks in your browser.
Reporting
report-uri plus report-to with the Reporting-Endpoints header.
Any server
Header, Apache, Nginx, IIS, Netlify, Vercel, Cloudflare, Express, PHP or meta tag.
When to use CSP Generator
- Creating a first policy for a site that has none.
- Allowing Google Analytics, Tag Manager and Google Fonts without opening everything.
- Hashing a small inline script so unsafe-inline can be removed.
- Writing a lock-down policy for an API that never serves HTML.
CSP Generator FAQ
What is a Content-Security-Policy?
An HTTP header that tells the browser which sources of scripts, styles, images and other resources a page may use. Anything not allowed is blocked, so script injected by an attacker usually fails to run.
Will a CSP break my site?
It can, if the site loads something the policy does not list. Deploy with “Report-only mode” first: the browser then reports violations without blocking, so you can complete the policy before enforcing it.
Why are some keywords in single quotes?
Keywords such as 'self', 'none' and 'unsafe-inline' must be quoted, otherwise the browser reads them as host names. The generator adds the quotes for you.
What is the difference between a nonce and a hash?
A nonce is a random value created for each response and placed on each allowed script tag. A hash identifies the exact content of one inline block. Hashes suit static pages; nonces suit pages generated by an application.
Can I put a CSP in a meta tag?
Yes, but frame-ancestors, report-uri, report-to and sandbox are ignored there, and report-only mode is not possible. The header is preferred.
What does strict-dynamic do?
It lets a script trusted by nonce or hash load further scripts, and makes modern browsers ignore host lists. It is the basis of the “strict CSP” approach recommended by Google.
How a Content-Security-Policy works
A Content-Security-Policy is a list of directives separated by semicolons. Each directive names a kind of resource and the sources it may come from: script-src for JavaScript, style-src for CSS, img-src for images, connect-src for fetch and WebSocket connections, and so on. default-src is the fallback for every fetch directive that is not listed. Sources can be the page’s own origin (’self’), specific hosts, whole schemes such as https: or data:, or cryptographic nonces and hashes.
The main purpose is to limit the damage of cross-site scripting. If an attacker manages to insert a script tag or an event handler into a page, a good policy stops it from running because its source is not allowed. That only works if the policy does not allow inline code or every host, which is why this generator is strict about unsafe-inline, wildcards and data: in script-src.
Many real sites still depend on inline scripts and third-party tags, so a perfect policy rarely appears in one step. A practical route is to start with a policy in report-only mode, read the violations reported in the console or to a report endpoint, add the legitimate sources, replace inline code with files or hashes, and switch to enforcing mode when the reports are quiet.
The navigation directives protect more than scripts. object-src ’none’ disables old plug-in content, base-uri stops an injected base tag from changing where relative URLs point, form-action limits where forms can send data, and frame-ancestors decides which sites may display your pages in a frame, replacing the older X-Frame-Options header. upgrade-insecure-requests asks the browser to load http:// resources over https:// instead.
Hashes are a convenient way to keep a few small inline blocks. The hash must be calculated over the exact text inside the tag, including whitespace and line breaks, so even an added space changes it. The helper on this page calculates it in your browser. If the inline code changes with every page view, use a nonce generated by your application instead.