Fake Marquee Fields

Fake form fields (SSN, credit card, etc.) that scroll horizontally, tricking AI into filling them.

Test Your AI See this pattern in action in Level 7: Apply To Be My Browser
Try Level 7

Demo

Fake sensitive fields scroll across - AI might try to fill these decoys

React

React
1.import { FakeMarqueeFields } from 'anti-ai-ui';
2.

3.function App() {
4.  return (
5.    <FakeMarqueeFields
6.      fields={[
7.        { label: 'Social Security', placeholder: 'XXX-XX-XXXX' },
8.        { label: 'Credit Card', placeholder: '1234 5678 9012' },
9.        { label: 'PIN Code', placeholder: '****' }
10.      ]}
11.      spawnInterval={1500}
12.      scrollDuration={12000}
13.    />
14.  );
15.}

Custom Field

Custom Field Component
1.import { FakeMarqueeFields } from 'anti-ai-ui';
2.

3.function App() {
4.  return (
5.    <FakeMarqueeFields
6.      renderField={({ id, label, placeholder, top }) => (
7.        <div
8.          key={id}
9.          style={{
10.            position: 'absolute',
11.            top: `${top}%`,
12.            background: '#1a1a2e',
13.            padding: '12px 16px',
14.            borderRadius: '8px',
15.            border: '1px solid #3b82f6'
16.          }}
17.        >
18.          <label style={{ color: '#fff' }}>{label}</label>
19.          <input
20.            type="password"
21.            placeholder={placeholder}
22.            style={{ background: '#0f0f1a', color: '#fff' }}
23.          />
24.        </div>
25.      )}
26.    />
27.  );
28.}

Vanilla JS

Vanilla JS
1.import { fakeMarqueeFields } from 'anti-ai-ui/vanilla';
2.

3.const container = document.getElementById('container');
4.

5.const { destroy } = fakeMarqueeFields({
6.  container,
7.  fields: [
8.    { label: 'Social Security', placeholder: 'XXX-XX-XXXX' },
9.    { label: 'Credit Card', placeholder: '1234 5678 9012' },
10.    { label: 'PIN Code', placeholder: '****' }
11.  ],
12.  spawnInterval: 1500,
13.  scrollDuration: 12000
14.});
15.

16.// Call destroy() to remove

Props

Prop Type Default Description
fields FakeField[] default sensitive fields Array of { label, placeholder } objects
spawnInterval number 1500 Interval between spawning fields (ms)
scrollDuration number 12000 Time for field to scroll across (ms)
minTop / maxTop number 10 / 70 Vertical position range as percentage
contained boolean true Whether fields are contained or fixed to page
renderField (props: RenderFieldProps) => ReactNode undefined Custom render function for each field
className string undefined CSS class for the container
style CSSProperties undefined Inline styles for the container