Skip to content
Orbit

Build interfaces
around a center.

Compose menus, charts and instruments with HTML and CSS. Orbit keeps the geometry in place as your interface changes.

Try the playground Get started

Works with React, Vue, Svelte and plain HTML.

See how the 3D effect works

Playground

Change the controls to see the layout update. Copy or download the HTML.

More than 24 satellites are shown as dots.

Current example

Copy or download the complete HTML, with Orbit included.

The exported HTML works offline.

Examples

Explore the docs

Satellites

Radial menu

Arrange actions around a focal point. Change the count, range and starting angle.

Arcs

Donut chart

Compose a chart from values. Following segments move when the data changes.

Progress

Progress gauge

Build indicators and instrument faces. Set the opening, fill and shape.

Ready-made components with Orbit Kit

Add gauges, clocks, knobs and radial menus with custom HTML elements.

Explore Orbit Kit

Use Orbit in your project

Download a complete HTML file from the playground, or follow the installation guide to add Orbit to your app.

Installation guide
Understand the structureContainers, rings and the elements that live on them.Explore the layout APIControl the radius, range, direction and spacing.Use your frameworkCompose with React, Vue, Svelte or plain HTML.