ImageGroup

Arrange multiple images with consistent sizes and group preview for galleries and attachments.

We are building SnowUI components into interfaces people can use directly in AI conversations. Conversational UI is still in development; this page demonstrates website usage. Supported chat platforms and component versions will be announced after verification. Generating and using SnowUI interfaces inside AI conversations is completely free. It is not a project, uses no project or developer-seat quota, and requires no SnowUI registration, activation, or paid proof.

How to use

Use ImageGroup to organize images under shared configuration. Pair it with ImageViewer for full-screen viewing, zoom, or navigation between images. Express layout and image loading state through the public API.

Choose group layout with layout and shared image size with size.
Image children join the media group automatically. An explicit child size or previewMode overrides group defaults.

Import

import { ImageGroup } from '@snowui-design-system/components';

Usage

Row

Column

Grid

Sizes

Inheritance

Preview modes

Preview override

API Reference

Property	Type	Default	Example	Description
`size`	`ImageGroupSize`	`—`	`size={value}`	Shared size for images in the group.
`layout`	`ImageGroupLayout`	`"row"`	`layout={value}`	Group layout mode.
`previewMode`	`PreviewMode`	`—`	`previewMode={value}`	Explicit preview mode for Image children. When omitted, it is determined by whether the page has a shared Viewer.
`enableResponsive`	`boolean`	`true`	`enableResponsive`	Enable Frame responsive behavior to adjust group layout through its public responsive configuration.
`enableContext`	`boolean`	`true`	`enableContext`	Whether to provide general Frame context to children. Image group size and preview policy still use dedicated group context.
`children`	`Snippet`	`—`	`<ImageGroup>Content</ImageGroup>`	Image content. Images register themselves in the media group and inherit group size and preview policy; explicit child settings take priority.