Skip to content
Premium & Brand

Globe Wireframe

An orthographic SVG globe with country strokes, drag, and a slow auto-rotate.

Import

tsx
import { GlobeWireframe } from "@cronus-ui/ui/globe-wireframe";
bash
npx cronus-ui add globe-wireframe

Examples

.cronus

No audit fixture declares this family in .cronus yet.

React onlyParity: Not portedParity scoreboard

API Reference

Generated from the component's exported types.

GlobeWireframeLabels

Skip GlobeWireframeLabels props table
PropTypeDefaultDescription
globe*
string"Globe"Accessible name for the globe.

GlobeWireframeProps

Extends VariantProps<typeof globeWireframeVariants>

Skip GlobeWireframeProps props table
PropTypeDefaultDescription
ref
Ref<HTMLDivElement>—Ref forwarded to the underlying DOM node.
className
string—Additional class names merged onto the root.
width
number——
height
number——
strokeColor
string"currentColor"Country / graticule / outline stroke.
strokeWidth
number1—
graticuleColor
string"currentColor"—
graticuleOpacity
number0.2—
sphereOutlineColor
string"currentColor"—
sphereOutlineWidth
number1—
autoRotate
booleantrue—
autoRotateSpeed
number0.5Degrees per animation frame.
initialRotation
[number, number][0, 0]—
enableInteraction
booleantrue—
showGraticule
booleantrue—
scale
number1—
countryFillColor
string——
labels
Partial<GlobeWireframeLabels>—Override default English strings.
variant
"wireframe" | "wireframesolid" | "solid""wireframe"One of "wireframe" | "wireframesolid" | "solid".
asChild
boolean—Render as the child element via Slot.
children
ReactNode—Contents of the component.