Skip to content
Site volume
Colourway

3D kit

Block still

Any arrangement at any camera as server SVG: the stage's first paint, OG art and docs stills, inks resolved by the look.

  • Beta
  • Expressive layer
  • Server component
  • Since 0.1.0
  • Press check
Import from@maxgrits/overprint-three/svg
On this page

The SVG fidelity of the block model. The hero camera matches the GL stage exactly, so a still and the live pile agree.

Example#

Look of this example
Live render of examples/block-still/basic.tsx

The alphabet twins at the house camera:

Look of this example
Live render of examples/block-still/twins.tsx

Usage#

Use a block still for any arrangement as a printed picture: the stage's first paint, cards, OG art, docs figures. It is server SVG with the inks resolved by the look, so it re-inks with the colourway and the paper and ships no JavaScript.

  • Any arrangement, any camera. arrangement picks the pose; the house camera is the default.
  • Name. It is a named image with stillAlt(arrangement) by default; label={false} hides it inside a stage that already describes it.
  • GPU stills for files (OG cards, the logo pack) come from the generators' ./stills, captured from the live stage.

Layer and volume#

Art. Supports print the lead pair at Quiet and Studio and their own line from Press; the print strengths follow the volume through three.css.

Anatomy#

The parts of examples/block-still/basic.tsx, numbered:
  1. BlockFaces in three print bands, with the letter plate..mk-still-block
  2. Contact shadowA dotted footprint under each block..mk-b-sh

Volume#

  • Quiet

    Supports in the lead pair; flat print strengths.

  • Studio

    The same, with the house print shading.

  • Press

    Supports print their own line.

  • Rave

    The full colourway.

Content#

  • The alt text says what the arrangement shows: "The MAKR blocks stacked into the mark."

Do and don't#

Do

The still, from the model.

Don't

A screenshot of the live pile pasted in as a PNG on a docs page.

A frozen screenshot.

The still is drawn from the same model and re-inks with every look. A screenshot is stuck in one colourway and one paper.

Fidelities#

One of four: GL, CSS 3D, SVG and the favicon. The still is server markup with 0 JS.

Performance#

The logo still is under 8 KB raw and 3 KB gzipped.

Gating#

None: it is the first paint of every cohort.

Accessibility#

  • role="img" with stillAlt(arrangement) by default; label={false} hides it inside a described stage.

Props#

PropTypeDefaultDescription
arrangementArrangementNamelogoDefault `logo`.
cameraCameraNamenone
sizestring | numbernonepx or a CSS length; the SVG scales to its box otherwise.
posesreadonly Pose[]noneOverride the arrangement's poses (a live pile's current poses).
labelstring | falsestillAlt(arrangement)Default `stillAlt(arrangement)`; `false` hides it (inside the stage, which carries the description).
classNamestringnone

Generated from BlockStillProps in packages/overprint-three/src/svg/block-still.tsx.

Tokens#

System tokens (13)

Its own properties (4)

  • --mk-3d-key-w
  • --mk-3d-print
  • --mk-3d-reg-x
  • --mk-3d-reg-y

Scanned from its CSS at build and checked against its registry entry.

Changelog#

Arrived in 0.1.0.

0.1.024 October 2026

  • MinorthreeThe block model, physics and the SVG and CSS fidelities (P1-T9 to P1-T12): the cast, the logo, mark and pile-a arrangements, the rain and tidy kit constants, the cannon-es PhysicsWorld with the hard settle cap and keep-out columns, letters baked from Anybody, BlockCss, BlockScene with its drop, the card hop, BlockSvg, BlockStill, blockSvgString with resolved hex, BlockMark and faviconSvg.