AIThis post was created with the assistance of artificial intelligence (AI).
Core Facility 53 — 120,000 Years Under Pressure — Layered CSS Refraction
Room 53 of 175: “Core Facility 53 — 120,000 Years Under Pressure” — visit the live site.

Discover How Core Facility 53 Transforms Climate History into a Visual Journey

This AI-built exhibition brilliantly visualizes the Earth’s atmospheric past through a single, persistent ice core. Its defining feature is a vertical drilling metaphor, where scrolling simulates descending through layers of ice, revealing a compelling interplay of scientific precision and immersive design. The experience guides viewers along a virtual drilling journey, from the present climate record back to 120,000 years ago, with each step revealing laboratory stations and atmospheric data embedded directly into the core’s structure.

Unpacking the Visual and Technical Foundations

This site employs a carefully curated cold palette, dominated by shades of icy blue and deep navy, punctuated by an orange warning hue for critical data points. The core cylinder itself is crafted entirely with CSS gradients and inset shadows, giving the illusion of a curved, refracted glass-like surface. Layers of strata are represented through repeating gradients, simulating annual and major ice layers that shift dynamically as users scroll. JavaScript seamlessly synchronizes scroll position with depth, age, and atmospheric readings—derived from a custom-built, non-linear model—making the experience feel both scientific and fluid. The site leverages a high-resolution HTML5 canvas to render real-time charts, such as CO₂ levels, that move in tandem with the user’s navigation. Interactivity is woven into the experience via event markers and a CSS-based vessel bubble animation, which react to user actions, maintaining engagement without sacrificing clarity. Typography choices, like self-hosted Sora and JetBrains Mono, reinforce the technical tone, with large headings and etched labels that evoke laboratory instrumentation, all while ensuring accessibility and responsiveness across devices.

Live view of Core Facility 53 — 120,000 Years Under Pressure
The room as it renders live — open it in your browser.

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 53 of 175, “glacier”):
CORE FACILITY 53 — an ice-core climate laboratory. Aesthetic: cold storage at −36°C; translucent blues. Palette: ice blue #bfe3f0 → deep glacial #14507a, white, one warning orange. Fonts: sora (display), jetbrains-mono (data). SIGNATURE: a full-height ICE CORE you descend along — a translucent cylinder (layered gradients + refraction shimmer) with visible annual bands; scrolling drills DOWN through 120,000 years, a depth/age readout runs, and band tooltips mark events (volcanic ash layer, warm interstadial); CO₂ ppm strip-chart draws alongside, syncing to depth. Lab sections: saw room protocol, bubble analysis (ancient air pops as tiny fizz animations), storage racks. Unforgettable: time as vertical ice.

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/glacier/

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.

Streamlined Development with Rigorous Review

The creation of this site followed a three-stage process: initial development based on a detailed concept prompt, an exhaustive critique phase where every visual and interaction detail was scrutinized for clarity and scientific accuracy, and a final certification by an art director to ensure aesthetic coherence and technical precision. This iterative pipeline was guided carefully by the AI prompt to maintain fidelity to the metaphor of a deep ice core, balancing scientific realism with engaging interactivity.

The full build notes live in the room’s design guide.

Experience the Depths of Climate History

Visit the live exhibition to explore Core Facility 53 firsthand and delve into the Earth’s atmospheric past. For those interested in the full collection, browse through all 175 AI-designed sites at our dedicated hub to see how AI continues to innovate in scientific visualization.

Visit the live room → · Browse all 175 rooms

Previously in Wing III

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.

Powered by Thorsten Meyer AI


Amazon

ice core drilling replica model

As an affiliate, we earn on qualifying purchases.

As an affiliate, we earn on qualifying purchases.

Amazon

climate change educational kit

As an affiliate, we earn on qualifying purchases.

As an affiliate, we earn on qualifying purchases.

Amazon

glacier ice core display

As an affiliate, we earn on qualifying purchases.

As an affiliate, we earn on qualifying purchases.

Amazon

interactive climate history exhibit

As an affiliate, we earn on qualifying purchases.

As an affiliate, we earn on qualifying purchases.

You May Also Like

Procedural Shader Rendering: A Look Inside “STRATUS — Kestrel Ridge Atmospheric Observatory” (FABLE/175)

AIThis post was created with the assistance of artificial intelligence (AI).“STRATUS —…

The strawberry moon will soon rise. When to look up.

The upcoming strawberry moon will rise soon. Find out the exact timing and why this event is notable for skywatchers in 2026.

Mandalas and Geometry: The Math in Spiritual Art

Nurturing curiosity about mandalas reveals how geometry intertwines with spiritual symbolism, inviting you to explore the divine math behind sacred art.

The ‘absolute magic’ of Morse code that still connects people globally

Despite modern technology, Morse code continues to connect people worldwide, celebrated for its simplicity and resilience in communication.