field-ui

field-ui · recipes

64 recipes. Each one runs.

Portable FieldRecipes — the four-field translation model made practical. Every card below runs the real, validated recipe (its runtime tokens, render stack, and diagnostics are checked against the engine catalog). Filter, watch one run, or open its page.

Each keeps the vocabulary lanes separate: runtime tokens execute, concepts name behavior, metrics measure state, diagnostics explain it, conditions activate it.

Gravity core First release

Priority Well

make important elements feel naturally weighted without shouting

Runtime tokens
attract gravity
Metrics
density attention priority
Render
particles · trails
Open recipe →
Gravity core

Focus Orbit

keep related options moving around the active item

Runtime tokens
attract magnetism tether
Metrics
attention relation-strength
Render
particles · field-lines
Open recipe →
Gravity core

Search Relevance Field

let search results settle by relevance, confidence, and recency

Runtime tokens
attract memory repel
Metrics
density memory recency
Render
particles · heatmap
Open recipe →
Electromagnetic core First release

Signal Path

show information flowing through citations, dependencies, or routes

Runtime tokens
charge propagate fieldflow
Metrics
signal strength
Render
streamlines · field-lines · trails
Open recipe →
Electromagnetic core First release

Evidence Field

show how sources support, weaken, or contradict a claim

Runtime tokens
charge link cohesion repel
Metrics
coherence entropy
Render
links · particles · heatmap
Open recipe →
Weak core

Conflict Field

make contradiction, uncertainty, and unstable state visible

Runtime tokens
charge repel morph diffuse
Metrics
conflict entropy coherence
Render
particles · heatmap
Open recipe →
Strong core First release

Relationship Bond

keep related elements visually and behaviorally connected

Runtime tokens
link tether cohesion
Metrics
relation-strength tension
Render
links · particles
Open recipe →
Strong core

Concept Cluster

group related terms, cards, or sections without hard layout changes

Runtime tokens
cohesion crystallize link memory
Metrics
cluster memory density
Render
metaballs · links · particles
Open recipe →
Strong core First release

Coherence Field

show whether a form, workflow, or dataset is becoming stable

Runtime tokens
cohesion pressure link repel
Metrics
coherence entropy pressure
Render
particles · heatmap
Open recipe →
Gravity core First release

Reading Field

make long content pages reveal attention, memory, and concept links

Runtime tokens
attract memory link
Metrics
attention memory
Render
trails · links · particles
Open recipe →
Weak core First release

Memory Trace

show where a user has been, paused, returned, or accumulated attention

Runtime tokens
memory diffuse
Metrics
memory recency decay
Render
trails · heatmap · particles
Open recipe →
Weak core

Decay Notice

let stale, temporary, or completed state fade gracefully

Runtime tokens
morph memory diffuse
Metrics
decay age heat
Render
particles · heatmap
Open recipe →
Weak core

Phase Shift

show a state transition: draft → published, pending → complete, hidden → active

Runtime tokens
morph cohesion
Metrics
phase coherence progress
Render
particles · metaballs
Open recipe →
Electromagnetic core First release

Guided Flow

move particles or attention along field lines, relationships, or paths

Runtime tokens
magnetism fieldflow stream propagate
Metrics
flow velocity density
Render
streamlines · field-lines · trails · particles
Open recipe →
Diagnostic / platform core

Diagnostic Lens

reveal field lines, causality, prediction, topology, energy, and overlays

Runtime tokens
attract
Metrics
density energy entropy
Render
particles · field-lines
Open recipe →
Diagnostic / platform core

Accessibility Equivalence

convert motion-heavy behavior into static, semantic, reduced-motion equivalents

Runtime tokens
attract
Metrics
attention memory coherence
Render
particles
Open recipe →
Gravity applied

Attention Weather

show system urgency, density, and activity across a dashboard

Runtime tokens
gravity thermal pressure diffuse memory
Metrics
heat pressure attention density
Render
heatmap · metaballs · particles
Open recipe →
Electromagnetic applied

Navigation Current

make routes, breadcrumbs, and likely next paths feel connected

Runtime tokens
fieldflow stream memory propagate link
Metrics
current memory signal route-strength
Render
streamlines · field-lines · links · trails · particles
Open recipe →
Electromagnetic applied

Citation Thread

bind citations, footnotes, evidence, references into visible relationships

Runtime tokens
link fieldflow charge memory
Metrics
relation-strength confidence memory
Render
links · field-lines · trails · particles
Open recipe →
Strong applied

Form Stability Field

show validation as coherence instead of error noise

Runtime tokens
cohesion pressure morph memory link
Metrics
coherence entropy pressure completion
Render
metaballs · links · particles
Open recipe →
Gravity applied

Command Intent Field

let command palettes settle around likely intent

Runtime tokens
gravity charge memory cohesion repel
Metrics
intent confidence memory risk
Render
dots · metaballs · particles
Open recipe →
Weak applied

Selection Wake

leave a subtle trail of user interaction and selection

Runtime tokens
memory diffuse fieldflow stream
Metrics
memory recency trail
Render
trails · heatmap · particles
Open recipe →
Gravity applied

Availability Pressure

show schedule density, conflicts, and open space

Runtime tokens
gravity pressure tether repel memory
Metrics
pressure availability conflict flexibility
Render
heatmap · metaballs · particles
Open recipe →
Strong applied

Dependency Tension

reveal constraints, blockers, and coupled states

Runtime tokens
link tether charge pressure
Metrics
tension blocked coherence heat
Render
links · field-lines · particles
Open recipe →
Weak applied

Staleness Drift

make outdated content, data, or files cool and recede

Runtime tokens
memory morph diffuse
Metrics
age staleness memory confidence
Render
heatmap · trails · particles
Open recipe →
Electromagnetic applied

Trust Gradient

show confidence, verification, and unsupported claims

Runtime tokens
charge link cohesion memory
Metrics
trust confidence coherence entropy
Render
heatmap · links · particles
Open recipe →
Weak applied

Completion Release

let finished work release pressure and settle into memory

Runtime tokens
morph memory gravity pressure cohesion
Metrics
completion pressure memory coherence
Render
metaballs · trails · particles
Open recipe →
Strong applied

Group Magnet

let related cards, assets, or controls cluster intelligently

Runtime tokens
cohesion gravity crystallize link memory
Metrics
cluster density relation-strength
Render
metaballs · links · particles
Open recipe →
Weak applied

Error Pressure

show accumulated instability without harsh alert patterns

Runtime tokens
thermal pressure morph memory diffuse
Metrics
error heat entropy pressure
Render
heatmap · metaballs · particles
Open recipe →
Electromagnetic applied

Handoff Stream

show ownership or state moving from one person or system to another

Runtime tokens
fieldflow propagate link memory morph
Metrics
handoff current memory state
Render
streamlines · field-lines · trails · particles
Open recipe →
Gravity applied

Context Halo

reveal nearby relevant context around a focused element

Runtime tokens
gravity memory link cohesion
Metrics
context attention memory relation-strength
Render
metaballs · links · particles
Open recipe →
Diagnostic / platform applied

Field Tutorial

teach field-ui by revealing DOM, bodies, fields, metrics, feedback, and overlays

Runtime tokens
attract
Metrics
teaching attention
Render
particles · field-lines · dots
Open recipe →
Gravity systems

Semantic Gravity Map

let a document or app reveal which concepts carry the most weight

Runtime tokens
gravity link cohesion memory
Metrics
mass attention relation-strength density
Render
heatmap · metaballs · links · particles
Open recipe →
Electromagnetic systems

Polarity Filter

let opposing states, tags, or preferences sort themselves visibly

Runtime tokens
charge repel attract diffuse
Metrics
polarity match distance
Render
field-lines · particles · dots · trails
Open recipe →
Strong systems

Source Constellation

show how multiple sources gather around claims, topics, or decisions

Runtime tokens
link charge gravity memory cohesion
Metrics
confidence support citation-density memory
Render
links · metaballs · particles · trails
Open recipe →
Weak systems

Drift Correction

bring wandering attention or unstable layout back into coherence

Runtime tokens
gravity tether memory morph
Metrics
drift return stability
Render
streamlines · trails · particles · dots
Open recipe →
Electromagnetic systems

Resonance Match

highlight elements that ring with the user current intent

Runtime tokens
charge memory cohesion propagate
Metrics
resonance intent confidence memory
Render
field-lines · links · particles · trails
Open recipe →
Diagnostic / platform systems

Friction Gate

slow risky, destructive, or irreversible actions without modal noise

Runtime tokens
viscosity pressure gate morph
Metrics
risk friction intent readiness
Render
streamlines · heatmap · particles · trails
Open recipe →
Strong systems

Boundary Field

make safe zones, drop zones, scopes, and containers perceptible

Runtime tokens
wall sink repel cohesion
Metrics
boundary proximity validity
Render
field-lines · metaballs · particles · dots
Open recipe →
Weak systems

Threshold Bloom

reveal meaningful state changes only when a threshold is crossed

Runtime tokens
gate morph spawn charge memory
Metrics
threshold activation heat memory
Render
metaballs · heatmap · particles · trails
Open recipe →
Electromagnetic systems

Latency Ripple

show delay, loading, sync, and distributed system response as waves

Runtime tokens
propagate diffuse fieldflow memory
Metrics
latency signal damping sync
Render
streamlines · field-lines · particles · trails
Open recipe →
Strong systems

Provenance Trail

preserve the origin and transformation history of content or data

Runtime tokens
memory link morph cohesion
Metrics
provenance memory transform-count source-strength
Render
links · trails · particles · field-lines
Open recipe →
Gravity systems

Review Pressure

surface items needing review before they decay, expire, or block work

Runtime tokens
gravity pressure memory morph thermal
Metrics
review-pressure age risk priority
Render
heatmap · metaballs · particles · dots
Open recipe →
Strong systems

Semantic Snap

align objects, cards, or text fragments by meaning instead of only geometry

Runtime tokens
link tether cohesion crystallize
Metrics
snap relation-strength alignment
Render
links · field-lines · particles · dots
Open recipe →
Gravity systems

Ambient Tutor

teach the interface quietly based on hesitation, return, and attention

Runtime tokens
memory gravity propagate link
Metrics
hesitation return helpfulness attention
Render
heatmap · trails · particles · links
Open recipe →
Strong systems

Relation Lens

temporarily reveal hidden connections without changing layout

Runtime tokens
link memory cohesion
Metrics
relation-strength active-relation density
Render
links · field-lines · particles · dots
Open recipe →
Gravity systems

Priority Tide

let importance rise and fall over time, workload, or context

Runtime tokens
gravity morph memory diffuse pressure
Metrics
priority age deadline decay
Render
heatmap · metaballs · particles · trails
Open recipe →
Diagnostic / platform systems

Field Contract Preview

show exactly what a recipe will register, measure, write, and render before enabling it

Runtime tokens
attract
Metrics
scope impact risk
Render
particles · dots
Open recipe →
Electromagnetic operational

Presence Field

show collaborators as live influence, not static avatars

Runtime tokens
charge propagate fieldflow memory link
Metrics
presence recency signal attention
Render
field-lines · links · heatmap · particles
Open recipe →
Gravity operational

Consensus Well

let agreement gather around stable options or decisions

Runtime tokens
gravity cohesion link pressure memory
Metrics
consensus coherence support tension
Render
metaballs · links · heatmap · particles
Open recipe →
Electromagnetic operational

Disagreement Charge

make unresolved conflict visible without turning it into noise

Runtime tokens
charge repel thermal morph memory
Metrics
disagreement entropy resolution memory
Render
field-lines · heatmap · links · particles
Open recipe →
Electromagnetic operational

Change Shockwave

show the downstream impact of a change across a system

Runtime tokens
propagate link pressure morph memory
Metrics
impact latency risk distance
Render
streamlines · field-lines · links · particles
Open recipe →
Strong operational

Permission Boundary

make access, scope, and protected regions legible

Runtime tokens
wall sink charge link
Metrics
permission scope risk boundary
Render
voronoi · links · field-lines · particles
Open recipe →
Gravity operational

Risk Horizon

reveal approaching risk before it becomes an error

Runtime tokens
gravity pressure morph diffuse memory
Metrics
risk pressure threshold entropy
Render
heatmap · field-lines · metaballs · particles
Open recipe →
Gravity operational

Intent Magnet

pull likely actions toward the user's current context

Runtime tokens
gravity memory link cohesion
Metrics
intent confidence memory next-action
Render
links · field-lines · dots · particles
Open recipe →
Strong operational

Flow Checkpoint

stabilize multi-step flows around milestones

Runtime tokens
fieldflow link cohesion memory morph
Metrics
progress checkpoint memory coherence
Render
streamlines · links · field-lines · particles
Open recipe →
Gravity operational

Version Gravity

show which version, branch, or draft is becoming canonical

Runtime tokens
gravity memory link morph
Metrics
version-weight recency approval fork-distance
Render
metaballs · links · field-lines · particles
Open recipe →
Strong operational

Review Constellation

bind reviewers, comments, issues, and artifacts into one field

Runtime tokens
link charge cohesion pressure memory
Metrics
review tension resolution attention
Render
links · field-lines · heatmap · particles
Open recipe →
Weak operational

Anomaly Bloom

surface unusual behavior as local heat and instability

Runtime tokens
thermal diffuse pressure morph memory
Metrics
anomaly heat spread confidence
Render
heatmap · metaballs · particles
Open recipe →
Diagnostic / platform operational

Scope Lens

reveal what a component, recipe, or action can affect

Runtime tokens
link wall lens
Metrics
scope impact risk relation-strength
Render
links · field-lines · voronoi · particles
Open recipe →
Gravity operational

Calibration Field

help users tune settings toward a stable target

Runtime tokens
gravity cohesion pressure memory
Metrics
calibration distance coherence pressure
Render
metaballs · field-lines · heatmap · particles
Open recipe →
Diagnostic / platform operational

Semantic Drag

add resistance when movement would break meaning

Runtime tokens
viscosity link tether cohesion
Metrics
drag validity relation-strength friction
Render
links · field-lines · trails · particles
Open recipe →
Weak operational

Recovery Path

guide users back from error, drift, or interrupted state

Runtime tokens
memory morph link fieldflow gravity
Metrics
recovery memory last-stable confidence
Render
field-lines · streamlines · links · particles
Open recipe →
Electromagnetic operational

System Pulse

show the living rhythm of a product, workflow, or data system

Runtime tokens
propagate thermal memory cohesion spawn
Metrics
pulse health sync heat
Render
field-lines · heatmap · streamlines · particles
Open recipe →

Experimental — Wayfinding

Two nav-chrome recipes that run the engine signals-only (no canvas) to drive the site's own navigation — the invisible-fields family applied to wayfinding (where am I / where have I been). Validated and live, but kept outside the canonical 64 while they prove out.

Gravity experimental

Wayfinding Field

orient the visitor in a navigation bar by surfacing where they are and what is adjacent

Runtime tokens
attract tether cohesion
Metrics
attention coherence priority
Render
field-lines · heatmap
Open recipe →
Electromagnetic experimental

Wayfinding Current

trace the path a visitor has travelled and the current flowing from home to where they are

Runtime tokens
propagate fieldflow sink memory
Metrics
signal recency memory
Render
streamlines · heatmap · field-lines
Open recipe →
Electromagnetic experimental

Contour Charge

charge a body with gathered matter while it holds attention; discharge the moment attention leaves

Runtime tokens
sink attract
Metrics
density load
Render
particles · heatmap
Open recipe →
Gravity experimental

Gravity Field

show a gravity body as a visible, followable natural field — matter threads its lines in orbit

Runtime tokens
gravity swirl
Metrics
density
Render
field-lines · particles
Open recipe →