Skip to content
Pinky UI

Skills · interaction recipes

Make the interaction, then make the judgment visible.

A skill answers the question an API cannot: what the interaction is for, when it is the wrong choice, and which few variables keep it feeling like Pinky UI.

Full recipe catalogue

Browse by public interaction family.

The folders remain useful for imports; the discovery language stays aligned with the site taxonomy.

Components

Pieces with a direct surface or control response.

38 recipes

Components

38

When to reach for a component, and when to reach for a different one.

Layouts

Collection arrangements where geometry carries meaning.

28 recipes

Layouts

28

How to arrange a collection, and how many items each arrangement can carry.

Experiences

Navigation, heroes, atmosphere and transitions.

36 recipes

Navigation

21

Animated wayfinding that never delays location or destination clarity.

Heroes

3

Page-opening compositions with one intentional signature interaction.

Backgrounds

4

Ambient surfaces that stay quiet, legible and inexpensive.

Transitions

4

State and route handoffs that preserve focus and navigation semantics.

Spatial

4

Depth patterns that flatten gracefully and keep reading order stable.

Systems

Media, product controls, collections, overlays and workflows with real state.

161 recipes

Media

6

Media inspection and playback patterns with honest loading and touch behaviour.

Forms

22

Tactile controls that preserve labels, focus, validation and precision.

Data

18

Lightweight data interactions with stable textual interpretations.

Feedback

16

Messages, status and recovery surfaces chosen by consequence and context.

Search

3

Keyboard-first finding and command interactions that preserve focus.

Loading

10

Loading and progress feedback that communicates time without noise.

Lists

5

Product lists and rows with disclosure, focus and mobile actions.

Drag

4

Reordering systems where pointer movement always has an accessible alternative.

Onboarding

5

Teaching surfaces that respect attention, skip paths and product context.

Mobile

45

Touch-first patterns with explicit controls and gesture etiquette.

Collections

12

Content browsing systems where preview, focus, disclosure and spatial continuity carry the story.

Overlays

15

Contextual surfaces that stay anchored, layered and usable across pointer, keyboard and touch.

Effects

Cursor, motion, text and scroll as expressive layers.

27 recipes

Cursor

10

Pointer enhancements with keyboard, touch and restraint guidance.

Motion

6

Entrances, morphs and loaders that preserve readable content.

Text

6

Text motion that supports hierarchy without compromising language.

Scroll

5

Scroll relationships that keep native flow and performance intact.

Primitives

One reusable behaviour at a time.

12 recipes

Primitives

12

The reusable behaviours, and the judgment each one needs.

Patterns

Restraint, composition and accessibility guidance.

53 recipes

Patterns

53

System-level guidance: density, restraint, reduced motion, composition.