---
title: "Bento Box Map — Framer component · Best of Framer"
description: "$4.00 · Framer component · by Agung M · Maps. Screenshots, details, and remix links on Best of Framer."
canonical: "https://framer.elliotli.dev/component/bento-box-map"
---

[Home](/)/[Components](/components)/[Maps](/components/category/maps)/Bento Box Map

# Bento Box Map

Multi Office Visualizer

[View on Framer](https://framer.com/marketplace/components/bento-box-map/?via=elliot-li)

![Bento Box Map preview image 1](https://framer.elliotli.dev/og/component/bento-box-map/8c3120b2affa941f/1600x1200.jpg)

## Summary

Multi Office Visualizer

## Description

### The Bento Box Experience

-   **Smart-Sync Navigation:** A sophisticated 70/30 split layout where clicking a location card instantly triggers a smooth flyTo animation, centering the map on that specific office.
    
-   **API-Free Freedom:** Enjoy high-performance interactive mapping without the complexity of Google Maps billing or API configurations.
    
-   **Tactile Sidebar Cards:** Each office card features **Glassmorphism** effects, leader profile photos, and dynamic "Active" states with neon glow accents.
    

### Elite Map Interactivity

-   **Custom SVG Markers:** Say goodbye to generic red pins. BentoMaps uses custom-branded SVG markers that dynamically change size and color based on selection.
    
-   **One-Tap Directions:** Every location includes a "Direct Directions" button that intelligently opens the coordinates in Google Maps for the end-user.
    
-   **Dual-Theme Support:** Toggle between **Dark Mode** (Industrial/Cyberpunk) and **Light Mode** (Clean/Professional) to match your website's art direction instantly.
    

### Pro-Level Engineering

-   **Zero-Lag Panning:** Optimized with smooth easing curves for a high-end, responsive feel during map transitions.
    
-   **Mobile-Adaptive Logic:** The component intelligently detects screen size, switching from a horizontal grid on Desktop to a thumb-friendly vertical stack on Mobile.
    
-   **Granular Customization:** Control everything from the sidebar—latitude/longitude, accent colors, typography, and profile imagery.
    

## Rank history [How rankings work →](/terms#rankings)

-   All · #10278

## Details

- **Author**: Agung M
- **Price**: $4.00
- **Published**: 2026-04-07
- **Updated**: 2026-04-23
- **Added**: 2026-03-26
- **Categories**: Maps

## More like this

-   [Waypoint](/component/waypoint) — Dev Ahsan · $9 — Photo-first locations map
-   [No-key Store Locator](/component/no-key-store-locator) — Sean Weekes · $15 — UK store finder, no Google API key
-   [Geo Office Location](/component/geo-office-location) — Design Foundry · Free — Interactive Global Office Showcase
-   [Map Locator CMS](/component/map-locator-cms) — sherwin · $15 — Map Locator CMS is a flexible, interactive map component for Framer that helps you showcase stores, offices, properties, venues, service…
