CSP Policy Builder
Build Content Security Policy headers, configure CSP directives, add trusted sources, and copy production-ready security header output directly in your browser.
Policy Setup
Choose a starting preset, then customize directives and trusted sources. Start with report-only mode when testing a new CSP on a live website.
Trusted Source Shortcuts
Add common trusted source groups quickly, then review each directive below. Avoid broad sources unless your site truly needs them.
Add space-separated hosts, schemes, hashes, nonces, or CSP keywords for this directive.
Add space-separated hosts, schemes, hashes, nonces, or CSP keywords for this directive.
Add space-separated hosts, schemes, hashes, nonces, or CSP keywords for this directive.
Add space-separated hosts, schemes, hashes, nonces, or CSP keywords for this directive.
Add space-separated hosts, schemes, hashes, nonces, or CSP keywords for this directive.
Add space-separated hosts, schemes, hashes, nonces, or CSP keywords for this directive.
Add space-separated hosts, schemes, hashes, nonces, or CSP keywords for this directive.
Add space-separated hosts, schemes, hashes, nonces, or CSP keywords for this directive.
Add space-separated hosts, schemes, hashes, nonces, or CSP keywords for this directive.
Add space-separated hosts, schemes, hashes, nonces, or CSP keywords for this directive.
Reporting Options
Reporting endpoints help test policies safely. Report-only mode is usually better while discovering what your site needs.
Generated CSP Output
Content-Security-Policy: default-src 'self'; script-src 'self'; style-src 'self'; img-src 'self' data:; font-src 'self'; connect-src 'self'; object-src 'none'; frame-ancestors 'none'; base-uri 'self'; form-action 'self'; upgrade-insecure-requests
Building Content Security Policy Headers Safely
Content Security Policy is a browser security layer that helps limit where scripts, styles, images, fonts, frames, and network requests can load from. A well-planned CSP can reduce the impact of cross-site scripting, injection bugs, unexpected third-party resources, and risky page embedding.
This CSP Policy Builder gives you a practical way to assemble a policy directive by directive. You can start with a balanced preset, add trusted sources, generate report-only headers for testing, and copy output for HTTP headers, meta tags, Nginx, Apache, or JSON documentation.
Creating a CSP Without Guessing Every Directive
- Choose a strict, balanced, or compatibility preset.
- Enable the directives your site needs.
- Add trusted sources for scripts, styles, images, fonts, and connections.
- Use report-only mode while testing on a live website.
- Copy the generated CSP output and review browser reports before enforcing the final policy.
Common CSP Policy Builder Use Cases
- Creating a first CSP header for a new website or app.
- Testing stricter CSP rules in report-only mode.
- Documenting approved third-party script, image, and API sources.
- Reducing risky inline scripts and broad wildcard permissions.
- Preparing Nginx or Apache header snippets for deployment.
- Reviewing CSP directives while debugging blocked browser resources.
Example Content Security Policy
default-src 'self'; script-src 'self'; style-src 'self'; img-src 'self' data:; font-src 'self'; connect-src 'self'; object-src 'none'; frame-ancestors 'none'; base-uri 'self'; form-action 'self'
Why Report-Only Mode Matters
A strict CSP can accidentally block scripts, styles, API calls, images, analytics, payment widgets, or embedded content if the policy does not include the correct sources. Report-only mode lets browsers send violation reports without enforcing the policy.
For production sites, it is safer to test in report-only mode, review browser console messages and reporting data, then gradually enforce a policy once you understand which sources are required.
Frequently Asked Questions
What is a CSP policy?
A Content Security Policy is a browser security policy that tells the browser which sources are allowed for scripts, styles, images, fonts, connections, frames, and other page resources.
Should I use enforce mode or report-only mode?
Use report-only mode while testing a new or changed CSP. Use enforce mode once you have reviewed violations and confirmed that important site features are not blocked.
Is unsafe-inline recommended?
It is usually better to avoid unsafe-inline when possible. Some older sites need it temporarily, but nonces, hashes, and moving inline code into separate files are safer long-term options.
Can I use a CSP meta tag?
A meta tag can work for some CSP directives, but HTTP headers are generally preferred and support more complete behavior. Use the meta output only when a header is not available.
Does this tool validate every browser behavior?
No. It helps build a policy, but you should test the generated CSP in your browser, review console messages, and check your production monitoring before enforcing a strict policy.
Are my sources uploaded anywhere?
No. The policy is built directly in your browser, and your source values are not uploaded to a server.