I tried to make text invisible to cameras (but readable to humans)

GANESH — Tue, 17 Mar 2026 12:46:44 +0000

We spend a lot of time thinking about backend security,auth, encryption, access control.

But there’s a simple gap on the frontend:

If something is visible on screen, it can be captured with a phone.

There’s no reliable way on the web to prevent that. At best, you can try to block screenshots or disable interactions, but none of that works against an external camera.

I wanted to explore a different direction.

The idea

Instead of trying to block access, I experimented with how text is rendered.

The key observation is that human vision and cameras behave differently:

Humans perceive continuous motion (persistence of vision)

Cameras capture discrete frames

So I tried rendering text in a way that stays readable to the human eye but doesn’t translate cleanly into individual frames.

What I built

A small library called secure-render-text.

It uses a combination of:

rapid frame alternation

layered character rendering

subtle visual inconsistencies

The goal isn’t to hide the text, but to make captured output less clean and less reliable.

Where this might be useful

Internal dashboards with sensitive data

SaaS tools where screen leakage is a concern

Exam or assessment interfaces

Situations where you want to reduce casual capture

Git Hub : https://github.com/tmlganesh/npm-package_secure-render-text
NPM : https://www.npmjs.com/package/secure-render-text

DEV Community: GANESH

I tried to make text invisible to cameras (but readable to humans)