An interactive dashboard with a live-rotating 3D globe, animated city markers, and glassmorphism panels. Includes a built-in bar or pie chart panel. Switch to mobile layout for an edge-clipped globe with a focused city list. No code needed.
Auto-rotating globe with smooth hover-to-city animation
Animated cloud layer with realistic atmospheric drift
Glassmorphism panels — adapts to dark and light mode
Built-in bar chart and pie chart with entrance animation
Mobile layout: edge-clipped globe left, city panel right
City markers pulse on hover and rotate the globe to that location
Vignette overlay for a cinematic depth effect
Browser chrome mockup with customizable URL bar
All settings are exposed as Framer property controls:
Layout: Desktop or Mobile
Background color
Dark / Light mode
Accent color for chart and markers
City list with title, region, latitude and longitude
Chart types: Bar or Pie
Chart Metric, date range and change badge
Panel position and width
Font picker connected to project asset library
Mobile Layout:
Globe fills the left side with a subtle left-side clip
Right panel shows city list only
Chart-related controls auto-hide when Mobile is selected
Panel width, top and right offset fully adjustable