Home▸Cryptography▸The TLS Handshake: How Your Browser Sets Up a Secure Connection

🔐 The TLS Handshake: How Your Browser Sets Up a Secure Connection

See exactly what happens in the milliseconds before an https page loads: ClientHello, ServerHello, certificate checks, key exchange, and the switch to fast symmetric encryption.

Cryptography3DModerate60 FPS

This simulator visualizes the step-by-step TLS handshake between a browser and a server, showing the ClientHello, ServerHello, certificate verification, key exchange, and the switch to symmetric encryption in real time.

🔬 What It Demonstrates

🎮 How to Use

Press play to step through each stage of the handshake and watch the messages, keys, and certificate checks pass between browser and server, then compare the TLS 1.2 and TLS 1.3 timelines side by side.

💡 Did You Know?

TLS 1.3 removed support for older, insecure ciphers like RC4 and static RSA key exchange entirely, meaning every TLS 1.3 connection you make today automatically gets forward secrecy by default.

⚙ Under the hood

See exactly what happens in the milliseconds before an https page loads: ClientHello, ServerHello, certificate checks, key exchange, and the switch to fast symmetric encryption.

tlshttpsencryptioncybersecuritynetworkingweb-securitycertificatescryptography

3D · Three.js / WebGL renderer · 60 FPS target · runs fully client-side, no install