240° gauge
A stepped speedometer: fifteen bands on a 240° arc light up with the speed, each with its number curved over it.
How it's built
--o-range: 240deg; --o-from: 240degon the.gravity-spotopens the dial at the bottom, and every ring inherits it.- Fifteen
<o-arc>withoutvaluesplit the range into equal steps.--o-gap: 3keeps a dark line between them, so each step reads on its own. - The numbers are fifteen more arcs on
orbit-11, with text and a transparent fill. Same count, same range: each number sits over its band. - Lit bands get a class;
:nth-child(n + 10)and(n + 13)turn the last steps amber and coral. - The universe is shorter than it is wide, since the dial leaves the bottom free.
--o-force: 100cqwkeeps the reach at the full width, and.at-topplus a top margin of half a width puts the center where it would be in a square. - The readout is a centered satellite ten lanes wide, and the universe is a
role="meter".
Related
- 180° gauge: a half circle with a needle
- Fuel gauge: a 90° instrument
- Speedometer demo: a 270° dial with ticks and a needle
- Orbit Kit gauge: a ready-made component