Themes

Orbit ships a plain default look, a cyan theme and a helper for building. All of them are written with :where(), so they have zero specificity apart from their own class: a single class of yours wins, without !important.

Default theme

Always on. Satellites have no border or background, arcs and progress bands are light gray, and vectors and sides take the current text color. There are no hover colors.

Cyan theme

Add theme-cyan to the .bigbang, or to any ancestor. It outlines satellites, colors everything cyan and adds hover colors to arcs and progress bands.

dev-orbit

Add dev-orbit while you build. It draws the gravity spot, rings and satellites with dashed red lines, and outlines broken structure. It goes on top of a theme on the same element. See Visual aids.

Your own look

Style Orbit like anything else: satellites and capsules with ordinary CSS, arcs and progress with custom properties. The color palette is there if you want it. Here is the same layout once more, with a few rules of its own and a hover color on the satellites.