Skip to content
shadcn.io

shadcn.io is not affiliated with official shadcn/ui

Image Generator AI Block for Solid

A prompt-to-picture form with sample chips, four drawn styles, four aspect ratios and a high detail switch, a result plate with its seed that can be saved as SVG, and a history of six plates that restore their settings.

Framework
UI library

Preview

Preview width

Installation

Part of Pro
Pro unlocks the code and one-line install of every Pro button and text effect, plus the MCP for your AI editor.
Have Pro already? Sign in to open it.Opens here as soon as you're Pro.

Overview

Turn a description into a picture, with this AI image generator for Solid with Ark UI. A compact header names Sketchmere, a sketch generator, and a hairline frame with a plus mark on each corner holds a form at the start and the result at the end. The form has a Textarea with sample chips that fill it, a style radio group of four (Sketch, Flat, Dots, Block, each with a drawn swatch), an aspect Toggle Group (1:1, 4:3, 16:9, 9:16) that changes the plate's shape, a Switch for high detail, and the Shine Button, the only colored control, to generate. The plate takes a Skeleton for under a second, then draws the scene a word in the prompt names (lighthouse, kettle, mountain, bicycle, clock, plant, fish, city), or a surprise plate when no word matches. Under it are its settings and seed, Download SVG and Copy seed, and a history of six plates, newest first, each a button that puts its settings back in the form. The plates are greyscale drawings, never photos. It's built from Textarea, Toggle Group, Switch, Skeleton, Button and Guides, with CSS only.

FAQ

What stays local, and how do I make it real?

Everything. Nothing is generated: the eight scenes are typed as shapes, the word in your prompt picks one, and the seed (worked out from your words and a counter, so a reload repeats it) places it. The status line says so. To make it real, send the form's fields to your image model in generate and show the returned image where the Plate is, keeping the skeleton, the settings list and the history.

What do the controls change?

Every one changes the next plate. Style redraws the same scene as outlines, soft greys, a dot screen or heavy tones; aspect changes the frame's proportions and the size shown; High detail adds fine specks placed from the seed. Changing a control does not redraw the plate you already have, which stays until you press Generate or restore another one.

How does the history work?

Each generated plate joins a list of six, newest first. Pressing one shows it as the result and puts its prompt, style, aspect and detail back in the form, so you can change one thing and draw again. The seventh plate pushes the oldest out. Empty slots are drawn as dashed boxes, so the panel keeps its height.

Is Download SVG a real file?

Yes. The plate's shapes are written into an SVG with named grey fills at the chosen proportions, saved as a file named after its seed, and it opens without the page's styles. Copy seed copies the number, which in your app is what you would store to draw the same plate again.

Is it usable with a keyboard and a screen reader?

Style is a native radio group with a legend, aspect is a toggle group named "Aspect", the switch is named, and the history buttons say "Restore:" with the prompt and settings. Plates are hidden from assistive technology with their settings in text beside them. One polite line says what happened, and an empty prompt is announced there with an icon.

How does it look on a phone?

The form comes first, then the result, then the history. The result stage keeps one height for every aspect, and a tall or wide plate fits inside it, so changing the aspect does not move the page. The history is three plates across.