All posts

Client-Side Encryption with the Web Crypto API

July 8, 2026 · DevTools

security
encryption
web crypto
guide

Modern browsers ship a real cryptography library — the Web Crypto API — so you can encrypt data entirely on the client, with no server ever seeing the plaintext. Here's how a passphrase-based scheme fits together.

The building blocks

1. Derive a key from the passphrase (PBKDF2). Passphrases make poor keys directly, so PBKDF2 stretches one into a proper 256-bit key by hashing it thousands of times (250,000+ iterations of SHA-256) together with a random salt. The salt ensures the same passphrase produces a different key each time, defeating precomputed rainbow tables.

2. Encrypt with AES-256-GCM. AES is the symmetric cipher; GCM is the mode. GCM is authenticated, meaning it also produces a tag that detects tampering. Each encryption uses a fresh random initialization vector (IV) so identical plaintexts don't produce identical ciphertexts.

3. Package it. Store the salt, IV, and ciphertext together (Base64 is convenient) so the recipient has everything needed to decrypt — none of these are secret; only the passphrase is.

Why authenticated encryption matters

With AES-GCM, a wrong passphrase or a single flipped byte makes decryption fail cleanly instead of returning garbage. That integrity check is what separates "encryption you can trust" from "encryption that silently corrupts."

The one rule for passphrases

Send the ciphertext and the passphrase through different channels. Emailing both together defeats the point. Share the encrypted blob one way (email, a paste) and the passphrase another (a phone call, a separate message). And use a strong, unique passphrase — the whole scheme is only as strong as that.

Try it

The Text Encryptor implements exactly this — PBKDF2 + AES-256-GCM via the Web Crypto API, entirely in your browser. Nothing is uploaded, and the passphrase is never stored.

Tools mentioned in this post