anthemionanthemion-kylindros
← all of Classical

Classical

The kylindros

The roller — the drum, the thing that turns because turning is what a cylinder is for.

Every fragment traces a ray and solves it against the cylinder, so the foreshortening is the true cosine and the front of each slide genuinely swells toward you — a CSS deck rotates a flat plane, which is correct for a plane and therefore never bulges and has no depth at all. That depth is what the optics are built on: the turning slides recede by up to the drum's radius, so a thin-lens circle of confusion taken from the ray's own hit depth defocuses them because they are physically further away, a grazing-angle trace of the neighbouring slide smears across the curve, and chromatic aberration disperses from the optical axis the way a real lens does. Nothing is applied to the photograph's colour. The front slide is bit-identical to the source on the axis — the aberration is gated off inside its arc so it cannot creep into the corners. A cylinder is ruled along its axis, so straight lines in the photograph stay straight and buildings survive being turned. It never turns by itself.

  1. Eroded Parthenon frieze showing horsemen of the Panathenaic procession
    Kerameikos House 2024
  2. The Laocoön group — a priest and his sons entangled by sea serpents
    Quarry House 2023
  3. David’s Death of Socrates — Socrates reaching for the cup of hemlock
    Salt Store 2023
  4. Prometheus bound to the rock, the eagle at his side
    Chalk Pavilion 2022
  5. Apollo and Cyrene — the god and the huntress with the lion
    Foundry Rooms 2022

Integration

<link rel="stylesheet" href="anthemion.css">
<script type="module" src="anthemion.js"></script>

<anthemion-kylindros focus="55" ghost="45" fringe="30">
  <ol>
  <li><figure>
    <img src="/work/kerameikos.jpg" alt="" width="1600" height="1000" crossorigin="anonymous">
    <figcaption>Kerameikos House <span>2024</span></figcaption>
  </figure></li>
</ol>
</anthemion-kylindros>

Slot

Featured work on a home page, or one project's photographs in sequence — the three or four pieces you lead with, not the index you scan.

Custom properties

  • --anthemion-kylindros-tint

Budget

  • Three to nine photographs. Under three there is no drum to wrap; over nine each slide holds less than forty degrees of arc and none of them reads.
  • One per page. It is the moment, and a page with two moments has none.
  • Photographs only. A text slide is illegible by thirty degrees, and the optics have nothing to work on without depth in the image.
  • Same-origin images, or cross-origin ones served with CORS and marked crossorigin. Without it the texture cannot be uploaded and it silently drops a tier.
  • Never as the index. It shows a few things in sequence; a body of work that has to be scanned is pinax, and filtering it is ostrakon.
  • Leave `focus` under about 70 on small tiles. Shallow depth of field is the effect on a wide stage and mud at 300px.

Restraint is the aesthetic, and it does not survive being applied generously. These limits are the specification, not advice.

Also in structure