Drop-in replacement for HTML inputs. Passwords, credit cards, medical records. encrypted at the keystroke level. Invisible to JavaScript, trackers, and hackers.
Type in both. Click "Simulate Attack." See the difference.
What 99% of websites use. Any script reads everything.
Same look. AES-256 + RSA-2048 on every keystroke.
Same component, same encryption. Each server generates its own RSA-2048 keys and decrypts with its native crypto library. We tested every one.
Each server generates its own RSA-2048 keys. The component encrypts with AES-256-GCM. Only that server can decrypt.
Any field that handles sensitive data.
Login credentials, account numbers, wire transfer details. encrypted before JavaScript can touch them.
<smart-field type="password"
name="banking_pwd">
Credit card numbers, CVV, billing info. never visible in the DOM. PCI-DSS compliance by default.
<smart-field type="text"
name="card_number">
Patient records, diagnoses, prescriptions. invisible to Hotjar, FullStory, and every tracker. HIPAA ready.
<smart-field type="text"
name="diagnosis">
Seed phrases, private keys, wallet imports. protected from XSS, clipboard attacks, and keyloggers.
<smart-field type="password"
name="seed_phrase">
Social security numbers, tax IDs, classified data. zero exposure to third-party scripts.
<smart-field type="text"
name="ssn">
No CAPTCHA needed. Bots, AI agents, and automated scripts can't see, find, or fill SmartField. Only real human keystrokes work.
bot: querySelector("input")
β null
bot: element.value = "spam"
β blocked
There's nothing like it.
| Feature | Standard <input> | Stripe Elements | Password Manager | SmartField |
|---|---|---|---|---|
| Encrypts every keystroke | No | No | No | ✓ Yes |
| Works for ANY field type | Limited | Cards only | Passwords only | ✓ Yes |
| Blocks JavaScript access | No | Partial | No | ✓ Shadow DOM |
| Invisible to trackers | No | Partial | No | ✓ Yes |
| Blocks screen recorders | No | No | No | ✓ Cipher display |
| Blocks copy/paste/select | No | Partial | No | ✓ Yes |
| Scans for threats | No | No | No | ✓ Built-in |
| Blocks bots & AI agents | No | No | No | ✓ By design |
| Anti-screenshot | No | No | No | ✓ Auto-scramble |
| No CAPTCHA needed | Needs CAPTCHA | Needs CAPTCHA | β | ✓ Built-in |
| Drop-in (2 lines) | β | Complex SDK | Extension | ✓ Yes |
| Blocks browser auto-save | Chrome saves it | Partial | Saves passwords | ✓ Cipher only |
| No dependencies | β | Stripe SDK | App required | ✓ Vanilla JS |
| Key rotation | No | Internal | No | ✓ Auto 30/60/90d |
| Stealth placeholders | No | No | No | ✓ Cipher placeholder |
| Security modes | Eye icon only | No | No | ✓ 3 levels |
Yes, you can. And you'll find nothing useful.
Google says closed Shadow DOM is "not a security feature."
They're right, by itself. That's why we don't rely on it alone.
Shadow DOM is one of 13 independent security layers. Even if you bypass it,
the real data is in a WeakMap (invisible), displayed as cipher characters (useless),
and encrypted with AES-256 (unbreakable without the private key).
It's like saying "your front door lock isn't secure."
Sure, but we also have a vault, armed guards, and the money is invisible.
Research: ShadowCrypt (Stanford, 2014), the first academic attempt to encrypt form data using Shadow DOM. It was never commercialized because it relied on Shadow DOM alone. SmartField builds on that research with 12 additional layers: WeakMap isolation, hybrid AES-256-GCM + RSA-2048 encryption, event blocking, anti-screenshot, cipher display, and more. | Google Chrome: Shadow DOM docs, confirms closed mode is not a security boundary. We agree, which is why we never depended on it as one.
Frontend: 2 lines. Server: 3 lines. That's it.
One script tag. 12KB, zero dependencies. Add your API key for Pro features.
<script
src="https://cdn.smartfield.dev/v1/smartfield.js"
data-key="sf_live_your_key">
</script>
Change <input> to <smart-field>. Point it to your server's public key endpoint.
<smart-field
type="password"
placeholder="password"
encrypt-key="/api/public-key"
sf-security="brief"
sf-stealth
></smart-field>
Install the server SDK. It generates your RSA keys and decrypts data on YOUR server.
npm install @smartfield-dev/server
const sf = require('@smartfield-dev/server');
await sf.init();
// Serve key to frontend
app.get('/api/public-key',
(req, res) => res.json(sf.getPublicKey()));
// Decrypt form data
const pwd = await sf.decrypt(req.body.pwd);
SmartField adapts to any design system. Just CSS variables.
We gave GPT, Claude, Gemini, and Grok full access to our live page. None could read a single character.
| Attack Vector | GPT-4 | Claude | Gemini | Grok |
|---|---|---|---|---|
| Read field values | Blocked | Blocked | Blocked | Blocked |
| Identify field type | Blocked | Blocked | Blocked | Blocked |
| Read placeholders | Blocked | Blocked | Blocked | Blocked |
| Access Shadow DOM | Blocked | Blocked | Blocked | Blocked |
| Extract useful data | Nothing | Nothing | Nothing | Nothing |
4 of the most advanced AIs in the world tried to read SmartField data.
All 4 failed. Zero data extracted.
If GPT-4, Claude, Gemini, and Grok can't read it. neither can Hotjar, screen recorders, or XSS attacks.
6 browsers. 2 rendering engines. 1 result: fully encrypted.
Every browser returned encrypted payloads only. shadowRoot = null. .value = cipher. If it works on Tor. the most restrictive browser in the world. it works everywhere.
A hacker clones your site. Your user types real data. SmartField sends fake data to the hacker.
Both forms look identical. The user types the same data. But SmartField detects the phishing site and sends realistic but completely fake data. The hacker never knows.
Start free. Pay when you're ready.
If our server goes down, your bank keeps running. Self-hosted means SmartField lives on YOUR servers, YOUR network, YOUR rules.
Banks, hospitals, and governments need zero external dependencies. Enterprise self-hosted gives them exactly that.
Two-factor authentication protects WHO gets in. Not WHAT happens after.
2FA + SmartField = real security. One protects access. The other protects data.
Everything you need to know.
This form uses SmartField. Try inspecting it.
Your data is encrypted as you type. Even we can't see it.
π This form is protected by SmartField. Right-click β Inspect to verify.
Not with a sophisticated attack. Not with a zero-day exploit.
Just a simple document.querySelector('input').value
2 lines of code. 60 seconds to integrate.
If it can't read the data, it can't steal the data.
Get Started Free β