---
name: orbit-agency-hero
description: Generate an offline portfolio hero with orbiting project buttons, project dialogs, a browsable work list, and a responsive mobile composition. Use for interactive portfolio and visual collection prototypes.
---

# Orbit portfolio hero

Generate an offline portfolio hero with orbiting project buttons, project dialogs, a browsable work list, and a responsive mobile composition.

## Generate

Requires Python 3.10+ and a modern browser. No third-party packages, network access, remote fonts, or build step are needed.

```bash
python3 scripts/generate.py -o out/index.html
python3 scripts/generate.py --brand "Studio Form" --title "Ideas in motion" --accent "#315c48" --speed 0.3 -o out/custom.html
python3 scripts/generate.py --params params.json -o out/index.html
```

CLI flags override JSON values. Keep `scripts/` and `templates/` together. Open `preview.html` for the default experience.

| Parameter | Accepted value |
| --- | --- |
| `brand`, `title`, `subtitle` | Plain text, 1–180 characters |
| `accent` | Six-digit hex color |
| `speed` | Number 0–2; zero disables automatic rotation |

Unknown parameters are rejected. Text is escaped and remains literal. Adjust actual project content and artwork directly in `templates/index.template.html`; the generator changes presentation copy and color, not the portfolio dataset.

## Adapt

The orbit uses native button elements. Focus stops animation so targets do not move while navigating with a keyboard. Project dialogs use native dialog focus containment and Escape dismissal. On narrow screens, the orbit becomes two bands above and below the headline. The work list opens below the hero. Edit project names, descriptions, and SVG art in the template together.

Read [references/design.md](references/design.md) before changing interaction geometry or motion. Retain visible focus, keyboard equivalence, a pause control, and reduced-motion support. Project content is demonstration material, not a connected portfolio service.

## Verify

Generate default and customized output. Check 1440px, 390px, and 320px widths, keyboard actions, visible selection feedback, reduced motion, and browser console errors. Confirm the output works offline. Test HTML-like title values to confirm they remain plain text.