Arrival Commons Quiet Trace
Pinky UIv0.1Source available · npm coming soon
A React library
for interactive motion.
75 building blocks — 12 motion primitives, 35 components, 28 layouts. Every one has a live preview and an import path.
git clone https://github.com/florash/Pinky-UI.git
cd Pinky-UI && npm install && npm run devJelly Card
elasticity 0.4 · intensity 0.2
Move across
this card.
Elastic lean, drift and settle — with squash and stretch on press.
Fluid Tabs
Written for developers — and coding agents.
356 public skill routes backed by plain markdown: what a component is for, when it is the wrong choice, and how much motion is too much.
Read the skillspackages/skills/components/jelly-card.md
# Jelly Card
## Avoid for
- forms and input-heavy panels
- dense data tables
- long repeated listsSignature interactions
Nine pieces, each moving differently.
Browsing, spatial separation, media, editing, feedback, context, mobile search and command — live instances, not screenshots. The complete catalogue is in Explore.
Gallery ↔ List
4 items · gallery
Arrival
soft light
Commons
shared space
Threshold
quiet edge
Work table
clear focus
Card Fan
Curated studio deck: 1 of 4 selected
Morph Lightbox
Morphing Input
Completion Morph
Save draft
Start the action to see the surface transform.
Anchored Inspector
Search Morph Header
Browse
A room for work
Editorial study · 04 min
Surface notes
Product rhythm · 08 min
Motion review
Interaction study · 06 min
Command Palette
Or press ⌘K. The surface owns focus, filtering and Escape.
Mobile touch signatures
Morphing nav
Bottom search
Detent sheet
Swipe actions
Archive project
Swipe left, or use the action.
Swipe partially to reveal, further to commit.
Long-press select
Tap or hold a row to select it.
Everything above is one screen of it.
Arrangements and product moments.
See the restMotion
Surfaces
Light
Depth
Layout
Controls
Stack to Grid
Inline Edit
Workspace name
Click the value to edit.
Expanding Search