Get decor and gifts delivered free with Prime
- Fast, free delivery on millions of items
- Prime Video, Amazon Music and more included
- Member-only deals all year
A door with two stories
The Hush is an AI-built exhibition piece imagining a 1926 bar tucked behind a neighborhood laundry. Its threshold sets the scene with one small ritual: knock five times, in any rhythm, and the door opens. The design’s central trick is that the room remembers the timing on that browser, then greets a returning visitor with the same cadence. The Hush is a fictional place, not a real bar or business; the site makes that invented world tangible by treating its secrets as part of the interface.
HTML CSS JavaScript interactive website templates
As an affiliate, we earn on qualifying purchases.
As an affiliate, we earn on qualifying purchases.
Three passes to a finished room
The guide to The Hush documents a three-pass pipeline: build the coded room, critique it mercilessly, then certify it through an art-director pass. It also records the choices behind the interactions and visual materials, from the remembered knock to the inspection transformation. The result is a site whose atmosphere comes from working details rather than decorative vintage effects.
The full build notes live in the room’s design guide.
Atmosphere built from code
The visual language borrows from a candlelit back room: oxblood walls, amber highlights, smoky supporting tones, and pale text. Display lettering lends the room a period mood, while the cleaner geometric type keeps labels and longer passages legible. A spare hand with color gives candle amber the job of a light source instead of letting it wash over every surface.
There are no generated images. Timber grain, brass fittings, glass rims, candlelight, and the room’s shadows are assembled from HTML, CSS, gradients, and inline SVG texture. A little JavaScript gives those details movement. As the visitor scrolls or moves a pointer, the page estimates a gentle draft; flames lean, frames shift, and shadows drift in response. Motion is restrained, and the atmospheric loop stops when the page is hidden or reduced motion is preferred.
The room changes its account
The five knocks are more than a password. Their intervals are stored locally, so a return visit can replay the visitor’s rhythm through the door’s progress lights. The page remembers a browser’s timing, not a person’s identity. That modest distinction makes the interaction feel intimate without pretending the site knows who is at the door.
A second interaction turns a matchbook into a movable light source. Pointer or touch position reveals pencilled notes near the flame, while keyboard activation places the light in a useful central spot. If an inspection begins, the whole room adopts a duller explanation: the bar’s colors drain into paper and beige, posters list laundry prices, and the furniture becomes a folding surface. The fictional establishment has a public face ready when it needs one.
Want this? Paste this into your AI coding agent
Build a single-page showcase website from this art-direction brief. Work like an elite creative frontend engineer; commit totally to the direction.
BRIEF (room 172 of 175, “speakeasy”):
SPEAKEASY — THE HUSH, behind the laundry: knock twice (fictional 1926 bar, prohibition register). Aesthetic: candle amber on oxblood leather; discretion as design. Palette: candle amber, oxblood, smoke haze, gin shimmer. Fonts: dm-serif-display (deco display), jost (body). SIGNATURE: THE KNOCK — entry requires knocking: tap any five-beat rhythm on the door and it opens — and the DOOR REMEMBERS: return later and it greets you by your own knock (localStorage; the guide confesses the trick with a wink). Inside, candle-physics lighting: flames lean with your scroll “drafts”, shadows swing accordingly. The menu speaks entirely in euphemism (cold tea, special coffee, the librarian’s lemonade — hover reveals the truth), a password-of-the-week generator in period slang, THE RAID PROTOCOL: trip the wrong switch and lights snap up, bottles rotate to become laundry shelves, jazz posters flip to washing prices (the whole page performs innocence until you knock again). Unforgettable: the door knowing you.STACK: pure HTML/CSS/JS, no build step, no frameworks, no CDNs or external requests of any kind; self-hosted fonts only; every visual is code (CSS/SVG/canvas/WebGL) — no image assets required.
QUALITY BAR: flawless at 390px, 834px and 1440px with zero horizontal overflow; tap targets >= 44px; semantic landmarks, focus-visible styles, body-text contrast >= 4.5:1; prefers-reduced-motion pauses or simplifies heavy animation; rAF loops pause when the tab is hidden; hold 60fps (cap particle counts, avoid layout thrash); rich invented content everywhere — real-sounding names, numbers and program notes, never lorem ipsum; orchestrate one beautiful staggered load moment plus scroll and hover surprises. FORBIDDEN: Inter/Roboto/Arial/system-ui, purple-gradient-on-white, and cookie-cutter hero+cards+footer layouts.
PROCESS: iterate in three documented passes — (1) build plus builder self-critique, (2) merciless external critique finding and fixing at least ten real problems, (3) art-director elevation from good to unforgettable. Screenshot at all three widths every pass and fix everything you can see.
— Original brief by Claude Fable 5 (art director), executed by the FABLE/175 pipeline.
— This room lives at https://fable-25-830.netlify.app/sites/speakeasy/
This is the verbatim art-direction brief that produced the room — exposed by the exhibition itself via the “Prompt” link in the room’s footer.
Step inside
Visit The Hush and try the door for yourself. Then browse all 175 exhibition rooms at the hub to see how other imagined spaces turn a design idea into an experience.
Visit the live room → · Browse all 175 rooms
Previously in Wing VII
- Room 171: BLACKOUT — 03:12–05:47, Verlicht
- Room 161: Station Chiroptera — Read the Dark by Echo
- Room 169: Hibernaculum — Where Winter Sleeps
FABLE / 175 is a finished exhibition of 175 fundamentally different websites, each built end-to-end by an AI. This article is part of our series walking through it room by room.
Fall Picks
fall essentials
As an affiliate, we earn on qualifying purchases.
