Content Security Policy (CSP) Generator

Pick what your site loads — scripts, styles, images, fonts, analytics, embeds — and get a Content-Security-Policy that allows exactly that, with warnings for risky settings. Copy it as an HTTP header, a <meta> tag, or ready-made config for nginx, Apache, Vercel, Netlify and Express.

Runs in your browserUpdated
Your site uses

Directives

Space-separated sources: 'self', 'none', hosts like https://cdn.example.com, data:, blob:.

Your policy


  
  

    Your data never leaves your computer. All processing happens 100% locally in your browser.

    How to use the CSP Generator

    1. Tick the services your site uses (analytics, fonts, video embeds, payments). Their hosts are added to the right directives.
    2. Adjust any directive — for example add your own CDN to script-src or img-src.
    3. Start with Report-only on a live site: browsers log violations without blocking anything.
    4. Copy the policy as a header, meta tag or server config, deploy it, and check the browser console for blocked resources.

    What a Content Security Policy does

    A Content-Security-Policy (CSP) tells the browser which sources a page may load scripts, styles, images, fonts, frames and connections from. If an attacker injects a <script> (cross-site scripting), the browser refuses to run it because its source isn’t allowed. It is one of the most effective defenses against XSS and data theft.

    Key directives

    DirectiveControls
    default-srcFallback for every resource type you don’t list
    script-srcJavaScript — the most important one
    style-src, img-src, font-srcCSS, images and web fonts
    connect-srcfetch, XHR, WebSocket and analytics beacons
    frame-src / frame-ancestorsWhich iframes you embed / who may embed your page (clickjacking)
    object-src 'none', base-uri 'self'Close two classic XSS bypasses — always set them

    Rolling it out safely

    Deploy with Content-Security-Policy-Report-Only first and watch the browser console (or a report-to endpoint) for a few days. Fix what breaks, then switch to the enforcing header. Avoid 'unsafe-inline' and 'unsafe-eval' in script-src; use nonces or hashes for the few inline scripts you need.

    Check a live site with the Security Headers Checker.

    Also searched as: content security policy generator, csp header, content-security-policy builder, csp nginx, csp meta tag, script-src, csp google analytics, csp report-only.

    Tools that pair well with the CSP Generator

    • .htaccess Generator — Tick the rules you need — HTTPS, canonical host, redirects, compression, caching, security headers, protected files — and get a clean, commented .htaccess file.
    • HTTP Header Checker — Fetch any URL and see exactly what the server sends back — status code, redirect chain and every response header, with a plain-English explanation of the ones that matter for SEO, caching and security.
    • security.txt Generator — Fill in a few fields to generate a standards-compliant /.well-known/security.txt that tells researchers how to report security issues to you.
    • Redirect Generator — Paste your old and new URLs (from a spreadsheet, CSV or two columns) and get redirect rules for your server or platform — plus checks for chains, loops, duplicates and trailing-slash traps before you go live.

    Frequently asked questions

    How do I add a Content Security Policy to my site?
    Send it as an HTTP response header (best) via your server or host config — nginx, Apache, Vercel and Netlify snippets are generated here — or add it as a meta tag in the page head.
    What is the difference between Content-Security-Policy and Report-Only?
    The normal header blocks anything not allowed. Report-Only blocks nothing and only reports violations, so you can test a policy on a live site safely.
    Why does my CSP block Google Analytics?
    GA needs its hosts in script-src, img-src and connect-src (googletagmanager.com and google-analytics.com, plus region endpoints). Tick Google Analytics above to add them all.
    Can I use frame-ancestors in a meta tag?
    No. frame-ancestors, report-uri and sandbox only work in the HTTP header; browsers ignore them in a meta tag.
    Can I install CSP Generator as a web app and use it offline?
    Yes. CSP Generator is an installable web app (PWA) — installed from your browser, not downloaded from an app store. Click Install app at the top of this page in Chrome or Edge (Windows, macOS, Linux, ChromeOS) or on Android, use Share → Add to Home Screen on iPhone and iPad, or File → Add to Dock in Safari 17+ on a Mac. It then opens in its own window with its own icon, and because it runs entirely in your browser it keeps working offline. Firefox on desktop can’t install web apps. How installing works.

    Related tools