CSP Header Builder

All values stay in your browser. Nothing is sent to the server.

Presets

default-src

Fallback for fetch-related directives when they are not set. Restricts scripts, styles, images, etc. by default.

'none' — block all sources

'self' — same origin only

'all' — allow all (not recommended)

data: — data URIs

https: — any HTTPS origin

'unsafe-inline' — inline scripts/styles (weakens XSS protection)

'unsafe-eval' — eval() and similar (avoid in production)

script-src

Restricts where JavaScript can load from. Use 'self' for same-origin; avoid 'unsafe-inline' in production if you can use nonces or hashes.

'none' — block all sources

'self' — same origin only

'all' — allow all (not recommended)

data: — data URIs

https: — any HTTPS origin

'unsafe-inline' — inline scripts/styles (weakens XSS protection)

'unsafe-eval' — eval() and similar (avoid in production)

'unsafe-hashes' — allow hashes for event handlers (use with care)

'strict-dynamic' — trust scripts loaded by allowed scripts

style-src

Restricts where stylesheets and inline styles can load from. 'unsafe-inline' is often needed for legacy or CMS-driven styles.

'none' — block all sources

'self' — same origin only

'all' — allow all (not recommended)

data: — data URIs

'unsafe-inline' — inline scripts/styles (weakens XSS protection)

'unsafe-hashes' — allow hashes for event handlers (use with care)

img-src

Restricts where images can load from. data: and https: are common for external or embedded images.

'none' — block all sources

'self' — same origin only

'all' — allow all (not recommended)

data: — data URIs

blob: — blob URLs

https: — any HTTPS origin

connect-src

Restricts URLs for fetch, XHR, WebSocket, and EventSource. Add API origins in extra origins below.

'none' — block all sources

'self' — same origin only

'all' — allow all (not recommended)

https: — any HTTPS origin

font-src

Restricts where fonts can load from. data: is often needed for inline or base64 fonts.

'none' — block all sources

'self' — same origin only

'all' — allow all (not recommended)

data: — data URIs

frame-src

Restricts where frames (iframes) can load from. Use 'none' to block all, or allow specific origins.

'none' — block all sources

'self' — same origin only

'all' — allow all (not recommended)

https: — any HTTPS origin

frame-ancestors

Restricts who can embed this page in a frame. 'none' prevents framing (clickjacking defence); 'self' allows same-origin only.

'none' — block all sources

'self' — same origin only

base-uri

Restricts the URLs that can be used in a document's <base> element. 'self' limits to same-origin.

'none' — block all sources

'self' — same origin only

form-action

Restricts where forms can be submitted. 'self' keeps submissions on your origin.

'none' — block all sources

'self' — same origin only

Reporting

Report only (do not enforce)

Send violation reports but do not block content. Use to test a policy before enforcing.

report-uri (URL)

Deprecated but widely supported. POST endpoint that receives JSON violation reports.

report-to (endpoint name)

Modern alternative: name of an endpoint defined in Report-To header.

Other options

upgrade-insecure-requests

Upgrade HTTP to HTTPS for matching requests.

block-all-mixed-content

Block mixed content (HTTPS page loading HTTP resources).

Use as the value of the Content-Security-Policy response header. Copy includes the header name.

About

Content-Security-Policy helps prevent XSS and injection. Tick source keywords and add origins (URLs or schemes) below. Use report-uri or report-to to receive violation reports.

Presets

Strict: Minimal sources, no unsafe-inline/unsafe-eval. Use when you can use nonces or hashes.
General: Typical defaults for many sites: inline styles allowed, images from self and HTTPS.
Open: Permissive for development or demos. Not suitable for production.