Globe
A stylized rotating 3D globe rendered on a canvas element with dotted lat/long lines and a sweep glow arc.
When to Use
- Hero sections for global/international products.
- Data visualization dashboards to indicate worldwide reach.
- Marketing pages that benefit from a distinctive animated centerpiece.
The Globe is a stylized canvas representation — a custom dotted-sphere animation rendered without
third-party WebGL libraries. It is not a geographically accurate globe.
API Reference
| Property | Type | Default | Description |
|---|---|---|---|
| Size | int | 300 | Canvas size in pixels (always square). |
| DotColor | string | "var(--color-foreground)" | Color of the globe surface dots. |
| GlowColor | string | "var(--color-primary)" | Color of the sweep glow arc. |
| Speed | double | 1.0 | Rotation speed multiplier. |