Skip to the content
FilCommunityWorkflowsDocsOpen Fil
Build a single self-contained HTML page that recreates the dashboard in the reference image, a dark red-on-black spy-agency…
A web page: run it in Fil

Code · Claude Opus 5.5

Build a single self-contained HTML page that recreates the…

Build a single self-contained HTML page that recreates the dashboard in the reference image, a dark red-on-black spy-agency command interface, with Three.js doing the 3D work. Layout: a dark window frame with three traffic-light dots at top left. The main area is a dotted world map of Europe, Africa and Asia made of red dots, rendered as an instanced Three.js dot grid. A glowing red arc animates between two glowing nodes, with a location pin at a midpoint. Bottom left, a 'MOST WANTED' card reads 'ROGUE AGENT', 'PRICE $1,000,000.00', 'DEAD OR ALIVE', with a small colourful low-poly head. Right column: a rotating red wireframe head in a framed box. Then 'AGENT V92BZ81X' with AGE 27 YRS, CODE NAME AJL22V87 and ACTIVE UNTIL 09/06/2080. Then 'AGENT ACTIVITY' with MISSIONS 132, COMPLETED 132 and FAILED 0 in large red numerals. Then a hexagonal radar chart with DMG 95, TAC 94, MOB 96, AGI 90, PHY 96 and ACC 98. At the bottom, a dark red monospace terminal block and a rotating crosshair compass. A bottom status bar reads 'SYS.CORE // 01, LOCAL IP 192.168.1.104, GATEWAY 10.0.0.1, STATUS: OPTIMAL, CPU 34%, MEM 128GB, NET 84MB/S, 14:15:33 UTC', above a live-animated red bar histogram. Style: near-black background, a single red palette, monospace type, thin HUD corner brackets, subtle grid and scanline texture. Behaviour: the map dots shimmer, the arc pulses, the wireframe head rotates slowly, the histogram bars and clock update live, and the map can be orbited slightly with the mouse. Use the reference image as the layout and style guide. Load Three.js from a CDN.

Meng To@shadownessguy0097
Model
Claude Opus 5.5
Made by
Meng To
Shared
Likes
0
Open in Fil

Use its prompt, turn it into a video or a 3D model, or find more like it in Fil. Fil is invite-only for now: without an invitation, Open in Fil shows the waitlist.

More like this

Direction: Cards on a thread. The work hangs on the line that joins it. Explore: two or three rounded-square cards joined…Direction: Cards on a thread. The work hangs on the line that joins it. Explore: two or three rounded-square cards joined by one curved…Recreate the Nodex website shown in the reference image as a single self-contained HTML page, matching its layout, spacing…Recreate the Nodex website shown in the reference image as a single self-contained HTML page, matching its layout, spacing, typography and…YouTube thumbnail, 16:9. The man in the second reference photo, keeping his face, hair and skin tone exactly, on the right…YouTube thumbnail, 16:9. The man in the second reference photo, keeping his face, hair and skin tone exactly, on the right, chest-up…YouTube thumbnail, 16:9. The man in the second reference photo, keeping his face, hair and skin tone exactly, on the right…YouTube thumbnail, 16:9. The man in the second reference photo, keeping his face, hair and skin tone exactly, on the right, chest-up…Direction: Thread flower. A flower drawn from thread, like the lazy daisy embroidery stitch, where every petal is a single…Direction: Thread flower. A flower drawn from thread, like the lazy daisy embroidery stitch, where every petal is a single loop of thread…Direction: Cube, rethreaded. Keep what works in the current three-face isometric cube (see the reference image: amber top…Direction: Cube, rethreaded. Keep what works in the current three-face isometric cube (see the reference image: amber top, rose left, sky…YouTube thumbnail, 16:9. The man in the second reference photo, keeping his face, hair and skin tone exactly, on the right…YouTube thumbnail, 16:9. The man in the second reference photo, keeping his face, hair and skin tone exactly, on the right, chest-up…YouTube thumbnail, 16:9. The man in the second reference photo, keeping his face, hair and skin tone exactly, on the right…YouTube thumbnail, 16:9. The man in the second reference photo, keeping his face, hair and skin tone exactly, on the right, chest-up…Direction: Cards on a thread. The work hangs on the line that joins it. Explore: two or three rounded-square cards joined…Direction: Cards on a thread. The work hangs on the line that joins it. Explore: two or three rounded-square cards joined by one curved…Direction: Cards on a thread. The work hangs on the line that joins it. Explore: two or three rounded-square cards joined…Direction: Cards on a thread. The work hangs on the line that joins it. Explore: two or three rounded-square cards joined by one curved…The Fil mark from the reference image (the five-petal thread flower) as the emblem of a gilded trading card, like the cards…The Fil mark from the reference image (the five-petal thread flower) as the emblem of a gilded trading card, like the cards on Fil's…The Fil mark from the reference image (the five-petal thread flower) as the emblem of a gilded trading card, like the cards…The Fil mark from the reference image (the five-petal thread flower) as the emblem of a gilded trading card, like the cards on Fil's…