Content Security Policy Generator

Build a CSP header visually, analyze an existing policy, or browse the directive reference. Get an A-F strictness grade instantly.

Last reviewed: April 2026

Reviewed by Shannon Patterson, software engineer · last updated April 2026

New to this tool? Click here for instructions

Presets:

Generated CSP

Add directives above to build your CSP.

HTML Meta Tag:

Paste CSP Header Value

CSP Directives Reference

Directive	Controls	Notes
default-src	All resource types (fallback)	Set to 'none' for maximum security, then explicitly allow each type.
script-src	JavaScript sources	Most important directive. Avoid 'unsafe-inline'. Use nonces or hashes.
style-src	CSS stylesheets	Use nonces to allow inline styles. 'unsafe-inline' is common but weaker.
img-src	Image sources	Include 'data:' if you use base64 images. Add CDN domains.
font-src	Web font sources	Add fonts.gstatic.com for Google Fonts.
connect-src	XHR, fetch, WebSocket	Add all API endpoints your app calls.
frame-src	iframe sources	Use 'none' if you don't embed iframes.
media-src	Video and audio	Add media CDN domains for streaming content.
object-src	Plugins (Flash, etc.)	Set to 'none'. Flash is dead; plugins are a major attack vector.
frame-ancestors	Who can embed this page	Replaces X-Frame-Options. Use 'none' to prevent clickjacking.
base-uri	Allowed values for <base>	Prevents base tag injection attacks. Set to 'self'.
form-action	Form submission targets	Limits where forms can submit data. Set to 'self' usually.

Configure directives above to build your CSP header.

How to Use Content Security Policy Generator

To use the Content Security Policy Generator, start by selecting a preset policy (Strict, Moderate, or Permissive) to load a template policy. Then, customize it according to your site's needs. Each directive can be configured by clicking on source value chips (like 'self' or https: ) to toggle them on/off. Add custom domains in the text field below each directive. Once configured, you can copy the output for use in your server configuration or static HTML pages.

When to Use the Tool in Real Workflows

The Content Security Policy Generator is ideal for developers and security professionals who need to ensure their websites are protected against Cross-Site Scripting (XSS) attacks. It is particularly useful when setting up new projects or when revising existing security policies.

How It Works

The tool allows users to build and analyze Content Security Policy (CSP) headers visually. Users can select a preset policy, customize it, and then copy the output for use in their server configuration or static HTML pages. The tool also provides an analysis mode where users can paste an existing CSP to parse it, see each directive, flag unsafe values, and get a strictness grade.

Tips, Edge Cases, or Limitations

The Content Security Policy Generator is a browser-side tool and does not require any server-side setup. However, it is important to test the generated CSP headers in a staging environment before deploying them to production to ensure they do not break your site. Additionally, the tool does not support all CSP directives, so users should refer to the official CSP documentation for a complete list of directives and their usage.

Frequently Asked Questions

A Content Security Policy (CSP) is an HTTP response header that instructs the browser about which sources of content are permitted to load on a given page.

'unsafe-inline' allows the use of inline scripts and styles, but it can be a security risk. It is generally recommended to avoid using 'unsafe-inline' and instead use nonces or hashes for inline scripts and styles.

The `default-src` directive sets the default policy for all resource types if no other directives are specified. Other directives like `script-src`, `style-src`, and `img-src` specify policies for specific types of resources.

Both the CSP header and the meta tag can be used to set Content Security Policy headers. The header is generally preferred as it is more secure and easier to manage.

It is important to test the generated CSP headers in a staging environment before deploying them to production. This will help ensure that the CSP does not break your site. Additionally, it is recommended to start with a more permissive policy and gradually tighten it as needed.