🛡️

Content Security Policy Editor

Build, test, and refine your CSP headers visually. Get instant security scores, scan live sites for resources, and manage policies without writing raw header strings.

Launch App → See Features ↓

Features

Everything you need to create, validate, and deploy Content Security Policies.

🎛️

Visual Directive Editor

Edit all 12 CSP directives through an intuitive card-based interface. Color-coded badges for keywords, domains, hashes, and unsafe values make policies easy to read at a glance.

🏆

Security Scoring

Get a 100-point security rating with letter grades. Detailed findings highlight critical issues, warnings, and bonuses with exact point values so you know what to fix first.

🔍

URL Scanner

Scan any website to automatically discover external scripts, styles, images, fonts, frames, and connections. One click adds discovered domains to the right directives.

📥

Import Existing Policies

Paste a CSP string or fetch headers directly from a live URL. Supports both Content-Security-Policy and Report-Only headers with auto-detection.

📋

Export & Copy

View your policy in formatted or raw mode. One-click copy to clipboard gives you a ready-to-deploy header string with character count.

🕰️

Version Archive

Save dated snapshots of your configurations with optional labels. Restore any previous version or delete old ones. Experiment freely without losing work.

⚠️

Real-Time Validation

Instant warnings on each directive card flag issues like unsafe-inline, wildcard abuse, missing 'self', and duplicates before you deploy.

📚

Built-In Learning

An interactive 11-slide guide covers what CSP is, why it matters, common mistakes, and deployment steps. Learn as you build, no external docs needed.

💾

No Account Required

All data is saved to your browser's local storage. No sign-ups, no databases, no tracking. Your policies stay on your machine.

How It Works

From zero to a production-ready CSP in minutes.

1

Import or start fresh

Paste an existing CSP header, fetch one from a live site, or start from a blank slate. The editor parses everything into visual directive cards.

2

Scan your site

Enter your URL and the scanner discovers every external resource your site loads — scripts, stylesheets, fonts, images, and more. Add them to the right directives with one click.

3

Refine and validate

Add or remove sources from each directive. Real-time validation flags unsafe values and missing best practices. Watch your security score climb as you tighten the policy.

4

Copy and deploy

Copy the generated header string and add it to your server config — Nginx, Apache, Express, or an HTML meta tag. Save a snapshot to the archive for safe keeping.

Security Scoring

Know exactly how strong your policy is and what to improve.

85 / 100
Grade B
default-src is defined
object-src set to 'none'
No bare wildcards (*)
SHA hashes used (+5 bonus)
unsafe-inline in style-src (-10)
unsafe-eval in script-src (-15)

Supported Directives

Manage the 12 most critical CSP directives.

default-src

Fallback for all resource types

script-src

JavaScript files

script-src-elem

Script elements

style-src

CSS stylesheets

style-src-elem

Style and link elements

img-src

Images

font-src

Web fonts

connect-src

XHR, Fetch, WebSocket

frame-src

Iframes and embeds

base-uri

Base element URLs

worker-src

Web Workers

object-src

Plugins (Flash, Java)

Ready to secure your site?

Start building your Content Security Policy in minutes. Free, no sign-up required.

Launch the Editor →