Card density

How much card a collection can carry.

The trade

Every card in Pinky costs something: Jelly costs motion and attention, Liquid costs backdrop-filter, Tilt costs a rotation the eye has to resolve. One of them is a feature. Twenty is a texture, and usually a slow one.

A working guide

| Items on screen | Card to use | | --- | --- | | 1–2 | Liquid Card, Jelly Card, Morph Card — the expressive ones | | 3–8 | Spotlight Card, Tilt Card, or one Jelly Card as the feature | | 9–24 | Spotlight Card, or plain surfaces with a hover shadow | | 25+ | Plain surfaces. No pointer effects. |

The feature-plus-field pattern

The most reliable composition in a grid: one expressive card, everything else calm. The contrast is what makes the feature read as a feature. A grid of twelve equally expressive cards has no hierarchy at all — it just has more movement.

Spacing and density

Expressive cards need room. A Jelly Card leans up to a few pixels and scales slightly; in a tight grid it will visually collide with its neighbours. If the gap is under about 16px, drop to a calm surface.

Text

The denser the grid, the less deformation the text can take. Rotation and scale that are invisible on a large hero card are legible as blur on a small one.