# Quadruped

A four-legged robot with solved hip, knee, and foot positions. Scrub a walking or trotting cycle, change the stance, and inspect which feet touch the ground.

> For the complete index, see [llms.txt](https://robocn.dev/llms.txt). A Markdown version of any page is available by appending `.md` to its URL or by sending an `Accept: text/markdown` header.

## Install

```bash
bunx --bun shadcn@latest add https://robocn.dev/r/robot-quadruped.json
```

Registry item: `robot-quadruped` · [`https://robocn.dev/r/robot-quadruped.json`](https://robocn.dev/r/robot-quadruped.json)

## Notes

- Side elevation is the drawing it always had, where one pair of legs is drawn behind the other. Off that axis the legs are tubes either side of the body at half a track out, and the body is a box.
- Supplying phase hands the cycle back to your timeline and stops the internal clock. Without it the robot keeps its own, parked by a reduced-motion preference.
- All four legs solve two-link inverse kinematics in parallel planes. The illustration preserves link lengths but does not simulate balance, forces, or terrain.

## Usage

```tsx
import { RobotQuadruped } from "@/components/ui/robot-quadruped"

<RobotQuadruped behavior="trot" />

// Or scrub the cycle yourself.
<RobotQuadruped gait="trot" phase={0.65} height={0.5} stride={0.8} showContacts />
```

## Props

| name | type | default | description |
| --- | --- | --- | --- |
| `view` | `"plan" | "front" | "profile" | "iso"` | `"profile"` | Where the camera stands. One robot, four projections: straight down, straight on, side elevation, or three-quarter from above. |
| `behavior` | `"walk" | "trot" | "idle" | "static"` | `"idle"` | What it does when phase is not supplied. Idle still breathes: the hips rise and fall. |
| `gait` | `"stand" | "walk" | "trot"` | — | Footfall pattern. Omit and the behavior picks one. |
| `phase` | `number` | — | Controlled cycle fraction. Supplying it stops the internal clock. Wraps in both directions; ignored when standing. |
| `speed` | `number` | `0.75` | Gait cycles per second. |
| `offset` | `number` | `0` | Seconds of offset, so a pack breaks step. Phase is the gait cycle here, so the offset has its own name. |
| `animate` | `boolean` | `true` | Off parks the machine at phase and stops rendering. A reduced-motion preference does the same. |
| `paused` | `boolean` | `false` | Freeze where it stands. |
| `interactive` | `boolean` | `true` | It notices you: the pointer coming over it gets it up and walking, and a click sits it down. |
| `onGaitChange` | `(gait) => void` | — | Fired when the resolved footfall pattern changes. |
| `height` | `number` | `0.5` | Normalized stance height, clamped to 0–1 (36–54 world units at the hips). Non-finite values use 0.5. |
| `stride` | `number` | `0.6` | Normalized fore/aft foot travel, clamped to 0–1. Zero steps in place. Non-finite values use 0.6. |
| `lift` | `number` | `0.5` | Normalized foot clearance, clamped to 0–1. Zero slides feet along the ground. Non-finite values use 0.5. |
| `showGround` | `boolean` | `true` | Ground reference plane; blueprint adds its grid. |
| `showContacts` | `boolean` | `false` | Mark solved feet that touch the ground plane. |
| `label` | `string` | — | Caption underneath the robot. |
| `variant` | `"solid" | "outline" | "blueprint" | "wire"` | `"solid"` | How the machine is painted. Geometry never changes between variants. |
| `size` | `"xs" | "sm" | "md" | "lg" | "xl" | number` | `"md"` | Rendered width in pixels, or a step on the scale. |
| `color` | `string` | `var(--robot-shell)` | Body panels — the colour the machine reads as. |
| `accent` | `string` | `var(--robot-accent)` | Status colour: tip light, live tool, readouts. |
| `metal` | `string` | `var(--robot-metal)` | Bare machined parts: collars, bolts, tool bodies. |
| `dark` | `string` | `var(--robot-dark)` | Cast joints, base, shadow side. |
| `palette` | `Partial<RobotPalette>` | — | Override any subset of roles at once, including glow and grid. |

## Source

- `src/components/ui/robot-quadruped.tsx`