Hide it. Replace it.Control the capture.
Shield sensitive UI from prying eyes, accidental screenshots, and shoulder surfing— or flip it and show your brand the moment someone takes a screenshot. One component. Zero latency.
Balance is blurred in place — layout stays intact.
$142,069.00
blurred in place on screenshotsensitivity: balanced · blur: 14px
Content swaps with any element on screenshot.
swapped with replacement on screenshot
3 Sensitivity Levels
“One prop away from maximum aggression.”
import { CameraShy } from 'camerashy';
// Wrap any sensitive value
<CameraShy
mode="blur"
sensitivity="paranoid"
>
$142,069.00
</CameraShy>
// Or swap with a custom element
<CameraShy
mode="replace"
replacement={<RedactedBadge />}
>
{sensitiveContent}
</CameraShy>
- ▶︎useScreenshotDetection hook
- ▶︎SSR-safe — no-op on server, activates on client
- ▶︎Single global event bus — efficient with hundreds of elements
- ▶︎Zero dependencies in core
- ▶︎Under 1 KB gzipped (core)
- ▶︎Framework-agnostic core — works with React, Vue, Svelte, Vanilla JS
This feature is intended for visual deterrence only and should not be considered a replacement for true security or encryption. Determined attackers may still bypass it.