Wensity

Interactive 3D Globe

Pro

A photo-real Earth carrying animated avatar pins, a soft atmosphere shader, and smooth drag-to-orbit controls.

3dwebglthreeglobeearthinteractive
Interactive 3D Globe component preview

Installation

Run the following command

~/your-project
pnpm dlx wensity@latest add interactive-globe

Usage

Import InteractiveGlobe from @/components/wensity/interactive-globe and render it anywhere in your React or Next.js app. The source lands in your own repo, so every prop, class and animation below is yours to edit.

app/example.tsx
"use client";
import { InteractiveGlobe } from "@/components/wensity/interactive-globe";


export default function InteractiveGlobeDemo() {
  return (
    <InteractiveGlobe
      config={{
        atmosphereColor: "#4da6ff",
        atmosphereIntensity: 0.38,
        autoRotateSpeed: 0.3,
      }}
    />
  );
}

Props

PropTypeDefaultDescription
configInteractiveGlobeConfig-Globe visuals: atmosphere, auto-rotate, camera, lighting, and related knobs.