luma.gl
Examples
Explore interactive examples for rendering, GPU compute, data processing, and visualization.
Find examples
Search by name, topic, graphics API, or difficulty.
Showing 81 of 81 examples
Featured examples
Showcase
Gaussian Splat Viewer
Explore captured Gaussian scenes and the 50-million-splat Coit Tower RAD landscape.
Gaussian Splats
Render progressive Gaussian splats through a WebGPU command graph or WebGL2 fallback.
glTF Asset Studio
Standards-first glTF assets with physically based materials, animated skeletons, morph targets, animation pointers, and WebGPU/WebGL rendering.
Instancing
Animate a dense field of geometry with per-instance transforms and colors issued in a compact draw.
ANARI Playground
Declarative ANARI-style scene editing, OpenUSD/glTF import, HDR rendering, and glTF/USD export.
Globe
Orbit a richly shaded Earth with animated water, specular oceans, ice, atmosphere, and an HDR Tycho starfield.
Effects: Glass
Follow emissive multipath packets through glass switches with reflections, transparency, bloom, and HDR tone mapping.
Effects: Depth of Field
Focus a layered 3D scene with a reusable depth-aware bokeh and depth-of-field pipeline.
Effects: Bloom
Explore HDR bloom with spectral lens ghosts, diffraction starbursts, halos, temporal stability, and textured lens dirt.
Effects: Persistence
Accumulate animated electron trails across framebuffer history with a tunable persistence effect.
Next-generation graphics
WebGPU
Lightstorm Megacity
Race through an HDR megacity beneath synchronized lightning and thunder, with SSR, bloom, and GPU-driven indirect rendering across up to one million records.
Volumetric Fire Forge
Simulate reactive obstacle-aware fire and render the live volume with depth-correct HDR emission and smoke on WebGPU.
Tempest Ocean: Spectral Stormfront
Fly above a physically displaced spectral ocean with GPU-derived normals, whitecaps, and HDR storm lighting.
Spectral Caustics: Prism Cathedral
Trace a faceted refractor into a six-band, geometry-derived HDR caustic on WebGPU.
Fluid Foundry: Liquid Metal Press
Drive a GPU-resident MLS-MPM liquid through an HDR industrial vessel on WebGPU.
Virtual Geometry Canyon
Explore a procedural canyon whose GPU-selected LOD frontier represents more than 41 million potential leaf triangles.
Effects: Visualization City
Inspect a procedural city through cascaded and local shadows, SSAO, SSR, fog, outlines, TAA, and motion blur.
Deferred Rendering: Illumination Lab
Resolve hundreds of clustered lights through deferred PBR, GTAO, SSGI, SSR, volumetrics, adaptive exposure, and HDR bloom.
Effects: Shadow Map Quality
Compare fitted cascades, PCSS penumbrae, bias, resolution, and debug views across shadow-quality presets.
GPU data and compute pipelines
GPGPU Graph
GPGPU
Filter, sort, aggregate, and visualize typed GPU-resident table columns without CPU readback.
GPU frustum culling
Cull, stably compact, pick, and indirectly draw visible instances without a CPU visibility pass.
GPU hierarchical trace
Filter, traverse, pick, density-LOD, and indirectly render hierarchical traces entirely on the GPU.
luGraph explorer
Explore up to 1,048,576 actual GPU vertices and 2,097,343 resident edges through communities, PageRank, neighborhood selection, and bounded force layout.
GPU scene trace
Explore canonical trace scenes with reusable GPU interaction, resource groups, picking, and indirect drawing.
GPU scene graph
Adapt a CPU-owned hierarchy into generic GPU visibility, picking, resource groups, and indirect rendering.
GPU sort
Stably sort paired uint32 keys and values across global or independent batched GPU domains.
GPU data analysis
Compose graph-native GPU analytics and run an opt-in Arrow-driven luDF dataframe benchmark against equivalent CPU results.
Compute, projections, and GPU-native data
GPGPU Graph Modules
LuxFilter: Million-Row Crossfilter Explorer
Brush one million GPU-resident points with LuxFilter across linked maps, scatterplots, histograms, and categorical distributions without CPU readback.
LuRaster: Satellite Raster Lab
Explore bounded dense GPU-connected components, global raster histograms, nodata-aware overviews, exact categories, seam-safe halos, NDVI, and contours.
Billion-Point Spatial Atlas
Query and indirectly render massive NYC point corpora with graph-native WebGPU geospatial algorithms.
luProj + luSpatial: Taxi Explorer
Project and query one million GPU-resident taxi points with luProj and luSpatial, then render the result indirectly with deck.gl.
luGraph + deck.gl: Network Explorer
Explore up to 1,048,576 actual GPU vertices and 2,097,343 resident edges through real deck.gl layers, graph analytics, and bounded force layout.
GPT-2 Transformer
Run GPT-2 inference with WebGPU compute pipelines and GPU-resident model data.
Core capabilities
API
Animation
Drive a portable render loop with frame timing, animated uniforms, and continuous model updates.
Effects: Image Processing
Compose, reorder, and live-tune a complete image-effect library against an animated procedural scene.
Blending
Compare GPU blend equations and source/destination factors on overlapping transparent geometry.
Multi Canvas
Render two independently resized canvases through presentation contexts backed by one shared GPU device.
Texture Cube
Sample a cube texture across six faces to render direction-dependent environment imagery.
Texture 3D
Upload and sample volumetric texture slices inside a continuously animated three-dimensional field.
Texture Sampling
Compare independent texture samplers across a draggable divider, inspecting filtering, mipmaps, addressing, anisotropy, and depth comparisons.
Texture Tester
Probe which compressed texture families the current browser and GPU can decode and render.
Texture Video
Stream live video frames into a dynamic GPU texture and sample them while rendering.
Render Bundles
Record repeated WebGPU draw commands once, then replay the bundle efficiently on every frame.
Works with your stack
Integrations
Learn by building
Tutorials
Hello Triangle
Draw a first portable triangle with a Model and backend-specific shaders.
Triangle Geometry
Build a triangle from a Geometry object and render it through the portable Model API.
Hello Cube
Render textured geometry with uniforms, depth testing, and animation.
Hello Lighting
Add normals, material response, and ambient and directional lights to a rotating mesh.
Hello glTF
Load a glTF asset and render its meshes, materials, textures, and scene transforms.
Two Cubes
Draw two independently transformed cubes from shared geometry, shaders, and texture resources.
Instanced Cubes
Animate many cubes with per-instance offsets and colors while sharing one geometry and draw call.
Hello Instancing
Draw multiple objects efficiently with per-instance attributes.
Shader Modules
Compose reusable shader modules, uniforms, and helper functions into a portable model.
Shader Hooks
Inject custom shader logic at declared hook points without replacing the surrounding shader pipeline.
Shader Plugins
Extend model shaders with typed plugins that contribute code, bindings, and runtime properties.
Transform Feedback
Update particle-like vertex data entirely on WebGL2 with transform feedback and buffer swapping.
Transform
Run a GPU data transform and capture its computed output for reuse in later rendering work.
Emerging techniques
Experimental
Order-independent Transparency
Compare exact per-pixel A-buffer transparency, weighted blended OIT, and ordinary alpha blending.
Antialiasing Techniques
Compare single-sample rendering, FXAA, supersampling, and texture filtering in a split view.
FP64
Compare float32 and emulated float64 shader arithmetic along the same deep Mandelbrot zoom.
Text Space Crawl
Compare extruded, bitmap, SDF, and MSDF text as glyphs recede through perspective space.
Texture HTML-in-Canvas
Copy live DOM panels into GPU textures and map them onto a rotating interactive prism.
WebXR: Immersive Prism Portal
Explore a stereoscopic prism tunnel rendered through native WebGPU projection layers, with a portable WebGL2 and AR camera fallback.
GPU-native data
Apache Arrow - luma.gl v10
Points
Render Arrow point columns directly from GPU storage with data-driven size and color.
Points - Filtering ShaderPlugin
Filter Arrow-backed point records in the shader with a reusable typed filtering plugin.
Lines
Render variable-length Arrow line paths from shared GPU vectors with per-row styling.
Polygons
Triangulate and render nested Arrow polygon rings while preserving row-level attributes.
GeoArrow
Upload GeoArrow geometry directly into GPU vectors and render its nested spatial coordinates.
Float64 Origin Rebasing
Preserve geospatial precision by rebasing Arrow float64 positions near a GPU-friendly local origin.
Text
Draw labels from Arrow string and position columns with GPU-backed text styling.
Durations
Animate a starfield from Arrow duration intervals and time-dependent visibility on the GPU.
Time
Visualize Arrow timestamp values and scrub time-aware records without converting their columns.
Matrices
Map Arrow fixed-size matrix values into GPU attributes that transform instanced mesh geometry.
Particles
Animate a GPU particle field whose initial positions and properties arrive as Arrow columns.
Global Grids
Turn Arrow-encoded DGGS cells into GPU-rendered global grid polygons without repacking rows.
DGGS + time
Render GPU table columns that combine discrete global-grid cells with temporal values and filtering.
GPU-native data
Arrow Layers - deck.gl v10
ArrowPathLayer
Render Arrow-native path columns through deck.gl while keeping variable-length geometry GPU-ready.
ArrowPolygonLayer
Feed Arrow polygon rings and row attributes directly into a deck.gl polygon layer.
ArrowTextLayer
Bind Arrow labels, positions, colors, and sizes directly to deck.gl text rendering.
GPU-Culled Trace
Cull a hierarchical trace on the GPU and label the retained spans with Arrow-backed text.