DevFlow logoDevFlow
ToolsPipelinesExploreDocsPricing
⌘F
DashboardPipeline BuilderAnalytics

Try Pro — Free 7 days

No credit card required

CSP Builder & Validator Online — Free Content Security Policy Generator

How to CSP Builder & Validator Online

  1. 1

    Enter your current CSP header value in the text area, or use the visual builder to create directives step by step.

  2. 2

    Select which directives you need (script-src, style-src, img-src, etc.) and add allowed sources for each.

  3. 3

    Click 'Analyze' to validate your CSP and get a security score from A (strong) to F (critical issues).

  4. 4

    Review any warnings or errors — the tool suggests fixes for insecure settings like '*' or 'unsafe-inline'.

  5. 5

    Copy the optimized CSP header and add it to your web server configuration or meta tag.

  6. 6

    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.

Related Developer Tools

  • Hash GeneratorGenerate and verify cryptographic hashes with multiple algorithms.
  • Password GeneratorGenerate secure passwords, passphrases, and PINs with strength analysis.
  • HTTP Headers AnalyzerAnalyze HTTP response headers for security, caching, and compliance issues.