Generating Secure API Tokens and Secrets in the Browser
June 11, 2026 · DevTools
If you've ever pasted a secret into a random website to "just generate a token," you've handed that secret to a third party. The safer approach is to use tools that run entirely in your browser using the Web Crypto API — the same primitives that power HTTPS.
This guide covers three common tasks and the DevTools that do them locally.
1. Generating random tokens and API keys
A good token is unpredictable. That means it must come from a cryptographically secure random source — crypto.getRandomValues() — not Math.random().
The Token Generator produces tokens from real entropy and lets you choose the encoding:
- Hex — safe everywhere, twice as long as the byte count.
- Base64url — compact and URL-safe (no
+,/, or=). - Alphanumeric — human-friendly for things like coupon codes.
Rule of thumb: 16 bytes (128 bits) is fine for most IDs; use 32 bytes (256 bits) for anything security-sensitive like session secrets.
2. Signing payloads with HMAC
When a webhook provider sends you data, they often include an HMAC signature so you can verify the payload wasn't tampered with. To check it, you recompute the HMAC with your shared secret and compare.
The HMAC Generator supports SHA-1, SHA-256, SHA-384, and SHA-512 and outputs hex or Base64:
message: {"event":"payment.succeeded"}
key: whsec_123...
=> 88aab3ede8d3adf94d26ab90d3bafd4a2083070c3bcce9c014ee04a443847c0b
Match that against the X-Signature header and you know the request is authentic.
3. Encrypting data with AES
Need to protect a note or a config value? AES-GCM gives you both confidentiality and integrity. The tricky part — deriving a key from a human passphrase — is handled with PBKDF2 (100,000 iterations).
The AES Encryption tool packages the salt, IV, and ciphertext into one Base64 string that you can safely store or share. Decrypt it later with the same passphrase.
Why client-side matters
All three tools share one important property: your secrets never leave your device. There's no network request, no logging, and no server that could be breached. Open your dev tools' network tab while using them — you'll see nothing sent.
Try them now: Token Generator, HMAC Generator, and AES Encryption.