Example Frame

A decorative frame with crosshatch pattern background for showcasing content

Preview

Fit (default)

Centered Content

Fits around the content

Fill

Expanded Content

Fills the available space

Fixed

Fixed Grid

Equal grid divisions

Installation

Usage

API Reference

PropTypeDefaultDescription
childrenReact.ReactNode-Content to display inside the frame
size'fixed' | 'fit' | 'fill''fit'Grid sizing mode: fixed uses equal divisions, fit wraps content, fill expands content
classNamestring-Additional CSS classes for the outer container