Image Generating

About this piece

Square preview that starts as a blurred, washed-out photo and sharpens in stages while the percentage climbs and the step label moves from sketching to done, then starts over.

Usage

The import and the props worth knowing about, in one place.

import { Ai48 } from "@/components/beste/piece/ai48";

<Ai48
  src="https://images.unsplash.com/photo-1519627457373-b60a0da1706b?w=300&auto=format&fit=crop&q=60"
  alt="Generated image preview"
  size="1024 x 1024"
  model="image-1"
/>

More AI pieces

View all AI

embedding.vec1,536 dims

[0]cosine similarity ready[15]

Embedding Preview

Vector embedding visualizer with a zero baseline, positive values drawn upward in the tone color and negatives drawn downward in muted.

whiteboard.jpg1920×1080

Analyzing

diagramtextarrows

Vision Input

Attached image card with a tone-tinted thumbnail tile, a scanning line overlay, filename, dimensions, and detected-object chips.

Image Variants

Two-by-two grid of AI-generated image variants. The selected tile gets a primary border.

Epoch7/10

loss0.0421

step 1,280/2,00064%

Training Progress

Training run card with current epoch, step counter, loss value, and a violet progress bar reflecting completion.

stream142 tok/s

The quick brown fox jumps over

Token Stream

Live token visualizer with tone-tinted token chips, tokens-per-second rate, and a pulsing caret at the end.

const slug = (s: string) =>
  s.toLowerCase().replace(/\s+/g, '-');

Generated Code

AI code output card with a language tag, copy and regenerate actions, and a monospace block below.