Skip to content
CHRM-MID◆Midnight Editorial
AtmosphereSartorial Silence
Accent—
Surface—
001▲
THE CHROMOLOGIUM LABORATORY18 EXPERIMENTS · INTERACTIVE

The Design Systems Laboratory

Interactive workbenches for exploring the invisible physics of interface design — motion dynamics, perceptual accessibility, component state machines, typographic scales, acoustic feedback, and GPU optics from prism dispersion to Kubelka–Munk pigment baths.

See what visitors have accessioned to the Swatch Ring
DAY BENCH

The daytime bench records the object before the light starts to move.

Midnight Editorial

18 of 18 instruments

LAB-17Perception
The Halftone Camera specimen

The Halftone Camera

One ink. A thousand shades.

Turn an authored study or local image into a field of ink marks. Inspect the screen, compare tones, and take away a vector print.

  • ◆Inspect individual marks
  • ◆Adjust screen frequency and ink area
  • ◆Local image input and SVG export
Enter Experiment →
LAB-16Optics
The Relief Press specimen

The Relief Press

No ink. Just a change in depth.

Move a light across embossed lettering and engraved seals. Explore how depth, softness and surface change what you can read.

  • ◆Emboss or deboss a personal inscription
  • ◆Move the light by pointer or keyboard
  • ◆Save an SVG surface with its recipe
Enter Experiment →
LAB-01Physics
Spring Physics & Spatial Workbench specimen

Spring Physics & Spatial Workbench

The Mathematics of Motion & Tactile Momentum

Manipulate stiffness, damping, and mass to engineer the precise feel of interface motion. Drag, flick, and toss a live specimen to experience how each Visual Movement calibrates its physics.

  • ◆Adjustable stiffness, damping & mass
  • ◆Draggable & flickable test specimen
  • ◆Movement-aware physics presets
  • ◆Export as CSS / Framer Motion / React Spring
Enter Experiment →
LAB-02Perception
Perception & Vision Simulator specimen

Perception & Vision Simulator

Optical Filters & Cognitive Accessibility

Apply real-time perceptual filters to any Visual Movement. Test color vision deficiencies, ambient lighting conditions, and live APCA contrast scores across every surface.

  • ◆Color vision deficiency simulation
  • ◆Ambient lighting environment presets
  • ◆Live APCA contrast scoring
  • ◆Side-by-side original vs. filtered view
Enter Experiment →
LAB-03Components
Component State Matrix specimen

Component State Matrix

Synchronized Multi-State Testing Array

Render any component across all 6 fundamental interaction states simultaneously. Adjust global tokens and watch Default, Hover, Active, Focus, Loading, and Disabled adapt in lockstep.

  • ◆6-state synchronized grid
  • ◆Global token manipulation sliders
  • ◆Component type selector
  • ◆Live computed CSS inspector
Enter Experiment →
LAB-04Typography
Fluid Typography & Modular Scale specimen

Fluid Typography & Modular Scale

Typographic Rhythm & Variable Font Engineering

Engineer type hierarchies with live modular scale ratios, variable font axes, viewport-responsive clamp() formulas, and baseline grid alignment visualization.

  • ◆Modular scale ratio selector
  • ◆Variable font axis sliders
  • ◆Viewport resize simulator with clamp()
  • ◆Baseline grid overlay toggle
Enter Experiment →
LAB-05Acoustics
Acoustic Design Soundboard specimen

Acoustic Design Soundboard

UI Sound Synthesis & Haptic Tone Calibration

Design interface sounds from first principles. Shape waveforms, tune harmonic intervals, sculpt ADSR envelopes, and audition how each Visual Movement voices its feedback.

  • ◆3×3 interactive trigger pad
  • ◆Waveform & harmonic interval controls
  • ◆ADSR envelope shaper
  • ◆Visual oscilloscope display
Enter Experiment →
LAB-06Perception
Print Substrates & Optical Gauge specimen

Print Substrates & Optical Gauge

Physical Material Transduction & Scan-Safe Contrast

Calculate optical contrast ratios, specular glare attenuation, and ink-bleed tolerances when transferring design tokens to physical print media, barcodes, and dynamic QR matrices.

  • ◆6 physical substrate material presets
  • ◆Contrast and glare simulation estimate
  • ◆Specular glare & ambient lux simulator
  • ◆Interactive matrix artifact preview
Enter Experiment →
LAB-07Optics
Optical Dispersion Workbench specimen

Optical Dispersion Workbench

Cauchy Refraction & Spectral Decomposition

Steer a white beam through a live GPU prism governed by the genuine Cauchy relation n(λ) = A + B/λ². Tune real optical glasses, read Abbe numbers, and locate the active movement's accent token on the visible spectrum.

  • ◆4 reference optical glass presets
  • ◆Cauchy A/B & prism apex controls
  • ◆Live Abbe number & n_D readout
  • ◆Export as GLSL / React optical hook
Enter Experiment →
LAB-08Optics
Pigment & Emulsion Bath specimen

Pigment & Emulsion Bath

Kubelka–Munk Mixing & Stirred Vehicle Media

Stir archival hero pigments through linseed oil, watercolor wash, or encaustic wax. Two-constant Kubelka–Munk scattering mixes them like paint — gold into Klein blue turns palette-green, never RGB-gray.

  • ◆12 archival hero pigments from the chip archive
  • ◆3 vehicle media on one advection solver
  • ◆Genuine K/S = (1−R)²/2R spectral mixing
  • ◆Kubelka–Munk vs RGB mixture comparison
Enter Experiment →
LAB-09Optics
Thin-Film Interference specimen

Thin-Film Interference

Structural Colour & Newton's Series

The colour of a soap bubble, a beetle's back, and oil on a puddle is interference, not pigment. Drag film thickness in nanometres and watch reflectance climb the spectral orders, integrated across 24 wavelengths.

  • ◆4 specimens with published refractive indices
  • ◆Fresnel coefficients & half-wave loss
  • ◆Live optical path difference readout
  • ◆Export as GLSL interference core
Enter Experiment →
LAB-10Textiles
The Loom specimen

The Loom

Weave Structure as a Design Primitive

Kente strip-weave, tartan setts, sashiko ground cloth and five-end satin woven thread by thread from their draft matrices — then exported as dependency-free pattern CSS.

  • ◆5 archival cloths with threading plans
  • ◆Plain / twill / satin / basket interlacings
  • ◆Live draft repeat & sett readout
  • ◆Export as pattern CSS or a weaver's draft
Enter Experiment →
LAB-11Components
The Pattern Press specimen

The Pattern Press

Generative marks, printed with intention

Four seeded pattern families for posters, interfaces and repeating surfaces.

  • ◆Curated starting looks
  • ◆Reproducible recipes
  • ◆Specimen and project exports
Enter Experiment →
LAB-12Textiles
The Marbling Trough specimen

The Marbling Trough

Float pigment. Draw a comb. Lift a sheet.

Deterministic marbled endpapers and covers, with archival recipes.

  • ◆Curated starting looks
  • ◆Reproducible recipes
  • ◆Specimen and project exports
Enter Experiment →
LAB-13Typography
The Teleprinter specimen

The Teleprinter

Images, read one character at a time

Translate specimens into glyphs for covers, terminals and text editions.

  • ◆Curated starting looks
  • ◆Reproducible recipes
  • ◆Specimen and project exports
Enter Experiment →
LAB-14Textiles
The Drapery specimen

The Drapery

Material, held up to the light

Shape a folded sheet and explore the archive’s authored material responses.

  • ◆Curated starting looks
  • ◆Reproducible recipes
  • ◆Specimen and project exports
Enter Experiment →
◈AEO 2026 · RECURSIVE SEARCH TREE ARCHITECTURE

Archival Inquiry & Search Tree

Interactive recursive knowledge graph answering high-intent questions on OKLCH color science, diurnal UX, diegetic materiality, and machine governance.

Topic: Design Tokens & DTCG-Compatible Governance1 Core Inquiries