Capacity Overview

About this block

Capacity Overview shows the number instead of asserting it, a drawn interior map of every compartment, each one numbered, beside a legend that names what it actually holds. 22 liters means nothing until the buyer sees the jacket, the laptop, and the bottle each land somewhere.

Static markup on theme tokens, the compartments are one array driving both the map cells and the sorted legend, so a change in one place updates both. The grid spans give each pocket a proportional footprint.

When to use

Reach for this block for bags, cases, and organizers, where the buying question is will my things fit, not what color. The map deflects the how big is it really ticket and the returns that follow a bad guess.

A natural flow around it on an Ecommerce Pro page:

Before

• Store navbar

After

• Spec sections for the exact dimensions and weight
• Reviews from owners who packed it for real

What you can display

One strong use is a commuter pack with five compartments. Other layouts:

• Luggage interior. Packing cubes and a suit fold mapped across the shell.
• Camera bag. Padded dividers with the body, lenses, and cards placed.
• Toolbox tray. Every socket and driver in its own cut out slot.

Tip: name what each pocket holds in real objects, a phone and keys beats a vague small pocket every time.