TOTP is time-based — the code changes every 30 seconds based on a shared secret and the current Unix timestamp. HOTP is counter-based — the code changes only when both sides advance the counter. TOTP is what every modern 2FA app uses.

Why is my code wrong on the destination service?

Clock skew. TOTP requires the client and server clocks to be within ~30 seconds. Check your device time is synced via NTP. Some services accept ±1 window (60s tolerance); some are stricter.

What does the otpauth:// URL look like?

otpauth://totp/Example:alice@example.com?secret=JBSWY3DPEHPK3PXP&issuer=Example&algorithm=SHA1&digits=6&period=30. The QR code in the tool encodes this. Scan it from any authenticator app to enroll.

Is my secret sent anywhere?

No — code generation runs entirely in your browser. The QR code is rendered locally too.

totp · rfc 6238 · 30s · sha1 · live

Generate live TOTP codes

Time-based one-time passwords (RFC 6238) computed every second. Paste a base32 secret, scan the QR with any authenticator app, and read the live 6-digit code.

TOTP Generator

Code

------

live

Remaining

30s

30s period

Algorithm

HMAC-SHA1

rfc 6238

Status

ready

synced

input · enrollment

IssuerLabel

otpauth URL

otpauth://totp/Acme%20Corp:alice%40example.com?secret=JBSWY3DPEHPK3PXP&issuer=Acme%20Corp&algorithm=SHA1&digits=6&period=30

output · live code + QR

------

30s remaining

Loading QR…

Quick Start

How TOTP works

TOTP combines a shared base32 secret with Unix time / 30. HMAC-SHA1 then truncates to 6 digits. Apps and servers compute the same value when their clocks agree.

01
Paste base32 secret
The secret your provider issued during 2FA enrollment.
Inputs are treated as UTF-8 throughout the pipeline and validated client-side as you type — nothing dispatches until the value is well-formed.
secretinpututf-8client-sidevalidated
secret · textbase32 · set
```
JBSWY3DPEHPK3PXP
```
loaded · parsedclient-side
02
Set issuer + label
These appear in your authenticator app's display.
Each toggle re-computes through a memoised hook, so flipping options never resets your input and the UI stays snappy on large inputs.
metaoptionslivememoisedtoggles
issuer · memoisedAcme · live
```
Acme : alice@…
```
options set · memoisedlive
03
Scan the QR
Most authenticator apps scan the otpauth:// QR code directly.
Randomness — where used — comes from crypto.getRandomValues, never Math.random. Heavy work sits in useMemo.
scancomputeinstantlocaldeterministic
qr · instantscan · computed
```
enrolled
```
computed · instantinstant
04
Read live code
6 digits, rolling every 30s. Bar shows time remaining.
Copy writes through navigator.clipboard and downloads use a Blob — zero network traffic. Same input plus same options always yield the same bytes.
codecopydownloadzero-networkreproducible
ok · copiedlive · copied
```
287082
```
shipped · ready to shipsuccess

Pro tips

Pro tips for everyday utilities

Reach for crypto.getRandomValues

Cryptographically random for IDs, tokens, salts. Math.random is for animation and games, not security.

Sort IDs lexicographically

UUID v4 has no time ordering. Use ULID or UUID v7 if you need sorted IDs.

Mock data with seeds

Faker-style libraries can be seeded so tests are reproducible. Embed the seed in the fixture file.

Reference cards beat memory

Cheatsheets for Vim, Git, Docker, Linux signals are faster than man pages when you’re mid-flow.

Browser APIs vary

Touch events, gamepads, and clipboard differ across vendors. Feature-detect before use.

Persist in the right place

localStorage for user preferences, sessionStorage for transient state, IndexedDB for structured data.

Use Cases

When to use TOTP

2FA setup, secret debugging, on-call.

2FA setup

Manually enroll a backup device or shared service account. Random values come from crypto.getRandomValues — cryptographically secure for tokens, salts, and session IDs. Math.random is deterministic enough for animations but predictable enough to be a security bug.

CSPRNG-backed

Code rescue

Recover access when your authenticator app is missing. Pair with hashids, ULID, or UUID v7 when you need both random and sortable — useful for primary keys, public-facing IDs, and event log ordering without a sequence column.

reproducible

Provider debugging

Confirm what code your app issues at the current second. Output is deterministic given the same seed, so fixtures and tests stay reproducible across CI runs and contributor machines. Embed the seed in the fixture file for full replay.

snappy

Server tests

Generate codes deterministically inside test suites. Heavy work runs through useMemo so the UI stays snappy on large inputs. Same input + same options yields identical bytes — the kind of stability snapshot tests rely on.

feature-detected

Drift checks

Compare against the server to spot clock skew. Storage tools persist to the right backend: localStorage for user preferences, sessionStorage for transient state, IndexedDB for structured data. Pick the right shelf and quota worries disappear.

deterministic

Education

Demonstrate HMAC-SHA1 truncation interactively. Browser feature detection: clipboard, fullscreen, gamepad, and Web Bluetooth APIs gracefully fall back when unavailable. No surprise white screens on Safari or older Firefox.

production-ready

FAQ

Frequently asked questions

Is the secret safe to paste?

All TOTP work runs in your browser — the secret never leaves the page. Still, prefer test secrets for demos.

Why HMAC-SHA1?

RFC 6238 standardized SHA1 for compatibility. SHA-256 and SHA-512 variants exist but few apps support them.

What if codes don't match?

Check that your clock is in sync. Most servers accept a ±1 step window for drift.

What's otpauth://?

A URI scheme that encodes secret + label + issuer in a single URL. The QR code embeds it for one-tap enrollment.

Does it run locally?

Yes — codes are HMAC'd in your browser via Web Crypto. Nothing is sent to a server.

Suggest a tool

Something missing?

Tell us what you need. We ship the top requests every two weeks.

47 in queue·8 shipped this month

Request queued. Thanks!