Promotional spot · Feature your product at the top of every page.Get spotlight
Cobe Js

Cobe Js - The 5KB WebGL globe library: live demos, API docs, npm install cobe, MIT open source. Built by Vercel.

Cobe Js cover

Overview

Cobe Js Official Website

Cobe Js is a 5KB WebGL globe library with a live demo site hosted on Vercel.

  • Official app: https://cobe.vercel.app/
  • Creator: Shu Ding (@shuding, Vercel)
  • Price: Free (open source, MIT License)
  • Login required: No
  • Platform: Web (Vercel + npm library)
  • Main use: Rendering interactive 3D globes in the browser with minimal bundle size
  • Last checked: 2026-08-21

Visit Cobe Js

We are not the official developer of Cobe Js. This page helps users find, understand, and use the product.

What Is Cobe Js?

Cobe Js is a single-purpose library: it renders a 3D globe on an HTML canvas using WebGL, and it is engineered to stay around 5KB so it fits in any budget-conscious frontend. The site itself is the product showcase — a fullscreen globe demo that cycles through 13 scenes, including labels on cities, satellite-style orbits, flight arcs between cities, weather data points, analytics bars, and a "live badge" pulse mode. On first open you see a dark globe with glowing city markers for San Francisco, New York, Tokyo, London, Sydney, Cape Town, Dubai, Paris, and São Paulo, with animated arcs between them.

Technically, the API surface is deliberately tiny. You install it with npm install cobe, import createGlobe, and pass a canvas plus an options object: devicePixelRatio, width, height, phi/theta for rotation, dark, diffuse, mapSamples, mapBrightness, baseColor, markerColor, and glowColor. The demo page shows this exact configuration and links to working examples for React, Vue, and Svelte.

How to Use Cobe Js

  1. Open the official Cobe Js website to preview the globe demos.
  2. Install the package: npm install cobe (or import via the CDN link on the site).
  3. Import the function: import createGlobe from 'cobe'.
  4. Call createGlobe(canvas, options) with your canvas and config — copy the options shown in the demo, then adjust colors, markers, and rotation to match your brand.

Is Cobe Js Safe?

Cobe Js has an openly auditable codebase: the full source is on GitHub under the MIT license, with over 5,600 stars, and the library has no backend component — it draws on a canvas you provide and does not phone home, collect data, or require accounts. The demo page is a static deployment on Vercel requiring no login or payment. The author, Shu Ding, is a well-known Vercel developer with a public track record (SWR, Next.js). The practical caveat is that cobe only renders; it does not include map or location data, so you must supply your own markers. We cannot promise "100% safe", but this is one of the cleaner, more transparent libraries in its category.

Why Is Cobe Js Popular?

Cobe Js became popular in frontend circles because it collapsed the effort of 3D visualization: a globe that normally suggests Three.js and megabytes of dependencies is available at 5KB. The project launched with a viral X/Twitter thread from Shu Ding explaining the rendering tricks behind the tiny bundle, and the "COBE" demo site itself became a reference people link to when they see an animated globe on a landing page. With over 5.6K stars and active updates, it is now a go-to answer for "how to make a 3D globe in React" — which is exactly the search intent behind "cobe js".

Cobe Js Not Working?

If Cobe Js does not work, try:

  1. Refresh the page to rebuild the WebGL context.
  2. Use a modern browser with WebGL and hardware acceleration enabled.
  3. Disable extensions that block canvas or WebGL.
  4. Check whether the cobe.vercel.app deployment is online.
  5. In your own project, make sure the canvas is in the DOM and has explicit width/height before calling createGlobe.

Cobe Js Alternatives

If you like Cobe Js, you can also try:

  • three-globe — a Three.js addon with more 3D control for heavier scenes
  • globe.gl — a data-visualization-oriented WebGL globe library
  • react-globe.gl — React bindings for globe.gl with geoJSON and arc support

Frequently Asked Questions

What is the official Cobe Js website?

The official website is https://cobe.vercel.app/, with source at github.com/shuding/cobe.

Is Cobe Js free?

Yes, the library is MIT-licensed and free to use, including commercially.

Do I need an account to use Cobe Js?

No account is needed — the demo works without login and the library runs entirely in your project.

Who created Cobe Js?

Shu Ding (@shuding), a developer at Vercel and creator of the SWR data-fetching library.

Is Cobe Js still available?

Yes, the library is maintained (recent commits on GitHub) and the demo site is online as of 2026-08-21.

Featured Products

Life Path Calculator

Life Path Calculator - trustworthy free numerology: verifiable math, honest Master Numbers, AI reading with refunds.

Love Meter

Love Meter bundles four free tools: by Name, by Photo, FLAMES, and Love Oracle, all under one shell.

ADHD Test

ADHD Test - a fast, lightweight screener that returns results the moment you finish.

Free PSL Rating

Free PSL Rating breaks your PSL score into harmony, dimorphism, angularity, and presentation.

Random Topic Generator

Generate random speech topics instantly and get AI-powered feedback to become a more confident speaker.

PSL Scale

AI-Powered Facial Attractiveness Evaluation