CSP Builder & Validator Online — Free Content Security Policy Generator
CSP Builder & Validator
Build and validate Content Security Policy headers with security scoring.
Build, validate, and optimize Content Security Policy headers. Detect unsafe directives, get a security score, and generate CSP for your website. Runs entirely in your browser.
Keywords: csp, csp generator, csp builder, csp validator, Content Security Policy, Content Security Policy generator, csp header, csp tester, csp scanner, xss protection, security headers, csp online, free csp tool
Tags: security, headers, csp
How to CSP Builder & Validator Online
Enter your current CSP header value in the text area, or use the visual builder to create directives step by step.
Select which directives you need (script-src, style-src, img-src, etc.) and add allowed sources for each.
Click 'Analyze' to validate your CSP and get a security score from A (strong) to F (critical issues).
Review any warnings or errors — the tool suggests fixes for insecure settings like '*' or 'unsafe-inline'.
Copy the optimized CSP header and add it to your web server configuration or meta tag.
For testing, enable 'Report-Only' mode to see violations without blocking content.
CSP Builder & Validator Features
Visual CSP builder with clickable directives — no need to write header syntax manually.
Security scoring from A-F with detailed analysis of each directive.
Detection of common CSP vulnerabilities: '*' wildcards, 'unsafe-inline', 'unsafe-eval'.
Suggestions for improving your policy with specific, actionable fixes.
Optimized CSP output that removes redundant sources and tightens security.
Preset policies: Strict, Typical Web App, CDN-friendly, and WordPress templates.
Preset examples for quick starting points with common configurations.
Keyboard shortcuts: ⌘↵ to analyze, ⌘⇧C to copy, ⌘⇧K to clear, ⌘⇧E for examples.
JSON view for programmatic access and API integration.
Works entirely in your browser — no CSP data is ever sent to any server.
Frequently Asked Questions
- What is a Content Security Policy (CSP)?
- Content Security Policy (CSP) is an HTTP header that helps prevent XSS attacks by specifying which sources of content are allowed to load on your website. It tells the browser what scripts, styles, images, fonts, and other resources are trusted. Without CSP, malicious scripts can run if an attacker finds an XSS vulnerability.
- How do I use the CSP Builder tool?
- Simply enter your current CSP header value in the text area and click 'Analyze'. Or use the visual builder to select directives and add sources by clicking the + buttons. The tool will validate your policy and give you a security score with suggestions.
- What does the security score mean?
- The score ranges from 0-100: A (90-100) means strong security with minimal risks, B (75-89) is good but has minor issues, C (60-74) needs improvement, D (40-59) has significant security risks, and F (0-39) indicates critical vulnerabilities that should be fixed immediately.
- How do I fix 'unsafe-inline' in script-src?
- Replace 'unsafe-inline' with nonces or hashes. Nonces: add 'nonce-<base64-value>' to script-src and a nonce attribute to your script tags. Hashes: add 'sha256-<base64-hash>' for each specific inline script. This is more secure but requires updating your HTML templates. For quick fixes, use 'strict-dynamic' with a nonce.
- Can I test CSP without blocking content?
- Yes, use Content-Security-Policy-Report-Only header instead of Content-Security-Policy. Violations will be reported to your report-uri but not blocked. Our tool lets you generate CSP for either mode with the 'Report-Only' toggle.
- What's the minimum CSP I need?
- At minimum, include: default-src 'self' as a baseline, script-src with specific domains (never '*'), object-src 'none' to block plugins, and frame-ancestors 'none' to prevent clickjacking. More restrictive is always better for security. Start strict and relax only when needed.
- Where do I add the CSP header?
- Add the Content-Security-Policy header to your web server: Nginx (add_header), Apache (Header set), or Express/Node.js (helmet middleware). For testing, add as a meta tag: <meta http-equiv="Content-Security-Policy" content="...". Server headers are more reliable than meta tags.
- How do I report CSP violations?
- Add report-uri or report-to directive pointing to a violationreporting endpoint. For example: report-uri https://your-domain.com/csp-report. Use services like report-uri.com or build your own endpoint to collect and analyze violation reports.