DEV Community

rocketsquirreldev
rocketsquirreldev

Posted on

Visualizing Certificate Expiry in the Browser (x509Lab v1.5.0)

Hey everyone, I'm RocketSquirrel. I build x509Lab, a purely client-side web tool for visualizing and generating X.509 certificate chains.

If you work in DevOps, Backend, or IT Infra, you know the quiet terror of a production certificate expiring because someone forgot to track it.

When visualizing complex PKI trees (Root -> Multiple Intermediates -> Dozens of Leafs) in x509Lab, clicking into every single node to check its expiry date was becoming a chore. So for the v1.5.0 update, I built a visual warning system directly into the canvas nodes.

Visual Expiry Badges

Now, the moment you upload or generate a certificate, the node card displays a color-coded badge based on its remaining lifespan:

  • 🟒 VALID (> 90 days): All good.
  • 🟑 D-XX (31~90 days): Warning zone.
  • 🟠 D-XX (< 30 days): Danger zone. A small orange dot also appears on the node header.
  • πŸ”΄ D-XX (<= 7 days) or EXPIRED: Critical. A bright red dot appears on the header.

This makes it incredibly easy to zoom out on your 5000x5000 canvas and instantly spot which certificates in your chain need to be replaced.

Bug Fix: Save/Load State Loss

I also fixed a frustrating state management bug. Previously, if you generated certificates inside the app, saved your workspace to a .json file, and loaded it later, the certificates would disappear (only the empty nodes remained). The serialization logic was missing the dynamically generated PEM strings. This is now fully patchedβ€”you can safely save your test PKI environments and restore them anytime.

As always, everything runs locally via the Web Crypto API. No backend, no data collection.

πŸ”— Try it here: https://x509lab.vercel.app

πŸ”— Instagram Link: https://www.instagram.com/reel/DYE_C6KqL3Z/?utm_source=ig_web_copy_link&igsh=MzRlODBiNWFlZA==

Next up on the roadmap: One-click templates for TLS Server, Code Signing, and S/MIME chains!

Top comments (0)