General
Thumbnail
A thumbnail component
Overview
The Thumbnail component displays a small image or placeholder for use in product lists, galleries, or media grids. Sizing and aspect ratio are configurable so it fits different layouts.
Key Business & UX Benefits
- Gives a consistent way to show small images across the app.
- Loads quickly with appropriate size for list and grid use.
- Keeps layouts aligned with configurable aspect ratio and sizing.
- Works with placeholders when the image is missing or loading.
Pro-Tip from Larry: Use thumbnails in product grids so customers scan many options quickly.
Usage
Thumbnail
Feature List
- Configurable size and aspect ratio
- Image with optional placeholder or fallback
- Theme-aligned styling for borders and radius
- Suitable for product cards, galleries, and media grids
API Reference
| Prop | Default | Type |
|---|---|---|
mediarequired | ||
isSelected | boolean |
| Event | Type |
|---|---|
select | (event: "select"): void |