Unskinned aspect-ratio layout for caller-supplied content.
Preview
Example source could not be loaded: aspect-ratio-example. Reload this page to retry.Usage
ratio defaults to 1 and is forwarded to CSS aspect-ratio. There is no scale prop, frame, texture or Minecraft primitive counterpart. The example embeds its own image data and alt text, so copying it does not require a website asset. Replace the image with your own resource and preserve integer sampling for pixel art.
Composition
The ratio container supplies geometry only. Install Card separately for a framed image, and choose width/height rules on the child explicitly. Child artwork retains its own provenance and fidelity scope; resizing the container does not establish native pixels.
Installation
Component source
This is the component implementation. Its supporting styles, helpers and resources are also required. See complete manual installation.
import * as React from "react";
import { minecraftClasses as cn, minecraftStyle } from "./minecraft-render";
/** Unskinned layout; original pixel artwork belongs to its children. */
const AspectRatio = ({
ratio = 1,
style,
className,
...props
}: React.ComponentProps<"div"> & {
ratio?: number;Interactive playground
