ekofyi
All tools
Livesecurityshipped v1.0.0

Content Security Policy Builder

Build Content-Security-Policy headers visually without memorizing directive syntax. Toggle sources for each directive (script-src, style-src, img-src, etc.), add domains, and see the generated header in real-time. Includes explanations for each directive and common presets for popular frameworks.

cspsecurityheaderspolicyxss
presets:

Directives

default-srcFallback for all fetch directives
script-srcJavaScript sources
style-srcCSS sources
img-srcImage sources
font-srcFont sources
connect-srcfetch, XHR, WebSocket, EventSource
frame-srcFrame/iframe sources
media-srcAudio/video sources
object-srcPlugin sources (Flash, etc.)
base-uriRestricts <base> URLs
form-actionForm submission URLs
frame-ancestorsWho can embed this page
report-uriViolation reporting endpoint
Header (enforce)
Content-Security-Policy: default-src 'none'; script-src 'self'; style-src 'self'; img-src 'self' data:; connect-src 'self'; font-src 'self'; base-uri 'self'; form-action 'self'; frame-ancestors 'none'
Header (report-only)
Content-Security-Policy-Report-Only: default-src 'none'; script-src 'self'; style-src 'self'; img-src 'self' data:; connect-src 'self'; font-src 'self'; base-uri 'self'; form-action 'self'; frame-ancestors 'none'
Meta tag
<meta http-equiv="Content-Security-Policy" content="default-src 'none'; script-src 'self'; style-src 'self'; img-src 'self' data:; connect-src 'self'; font-src 'self'; base-uri 'self'; form-action 'self'; frame-ancestors 'none'">

Security analysis

ℹPolicy looks reasonable. Test in report-only mode first.

🔒 Always test new policies with Content-Security-Policy-Report-Only first.